/* Shared classroom visual language. Fixed docks intentionally have no transformed ancestors. */
:root{--sage:#dae6cf;--peach:#efd8c5;--sky:#d9e8e3;--butter:#eee4bb;--lilac:#e6dfed}
.v-icon{width:24px;height:24px;display:inline-block;flex-shrink:0;vertical-align:middle}
.btn .v-icon{width:20px;height:20px}.shell{padding-top:94px}.capture-stage{display:grid;grid-template-columns:1.05fr 1fr;grid-template-areas:'journey journey' 'copy art' 'actions art' 'disclosure art';column-gap:25px;text-align:left;align-content:center;min-height:calc(100svh - 244px);max-width:1160px;margin:auto}.capture-copy{grid-area:copy;align-self:end;padding-top:24px}.capture-stage h1{font-size:clamp(44px,5.55vw,78px);line-height:1.02}.capture-stage h1 em{color:#647f58}.capture-stage .lead{font-size:16px;max-width:380px;line-height:1.5;margin-top:23px}.capture-stage .eyebrow{margin-bottom:20px}.capture-stage .capture-actions{grid-area:actions;justify-content:flex-start;margin-top:30px;align-self:start}.capture-stage .disclosure{grid-area:disclosure;margin-top:14px;max-width:425px;align-self:start;font-size:10px}.capture-stage .preview-journey{grid-area:journey;justify-content:flex-start;margin:0 0 26px}.preview-journey{display:flex;align-items:center;justify-content:center;gap:12px;font-size:10px;color:#72796a;margin-bottom:29px}.preview-journey>span{display:flex;align-items:center;gap:7px;white-space:nowrap}.preview-journey b{display:grid;place-items:center;border:1px solid #cdd8c5;width:24px;height:24px;border-radius:50%;font-weight:400}.preview-journey .active{color:var(--ink)}.preview-journey .active b{background:var(--ink);color:white;border-color:var(--ink)}.preview-journey i{height:1px;width:25px;background:#cdd8c5}.capture-visual{grid-area:art;position:relative;isolation:isolate;min-width:0;align-self:center;padding:15px 0 50px;display:grid;place-items:center}.scene-halo{position:absolute;z-index:-1;width:95%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#e6edd8 0%,#e6edd836 60%,transparent 72%)}.together-art{width:100%;height:auto;display:block;mix-blend-mode:multiply;border-radius:36px}.capture-visual .together-art{width:115%;max-width:none;animation:art-arrive .8s ease-out both}.scene-tag{position:absolute;z-index:2;background:#fffdf6;box-shadow:0 6px 20px #153c3610;display:flex;align-items:center;gap:7px;padding:10px 15px;border-radius:99px;font-size:11px;border:1px solid #ffffffc9;animation:soft-float 6s ease-in-out infinite}.scene-tag .v-icon{width:17px;height:17px}.tag-think{top:4%;left:7%;background:#d5f68c;transform:rotate(-8deg)}.tag-talk{top:13%;right:0;animation-delay:-2s;background:#f3d6bd}.tag-build{bottom:17%;right:0;animation-delay:-4s;background:#d1e5df}.drop-ticket{position:relative;margin-top:-13px;display:flex;align-items:center;gap:13px;padding:13px 16px;border:1px solid #e0dfce;border-radius:16px;background:#fffdf6;box-shadow:0 8px 18px #153c3612;transform:rotate(-4deg);transition:transform .2s;text-align:left;z-index:3}.drop-ticket:hover,.dragover .drop-ticket{transform:rotate(0) translateY(-3px);border-color:#7f9b68}.drop-ticket>.v-icon{width:33px;height:33px;color:#718064}.drop-ticket>span{font-size:13px;font-weight:600}.drop-ticket small{display:block;font-size:10px;font-weight:400;color:var(--muted);margin-top:4px}.ticket-plus{display:grid;place-items:center;border-radius:50%;width:28px;height:28px;background:var(--lime);font-size:23px!important;margin-left:13px}.floating-dock{box-shadow:0 10px 40px #193b361b}.dock-button{display:inline-flex;align-items:center;justify-content:center;gap:8px}.dock-button .v-icon{width:17px;height:17px}.capture-stage .floating-dock{gap:6px}.capture-stage .floating-dock [data-action="library"]{background:#e6eddc}
.library-stage{max-width:1060px}.library-stage h1{font-size:clamp(43px,5vw,66px)}.activity-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin-top:35px}.activity-row{display:flex;flex-direction:column;gap:0;align-items:stretch;border:1px solid #d9dfd2;border-radius:22px;padding:0;background:#fffdf5;overflow:hidden;transition:transform .2s,box-shadow .2s,border-color .2s;position:relative}.activity-row:hover{transform:translateY(-5px);box-shadow:0 12px 30px #153c3610;border-color:#9fb694}.activity-art{display:block;background:var(--sage);overflow:hidden}.activity-art.peach{background:var(--peach)}.activity-art.sky{background:var(--sky)}.activity-art.butter{background:var(--butter)}.activity-art.lilac{background:var(--lilac)}.activity-art svg{display:block;width:100%;height:auto;transition:transform .4s}.activity-row:hover .activity-art svg{transform:scale(1.04)}.activity-copy{padding:17px 18px 19px;display:flex;flex:1;flex-direction:column}.activity-row .activity-meta{font-size:9px;letter-spacing:.06em;text-transform:uppercase;margin:0 0 10px;color:#5c6d59}.activity-row strong{font-size:20px;line-height:1.2;font-weight:600;letter-spacing:-.04em;min-height:48px}.activity-summary{font-size:11px;line-height:1.5;color:#65756b;margin:9px 0 16px}.activity-open{display:flex;align-items:center;justify-content:space-between;font-size:11px;margin-top:auto}.activity-open .v-icon{width:19px;height:19px}.card>.activity-art{height:150px}.card>.activity-art svg{height:100%;width:100%}
.role{position:relative;border:1px solid #d2ddc5;background:var(--sage);padding:24px;border-radius:24px}.role:nth-child(2){background:var(--peach);border-color:#e6cbb7}.role:nth-child(3){background:var(--sky);border-color:#c7dcd4}.role:nth-child(4){background:var(--butter);border-color:#e1d6aa}.role-heading{display:flex;align-items:center;gap:13px}.role-badge{width:48px;height:48px;border-radius:16px;display:inline-grid;place-items:center;flex-shrink:0;background:#d5edbd;color:#35582a}.role-badge .v-icon{width:26px;height:26px}.role-badge.recorder,.table-seat.recorder{background:#f1caaa;color:#783b25}.role-badge.checker,.table-seat.checker{background:#bfdfd5;color:#285c51}.role-badge.reporter,.table-seat.reporter{background:#e7d88e;color:#67551d}.role-badge.facilitator,.table-seat.facilitator{background:#d5edbd;color:#35582a}.role p{margin-top:16px;line-height:1.6}.role strong{font-size:19px}.role .role-number{position:absolute;top:20px;right:23px;color:#153c364d;font-size:11px}.role .stem{border-top:1px solid #153c3617;padding-top:13px}.review-stage .role .stem{display:block}.roles-grid{gap:15px;max-width:820px;margin:24px auto}.review-stage .roles-grid{text-align:left}.review-stage .review-prompt{background:#fffdf5;border:1px solid #dce2d2;border-radius:25px;padding:27px 32px;font-size:clamp(19px,2.1vw,27px);line-height:1.6;text-align:left;box-shadow:0 5px 18px #153c3605}.review-stage h1{font-size:clamp(40px,5vw,64px)}.review-stage .segmented{margin-top:25px;margin-bottom:22px}.review-stage .materials{display:flex;align-items:center;justify-content:center;gap:8px;line-height:1.5}.review-stage .materials .v-icon{width:17px;height:17px}.review-stage .review-chips .chip{display:flex;align-items:center;gap:7px;background:#e9eedf;border-color:transparent}.review-chips .v-icon{width:16px;height:16px}
.group{position:relative;border-radius:22px;padding:21px}.group h3{text-align:center}.group-table{height:150px;max-width:220px;margin:10px auto 7px;position:relative}.table-center{position:absolute;inset:34px 45px;background:#e5e8da;border:2px solid #d4dcc8;border-radius:45%;display:grid;place-items:center;color:#9bad8e}.table-center .v-icon{width:28px;height:28px}.table-seat{position:absolute;display:grid;place-items:center;width:37px;height:37px;border-radius:50%;font-size:15px;font-weight:600;border:3px solid #fffdf5;box-shadow:0 0 0 1px #d5decd;left:calc(50% - 18px)}.seat-pos-0{top:2px}.seat-pos-1{left:auto;right:13px;top:57px}.seat-pos-2{top:110px}.seat-pos-3{left:13px;top:57px}.group-table:has(.table-seat:nth-child(3):last-child) .seat-pos-1{left:calc(50% - 18px);right:auto;top:110px}.member{align-items:center;gap:8px;padding:9px 0}.member .seat{display:flex;align-items:center;gap:8px}.member .role-badge{height:25px;width:25px;border-radius:9px}.member .role-badge .v-icon{height:16px;width:16px}.member .role-name{font-size:11px}
.phase-path{display:flex;justify-content:center;gap:27px;margin:0 auto 28px;max-width:510px}.phase-stop{display:flex;position:relative;flex-direction:column;align-items:center;gap:8px;flex:1;border:0;background:none;padding:0;color:#78856e;font:inherit;min-width:42px}.phase-stop:not(:last-child)::after{content:'';height:1px;background:#cdd8c5;position:absolute;top:21px;left:calc(50% + 29px);width:calc(100% - 30px)}.phase-node{display:grid;place-items:center;width:43px;height:43px;border:1px solid #d6dfce;background:#eef1e5;border-radius:50%;transition:background .2s,color .2s,transform .2s}.phase-node .v-icon{width:21px;height:21px}.phase-label{font-size:10px;letter-spacing:.02em}.phase-stop.current{color:var(--ink)}.phase-stop.current .phase-node{background:var(--ink);color:#e5f6ca;border-color:var(--ink);box-shadow:0 0 0 4px #dfe8d6}.phase-stop.current .phase-label{font-weight:600}.phase-stop:hover .phase-node{transform:translateY(-2px)}.phase-emblem{width:76px;height:76px;border-radius:24px;background:#dae8c8;color:#3a603b;display:grid;place-items:center;position:relative;margin:0 auto 20px;transform:rotate(-7deg)}.phase-emblem .v-icon{width:39px;height:39px;transform:rotate(7deg)}.phase-emblem.phase-1{background:#eee2a9;color:#796523}.phase-emblem.phase-2{background:#f0d3bd;color:#8a5132}.phase-emblem.phase-3{background:#cde2d9;color:#336755}.phase-emblem.phase-4{background:#dfd5eb;color:#69597d}.emblem-spark{position:absolute;right:-8px;top:-6px;width:18px;height:18px;background:#d3ecaf;border:4px solid var(--paper);border-radius:50%}.class-stage{margin:0 auto}.class-stage h1{font-size:clamp(48px,6vw,82px)}.class-stage .eyebrow{margin-bottom:16px;font-size:9px}.class-stage .class-direction{margin-top:20px;font-size:clamp(18px,2vw,25px)}.class-task{background:#fffdf5;border:1px solid #dce2d2;padding:23px 27px;border-radius:22px;margin-top:24px}.class-task p{font-size:clamp(18px,2vw,26px);line-height:1.55}.class-links{margin-top:20px}.live-dock .clock{position:relative;border-radius:99px;padding:11px 16px;margin:0 4px;background:linear-gradient(var(--paper),var(--paper)) padding-box,conic-gradient(#789565 calc(var(--timer-progress,1)*100%),#dce2d4 0) border-box;border:3px solid transparent;font-size:26px;min-width:94px;line-height:1.1}.timeup .clock{background:linear-gradient(var(--paper),var(--paper)) padding-box,linear-gradient(#b86746,#b86746) border-box}.recap>.check{width:80px;height:80px;border-radius:25px;background:var(--lime);display:grid;place-items:center;margin:27px 0}.recap>.check .v-icon{width:43px;height:43px}.stats .stat{padding:20px;border-radius:20px;background:#e4ecd8;flex:1}.stats .stat:nth-child(2){background:#f1ddca}.stats .stat:nth-child(3){background:#d9e7e0}
.student-welcome{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:45px;max-width:1000px;margin:25px auto}.student-welcome .together-art{border-radius:35px}.student-welcome-copy{text-align:left}.student-welcome h1{font-size:clamp(46px,6vw,70px)}.student-welcome .student-join{margin:25px 0 0;max-width:360px}.student-join input{background:#fffdf7;min-height:58px}.student-join .btn{justify-content:space-between}.student-welcome .eyebrow{margin-bottom:17px}.student-role-pill{display:inline-flex;align-items:center;gap:9px;margin:0 auto 22px;padding:6px 14px 6px 6px;border:1px solid #d1dcca;border-radius:100px;background:#fffdf5;font-size:11px}.student-role-pill .role-badge{width:30px;height:30px;border-radius:50%}.student-role-pill .role-badge .v-icon{width:18px;height:18px}.student-stage .phase-path{max-width:390px;margin-bottom:24px;gap:15px}.student-stage .phase-node{width:35px;height:35px}.student-stage .phase-node .v-icon{width:17px;height:17px}.student-stage .phase-stop::after{top:17px;left:calc(50% + 24px);width:calc(100% - 32px)}.student-stage .phase-label{font-size:9px}.student-stage h1{font-size:clamp(43px,5.4vw,64px)}.student-stage .eyebrow{margin-bottom:15px}.student-stage .my-role{display:flex;align-items:center;gap:9px;justify-content:center;background:#e6eddb;border-radius:16px;padding:13px 18px;color:#3e5f45}.student-stage .segmented button{display:flex;align-items:center;gap:8px}.student-stage .segmented .v-icon{width:18px;height:18px}.student-stage .response-area textarea{background:#fffdf7;box-shadow:0 5px 25px #153c3605;line-height:1.7}.student-stage .student-task{background:#fffdf7}.student-wait-art{max-width:270px;margin:0 auto 20px}.waiting-pulse{display:inline-block;width:8px;height:8px;margin-right:6px;border-radius:50%;background:#79966b;box-shadow:0 0 0 5px #e2ead7;animation:pulse 2s ease-in-out infinite}.build-orbit i .v-icon{width:29px;height:29px}.build-orbit i{border-radius:21px}.build-orbit{animation:none}.build-orbit i{animation:soft-float 3s ease-in-out infinite}.build-orbit i:nth-child(2){animation-delay:-.5s}.build-orbit i:nth-child(3){animation-delay:-1s}.build-orbit i:nth-child(4){animation-delay:-1.5s}
@keyframes art-arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes soft-float{50%{translate:0 -5px}}@keyframes pulse{50%{opacity:.45}}
@media(min-width:1350px){.capture-stage{min-height:calc(100svh - 280px)}.capture-visual .together-art{width:120%}}
@media(max-width:1000px){.activity-list{grid-template-columns:repeat(3,minmax(0,1fr))}.capture-stage h1{font-size:clamp(42px,5.8vw,65px)}.capture-stage .btn{padding:16px 19px;font-size:12px}.capture-stage .capture-actions{gap:8px}.capture-visual .together-art{width:111%}.capture-stage{column-gap:10px}.tag-talk{right:-8px}.tag-build{bottom:20%}}
@media(max-width:760px){.capture-stage{grid-template-columns:1fr;grid-template-areas:'copy' 'art' 'actions' 'disclosure';text-align:center;min-height:0;max-width:540px}.capture-stage>.preview-journey{display:none}.capture-copy{padding-top:0}.capture-stage h1{font-size:clamp(40px,7vw,58px)}.capture-stage .lead{font-size:14px;max-width:none;margin-top:16px}.capture-stage .eyebrow{font-size:9px;margin-bottom:15px}.capture-visual{width:min(390px,100%);margin:18px auto 0;padding:3px 18px 6px}.capture-visual .together-art{width:100%;border-radius:22px}.capture-stage .capture-actions{justify-content:center;margin-top:21px}.capture-stage .disclosure{max-width:none;margin:14px auto 0}.capture-visual .drop-ticket{padding:10px 13px;gap:8px;margin-top:-15px}.drop-ticket small{font-size:9px}.drop-ticket>span{font-size:11px}.drop-ticket>.v-icon{width:26px;height:26px}.ticket-plus{width:24px;height:24px;margin-left:7px}.scene-tag{padding:7px 11px;font-size:10px}.scene-tag .v-icon{height:14px;width:14px}.tag-think{left:5%;top:0}.tag-talk{right:1%;top:13%}.tag-build{bottom:15%;right:3%}.activity-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.activity-row strong{font-size:18px}.library-stage h1{font-size:45px}.activity-copy{padding:15px}.activity-summary{font-size:11px}.student-welcome{grid-template-columns:1fr;gap:10px;margin:5px auto 0}.student-welcome>.together-art{width:230px;margin:0 auto;order:2}.student-welcome-copy{text-align:center}.student-welcome .student-join{text-align:left;margin:22px auto 0}.student-welcome h1{font-size:48px}.student-welcome .eyebrow{font-size:9px}.preview-journey{font-size:9px;gap:8px}.preview-journey i{width:14px}.preview-journey b{width:21px;height:21px}.review-stage .review-prompt{padding:22px;font-size:21px}.role-heading{gap:12px}.role-badge{width:42px;height:42px;border-radius:14px}.role strong{font-size:17px}.role p{font-size:13px}.role .role-number{top:17px;right:17px}.class-task{padding:20px}.class-task p{font-size:20px}.phase-emblem{height:62px;width:62px;border-radius:19px;margin-bottom:16px}.phase-emblem .v-icon{width:32px;height:32px}.phase-path{gap:16px;max-width:430px}.class-direction{font-size:20px}.class-links{gap:6px;flex-wrap:wrap}.class-links .chip{font-size:11px;padding:10px 13px}.live-dock .clock{font-size:21px;min-width:74px;padding:11px 8px;margin:0 2px}.stats .stat{padding:15px}.stats{gap:10px}}
@media(max-width:400px){.shell{width:calc(100% - 32px)}.capture-stage h1{font-size:40px}.capture-stage .lead{font-size:12px}.capture-stage .btn{padding:15px 17px;font-size:11px}.capture-visual{width:320px;max-width:100%;margin-top:15px}.capture-stage .capture-actions{margin-top:18px}.capture-stage .disclosure{font-size:9px}.activity-copy{padding:13px}.activity-row strong{font-size:17px}.activity-summary{font-size:10px}.activity-row .activity-meta{font-size:8px}.preview-journey{gap:5px;font-size:8px}.preview-journey>span{gap:4px}.preview-journey i{width:9px}.phase-path{gap:12px}.phase-label{font-size:9px}.phase-node{width:37px;height:37px}.phase-stop:not(:last-child)::after{top:18px;left:calc(50% + 24px);width:calc(100% - 25px)}}
@media(max-height:760px) and (min-width:761px){.shell{padding-top:85px;padding-bottom:130px}.capture-stage{min-height:calc(100svh - 215px)}.capture-stage h1{font-size:clamp(42px,5.3vw,64px)}.capture-stage .preview-journey{margin-bottom:16px}.capture-copy{padding-top:12px}.capture-stage .capture-actions{margin-top:22px}.capture-visual{padding-bottom:30px}.class-stage .phase-path{margin-bottom:22px}.class-stage .phase-emblem{display:none}.class-stage h1{font-size:58px}.class-stage .class-task{margin-top:20px}.class-direction{margin-top:17px!important}.class-stage .class-task p{font-size:22px}.student-welcome{margin-top:0}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media print{.preview-journey,.phase-path,.phase-emblem,.group-table,.activity-art{display:none!important}.role-badge{width:24px;height:24px;background:transparent!important;color:#111!important;border:1px solid #777;border-radius:7px}.role-badge .v-icon{width:16px;height:16px}.role-heading{gap:8px}.role-number{display:none}.role .stem{display:block!important}.member .role-badge{display:none}.role p{margin-top:8px}.group h3{text-align:left}.role{padding:12px;border:1px solid #bbb}.roles-grid{gap:10px}.role strong{font-size:12pt}}
@media(max-width:760px){.desktop-break{display:none}}
.capture-visual .together-art{width:100%;max-width:100%}
.capture-stage>.disclosure .fine{font-size:10px}
.review-stage{margin:0 auto}.review-stage .eyebrow{margin-bottom:14px}.review-stage .preview-journey{margin-bottom:22px}.review-stage .segmented{margin:22px 0 10px}.review-stage .role .stem{display:none}.review-stage .role{padding:20px}.review-stage .role p{margin-top:12px}
@media(max-height:760px) and (min-width:761px){.review-stage h1{font-size:52px}.review-stage .roles-grid{margin:18px auto}.review-stage .role{padding:17px 20px}.review-stage .review-chips{margin:20px 0 12px}}
@media print{.review-stage .role .stem{display:block}}
@media(max-height:760px) and (min-width:761px){.class-stage .class-task{padding:18px 24px;margin-top:18px}.class-stage .class-task p{font-size:20px;line-height:1.5}.class-stage .class-direction{font-size:21px;margin-top:15px!important}.class-stage .phase-path{margin-bottom:17px}.class-stage .class-links{margin-top:17px}}
@media(max-width:600px){.capture-stage .floating-dock{gap:3px}.capture-stage .floating-dock .dock-button{padding:14px 10px;gap:5px;font-size:11px}.capture-stage .floating-dock .v-icon{width:15px;height:15px}}
@media(max-width:600px){.student-stage{margin:0 auto}.student-stage .phase-path{margin-bottom:18px}.student-role-pill{margin-bottom:17px}.student-direction{margin-top:16px;font-size:18px}.student-stage .student-task{margin:18px 0}.student-stage .my-role{font-size:12px;padding:11px 13px}.student-stage .segmented{margin:15px 0 12px}.student-stage .response-area textarea{font-size:18px;line-height:1.5;min-height:150px;height:165px}.student-stage #save-state{font-size:10px}}
@media(max-width:360px){.capture-stage .floating-dock{gap:1px}.capture-stage .floating-dock .dock-button{padding:13px 8px;gap:4px;font-size:10px}.capture-stage .floating-dock .v-icon{width:13px;height:13px}}
@media(max-width:760px){.capture-stage{grid-template-columns:minmax(0,1fr)}.capture-visual{width:100%;max-width:390px}}
@media(max-width:360px){.capture-stage .capture-actions .btn{padding:14px 13px}}
