:root{--color-primary: #1f5f5b;--color-primary-dark: #183b38;--color-academic-blue: #1e3a5f;--color-background: #f7faf9;--color-surface: #ffffff;--color-surface-soft: #eef6f4;--color-border: #d8e5e2;--color-border-strong: #afc7c2;--color-identity: #e8f2f0;--color-communication: #ede9f7;--color-routine: #fff3d6;--color-curricular: #e8f0fa;--color-game: #f4eaf2;--color-cause-effect: #eaf6ef;--color-success: #2f7d69;--color-neutral: #536b73;--color-warning: #b7791f;--color-danger-soft: #fbeaea;--color-text: #183b38;--color-text-muted: #536b73;--color-text-light: #6d7f7a;--shadow-soft: 0 8px 24px rgba(24, 59, 56, .08);--shadow-card: 0 4px 14px rgba(24, 59, 56, .07);--motion-fast: .12s;--motion-normal: .18s;--motion-slow: .28s;--motion-ease: cubic-bezier(.22, 1, .36, 1);--motion-bounce-soft: cubic-bezier(.34, 1.56, .64, 1);--radius-sm: 10px;--radius-md: 16px;--radius-lg: 24px;--radius-xl: 32px;color:var(--color-text);background:var(--color-background);font-family:Atkinson Hyperlegible,Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #c46a40;outline-offset:3px}fieldset{min-width:0;margin:0;padding:0;border:0}legend{width:100%;margin:0 0 1rem;padding:0;color:#1f3f3b;font-weight:800}label{display:grid;gap:.4rem;color:#263b38;font-weight:700}input,select,textarea{width:100%;min-height:2.75rem;border:1px solid #c7d4d0;border-radius:8px;background:#fff;color:#172321;padding:.7rem .85rem}textarea{min-height:6rem;resize:vertical}.app-shell{min-height:100vh}.topbar{position:sticky;z-index:10;top:0;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem clamp(1rem,4vw,3rem);border-bottom:1px solid #dce5e1;background:#fffffff0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.brand-button{border:0;background:transparent;color:#25635d;font-size:1.25rem;font-weight:900}.main-nav{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.5rem}.nav-button,.text-button{border:0;background:transparent;color:#36524d;font-weight:800}.nav-button{min-height:2.5rem;border-radius:8px;padding:.55rem .85rem}.nav-button.active{background:#e3efec;color:#1f5b55}.app-main{width:min(1180px,100%);margin:0 auto;padding:2rem clamp(1rem,4vw,3rem) 4rem}.app-message{display:flex;align-items:center;justify-content:space-between;gap:1rem;width:min(1180px,calc(100% - 2rem));margin:1rem auto 0;border:1px solid #cfe4dd;border-radius:8px;background:#eef8f4;padding:.85rem 1rem;color:#1f4f49;font-weight:700}.app-message button{border:0;background:transparent;color:#1f4f49;font-weight:800}.home-page{display:grid;gap:2rem;min-height:calc(100vh - 8rem);align-content:center}.home-intro{display:grid;gap:.8rem;max-width:56rem}.eyebrow{margin:0;color:#7b4b2e;font-size:.88rem;font-weight:900;text-transform:uppercase}h1,h2,p{overflow-wrap:anywhere}h1{margin:0;color:#163b37;font-size:3.4rem;line-height:1}h2{margin:0;color:#1f3f3b;font-size:1.25rem;line-height:1.2}.lead{max-width:46rem;margin:0;color:#3c4d49;font-size:1.25rem;line-height:1.5}.primary-actions,.heading-actions,.row-actions,.sticky-actions,.asset-actions{display:flex;flex-wrap:wrap;gap:.75rem}.primary-button,.secondary-button,.danger-button{display:inline-flex;align-items:center;justify-content:center;min-height:2.85rem;border-radius:8px;padding:.72rem 1rem;font-weight:900;text-align:center;text-decoration:none}.primary-button{border:1px solid #1f5b55;background:#25635d;color:#fff}.secondary-button{border:1px solid #b9cac6;background:#fff;color:#213d39}.danger-button{border:1px solid #d6b2a3;background:#fff3ee;color:#8d3e28}.small{min-height:2.35rem;padding:.48rem .7rem;font-size:.92rem}.home-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.home-summary>div,.panel-section,.control-group,.activity-row,.template-card,.template-preview,.result-row,.empty-state,.validation-box{border:1px solid #dce5e1;border-radius:8px;background:#fff;box-shadow:0 10px 30px #163b370f}.home-summary>div{display:grid;gap:.4rem;padding:1.2rem}.home-summary strong{color:#163b37}.home-summary span,.activity-row p,.activity-row span,.template-card p,.template-preview p,.result-summary p,.empty-state p{color:#52625f}.page-heading{display:grid;gap:.5rem;margin-bottom:1.5rem}.inline-heading{display:flex;align-items:end;justify-content:space-between;gap:1rem}.editor-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(20rem,.75fr);gap:1rem;align-items:start}.editor-form,.editor-side,.results-list,.activity-list{display:grid;gap:1rem}.panel-section,.control-group,.validation-box{padding:1.1rem}.panel-section>legend,.control-group>legend{float:left}.panel-section>legend+*,.control-group>legend+*{clear:both}.two-column{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem}.switch-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}.switch-row label,.switch-inline,.radio-label{display:flex;align-items:center;gap:.55rem}.switch-row input,.switch-inline input,.radio-label input{width:1.15rem;min-height:1.15rem}.segmented-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.4rem}.segment{min-height:3rem;border:1px solid #b9cac6;border-radius:8px;background:#fff;color:#253b38;font-weight:800}.segment.active{border-color:#25635d;background:#dff0eb;color:#1f4f49}.visual-support-controls{overflow:hidden}.visual-support-controls .segmented-grid{grid-template-columns:repeat(auto-fit,minmax(5.15rem,1fr));width:100%}.visual-support-controls .segment{display:inline-flex;align-items:center;justify-content:center;width:100%;min-width:0;min-height:4.35rem;padding:.58rem .5rem;line-height:1.15;text-align:center;white-space:normal;overflow-wrap:anywhere}.options-editor{display:grid;gap:.8rem}.option-editor{display:grid;gap:.75rem;border:1px solid #e2e9e6;border-radius:8px;padding:1rem;background:#fbfdfc}.option-editor-header,.result-summary{display:flex;justify-content:space-between;gap:1rem}.sticky-actions{position:static;align-items:stretch;padding:.8rem;border:1px solid #dce5e1;border-radius:8px;background:#fff}.validation-box{color:#783718}.validation-box strong{display:block;margin-bottom:.5rem}.validation-box ul{margin:0;padding-left:1.2rem}.activity-list,.results-list{grid-template-columns:1fr}.activity-row{display:grid;grid-template-columns:1fr;gap:1rem;align-items:stretch;padding:1rem}.activity-row h2,.activity-row p,.template-card h2,.template-card p,.template-preview h2,.template-preview p{margin:0 0 .35rem}.activity-meta{display:grid;justify-items:center;min-width:0;text-align:center}.row-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(8.5rem,1fr));width:100%;justify-content:stretch}.form-note{margin:0;border-left:4px solid #4f6f9f;background:#f1f5ff;color:#33435f;padding:.75rem .85rem;font-weight:700}.template-library-page{display:grid;gap:1rem}.template-count{align-self:end;border-radius:8px;background:#f1e7dd;color:#74482e;padding:.55rem .75rem;font-weight:900}.template-tools{display:grid;gap:1rem}.template-search{max-width:42rem}.template-filter{display:grid;grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));gap:.45rem}.template-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(19rem,.75fr);gap:1rem;align-items:start}.template-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.template-card,.template-preview{display:grid;gap:1rem;padding:1rem}.template-card.selected{border-color:#4f6f9f;box-shadow:0 12px 34px #4f6f9f29}.template-card-main{display:grid;grid-template-columns:4.4rem minmax(0,1fr);gap:.9rem;align-items:start}.template-icon{display:grid;min-height:4.4rem;place-items:center;border-radius:8px;background:#eef4fb;color:#314d78;font-size:.86rem;font-weight:900;text-align:center}.template-category{color:#7b4b2e;font-size:.78rem;font-weight:900;text-transform:uppercase}.template-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem;margin:0}.template-facts>div{border-radius:8px;background:#f4f7f6;padding:.6rem}.template-facts dt{color:#60706d;font-size:.72rem;font-weight:900;text-transform:uppercase}.template-facts dd{margin:.2rem 0 0;color:#173f39;font-weight:900}.template-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}.template-preview{position:sticky;top:6rem}.inline-template-preview{display:none}.template-preview-heading{display:grid;gap:.35rem}.preview-block{display:grid;gap:.45rem;border-top:1px solid #e4ebe8;padding-top:.85rem}.preview-block strong{color:#1f3f3b}.preview-block ul{margin:0;padding-left:1.1rem;color:#52625f}.preview-options,.tag-list{display:flex;flex-wrap:wrap;gap:.45rem}.preview-options span,.tag-list span{border-radius:8px;background:#eef3f1;color:#203b37;padding:.45rem .6rem;font-weight:800}.student-main{min-height:100vh}.student-mode{position:relative;display:grid;min-height:100vh;align-content:start;gap:1.2rem;padding:1.2rem}.student-mode.background-light{background:#f7faf8;color:#142421}.student-mode.background-dark{background:#152321;color:#fff}.student-mode.contrast-high{background:#fff;color:#000}.student-toolbar{display:flex;justify-content:space-between;gap:.75rem}.student-quiet-button,.student-exit-button{min-height:2.55rem;border:1px solid rgba(33,61,57,.24);border-radius:8px;background:#ffffffb3;color:inherit;padding:.55rem .75rem;font-weight:800}.student-exit-button{opacity:.52}.student-instruction{display:grid;justify-items:center;gap:.6rem;text-align:center}.student-instruction p{margin:0;color:inherit;font-size:1.1rem;font-weight:800;opacity:.72}.student-instruction h1{max-width:68rem;color:inherit;font-size:2.7rem;line-height:1.1}.student-note{justify-self:center;margin:0;border-radius:8px;background:#fff4df;padding:.7rem 1rem;color:#6e4719;font-weight:800}.student-options{display:grid;width:min(100%,80rem);min-height:28rem;margin:0 auto;gap:1.2rem;align-items:stretch}.options-2,.options-3,.options-4{grid-template-columns:repeat(2,minmax(0,1fr))}.options-6{grid-template-columns:repeat(3,minmax(0,1fr))}.option-card{display:grid;grid-template-rows:minmax(8rem,1fr) auto;align-items:center;justify-items:center;gap:.85rem;min-height:16rem;border:4px solid transparent;border-radius:8px;background:#fff;color:#142421;padding:1rem;box-shadow:0 18px 45px #163b3721;transition:transform .16s ease,border-color .16s ease,opacity .16s ease}.card-medium{min-height:13rem}.option-card.selected{border-color:#4f6f9f}.option-card.support-frame{border-color:#2f8f6f}.option-card.support-grow{transform:scale(1.035)}.option-card.support-dim{opacity:.48}.option-card.no-image{grid-template-rows:1fr;place-items:center}.option-card.no-image .option-text{max-width:90%;font-size:clamp(3rem,7vw,5.4rem)}.option-image{width:min(100%,18rem);max-height:14rem;object-fit:contain}.option-text{color:inherit;font-size:2.2rem;font-weight:900;line-height:1.1;text-align:center}.feedback-overlay{position:fixed;z-index:20;inset:auto 1.2rem 1.2rem;display:grid;justify-items:center;gap:.75rem;width:min(42rem,calc(100% - 2.4rem));margin:0 auto;border-radius:8px;padding:1.2rem;text-align:center;box-shadow:0 20px 60px #0000002e}.feedback-overlay.positive{background:#e5f6ee;color:#17463d}.feedback-overlay.neutral{background:#eef2f5;color:#263b48}.feedback-overlay strong{font-size:1.7rem;line-height:1.2}.feedback-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:.65rem}.feedback-actions .secondary-button{min-width:11rem;background:#ffffffdb}.feedback-visual{display:grid;width:min(10rem,32vw);aspect-ratio:1;place-items:center;border:6px solid rgba(47,143,111,.24);border-radius:999px;background:#2f8f6f;color:#fff;box-shadow:0 18px 45px #2f8f6f47;font-size:clamp(4.5rem,12vw,7rem);font-weight:900;line-height:1}.feedback-visual img,.feedback-overlay>img{max-width:9rem;max-height:9rem;object-fit:contain}.feedback-visual img{width:100%;height:100%;border-radius:999px;background:#fff}.animation-gentle-pop{animation:gentle-pop .22s ease-out}.animation-soft-confetti{animation:soft-confetti .52s ease-out}@keyframes gentle-pop{0%{transform:translateY(10px) scale(.98);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}@keyframes soft-confetti{0%{transform:translateY(12px);opacity:0}60%{transform:translateY(-4px);opacity:1}to{transform:translateY(0)}}.click-test-page{display:grid;gap:1.4rem}.click-target{display:grid;width:min(100%,48rem);min-height:18rem;place-items:center;justify-self:center;border:4px solid #25635d;border-radius:8px;background:#e5f4ef;color:#173f39;font-size:2.5rem;font-weight:900}.click-target.pulse{animation:click-pulse .24s ease-out}@keyframes click-pulse{50%{transform:scale(1.02);background:#d9e8ff}}.test-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.test-stats>div,.test-controls{display:grid;gap:.4rem;border:1px solid #dce5e1;border-radius:8px;background:#fff;padding:1rem}.test-stats strong{color:#1f5b55;font-size:2rem}.test-controls{width:min(100%,48rem);justify-self:center}.result-row{display:grid;gap:1rem;padding:1rem}.result-summary{align-items:start}.result-summary h2,.result-summary p{margin:0 0 .35rem}.result-summary dl{display:grid;grid-template-columns:repeat(5,minmax(5rem,1fr));gap:.6rem;margin:0}.result-summary dl>div{border-radius:8px;background:#f3f6f5;padding:.7rem}.result-summary dt{color:#52625f;font-size:.78rem;font-weight:900;text-transform:uppercase}.result-summary dd{margin:.2rem 0 0;color:#173f39;font-size:1.15rem;font-weight:900}.empty-state{padding:1.2rem}.empty-state h2,.empty-state p{margin:0 0 .4rem}@media (prefers-reduced-motion: reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@media (max-width: 920px){h1{font-size:2.5rem}.topbar,.inline-heading,.activity-row,.result-summary{align-items:stretch;flex-direction:column}.topbar{display:grid}.main-nav,.row-actions,.heading-actions{justify-content:start}.home-summary,.editor-grid,.template-layout,.test-stats{grid-template-columns:1fr}.segmented-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.student-options,.options-2,.options-3,.options-4,.options-6{grid-template-columns:1fr}.template-preview{position:static}.sidebar-template-preview{display:none}.inline-template-preview{display:grid}.result-summary dl{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 620px){.app-main{padding-top:1.2rem}h1{font-size:2rem}.lead{font-size:1.08rem}.two-column,.switch-row{grid-template-columns:1fr}.primary-button,.secondary-button,.danger-button{width:100%}.template-grid,.template-card-main,.template-facts,.template-actions{grid-template-columns:1fr}.student-mode{padding:.75rem}.student-toolbar{align-items:stretch;flex-direction:column}.student-instruction h1{font-size:2rem}.option-text{font-size:1.6rem}.option-card.no-image .option-text{font-size:clamp(2.5rem,14vw,4rem)}.feedback-overlay strong{font-size:1.35rem}}body{background:linear-gradient(180deg,#eef6f4bd,#f7faf900 18rem),var(--color-background);color:var(--color-text)}button,input,select,textarea{letter-spacing:0}button:disabled,input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;opacity:.58}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:4px solid rgba(31,95,91,.35);outline-offset:3px}input,select,textarea{min-height:3rem;border-color:var(--color-border-strong);border-radius:var(--radius-sm);color:var(--color-text)}.topbar{display:grid;grid-template-columns:minmax(15rem,1fr) auto;align-items:center;gap:1.25rem;border-bottom:1px solid var(--color-border);background:#fffffff0;padding:.8rem clamp(1rem,4vw,3rem);box-shadow:0 2px 16px #183b380d}.topbar-brand{display:grid;gap:.15rem;justify-items:start;min-width:0}.topbar-brand span{color:var(--color-text-muted);font-size:.9rem;font-weight:500}.brand-button{color:var(--color-primary);font-size:1.28rem;font-weight:700}.topbar-actions{display:flex;align-items:center;justify-content:flex-end;gap:.75rem;min-width:0}.main-nav{justify-content:flex-end;gap:.35rem}.nav-button{min-height:2.55rem;border:1px solid transparent;border-radius:999px;color:var(--color-text-muted);padding:.55rem .85rem;font-size:.95rem;font-weight:600}.nav-button:hover,.text-button:hover{background:var(--color-surface-soft);color:var(--color-primary-dark)}.nav-button.active{border-color:var(--color-border);background:var(--color-surface-soft);color:var(--color-primary-dark);box-shadow:inset 0 0 0 1px #1f5f5b14}.primary-button,.secondary-button,.danger-button,.utility-button{min-height:3rem;border-radius:var(--radius-sm);font-weight:700;transition:background .14s ease,border-color .14s ease,color .14s ease,transform .12s ease,box-shadow .14s ease}.primary-button{border-color:var(--color-primary);background:var(--color-primary);color:#fff;box-shadow:0 6px 16px #1f5f5b29}.primary-button:hover{border-color:var(--color-primary-dark);background:var(--color-primary-dark)}.secondary-button{border-color:var(--color-border-strong);background:var(--color-surface);color:var(--color-primary-dark)}.secondary-button:hover{border-color:var(--color-primary);background:var(--color-surface-soft)}.utility-button{display:inline-flex;align-items:center;justify-content:center;min-height:2.8rem;border:1px solid var(--color-border);background:var(--color-surface-soft);color:var(--color-primary-dark);padding:.62rem .9rem;white-space:nowrap}.utility-button:hover{border-color:var(--color-border-strong);background:#e4f0ed}.primary-button:active,.secondary-button:active,.danger-button:active,.utility-button:active,.nav-button:active,.segment:active{transform:scale(.98)}.danger-button{border-color:#e8beb5;background:var(--color-danger-soft);color:#8d3e28}.small{min-height:2.5rem;padding:.52rem .72rem}.app-main{width:min(1240px,100%);padding:2rem clamp(1rem,4vw,2.5rem) 4rem}.app-main-editor{width:min(1760px,100%)}.page-heading{gap:.55rem;margin-bottom:1.25rem}.page-heading h1,.home-intro h1{color:var(--color-primary-dark);font-size:clamp(2rem,4vw,2.5rem);font-weight:700;line-height:1.05}.home-intro .eyebrow{text-transform:none}.eyebrow{color:#7b4b2e;font-size:.78rem;font-weight:700;letter-spacing:0}.page-subtitle,.lead{max-width:46rem;margin:0;color:var(--color-text-muted);font-size:1rem;line-height:1.5}.home-page{align-content:start;min-height:auto;padding-top:1rem}.home-summary>div,.panel-section,.control-group,.activity-row,.template-card,.template-preview,.result-row,.empty-state,.validation-box,.test-stats>div,.test-controls{border-color:var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);box-shadow:var(--shadow-card)}.home-summary>div{border-left:4px solid var(--color-primary)}.template-library-page{gap:1.1rem}.template-count{align-self:center;border:1px solid var(--color-border);border-radius:999px;background:var(--color-surface-soft);color:var(--color-primary-dark);font-size:.88rem;font-weight:700}.template-tools{grid-template-columns:minmax(14rem,28rem) minmax(0,1fr);align-items:end;gap:1rem;margin-bottom:.35rem}.template-search{max-width:none}.template-filter{display:flex;flex-wrap:wrap;gap:.5rem}.segment{min-height:2.6rem;border-color:var(--color-border-strong);border-radius:999px;color:var(--color-primary-dark);padding:.48rem .78rem;font-size:.9rem;font-weight:600}.segment:hover{border-color:var(--color-primary);background:var(--color-surface-soft)}.segment.active{border-color:var(--color-primary);background:var(--color-primary);color:#fff}.template-layout{display:block}.template-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.template-card{min-height:0;border-radius:var(--radius-md);padding:.95rem;box-shadow:var(--shadow-card)}.template-card.selected{border-color:var(--color-primary);box-shadow:0 0 0 3px #1f5f5b24,var(--shadow-card)}.template-card-main{grid-template-columns:3.15rem minmax(0,1fr);gap:.75rem}.template-icon{min-height:3.15rem;border-radius:var(--radius-sm);background:var(--color-surface-soft);color:var(--color-academic-blue);font-size:.72rem;font-weight:700}.template-card-badges,.support-chip-row{display:flex;flex-wrap:wrap;gap:.38rem}.category-badge,.option-count-chip,.support-chip{display:inline-flex;align-items:center;min-height:1.65rem;border-radius:999px;padding:.28rem .52rem;font-size:.76rem;font-weight:700;line-height:1}.category-badge{color:var(--color-primary-dark);text-transform:uppercase}.category-identidad{background:var(--color-identity)}.category-comunicacion,.category-participacion-grupal{background:var(--color-communication);color:var(--color-academic-blue)}.category-rutina{background:var(--color-routine)}.category-emociones,.category-juego{background:var(--color-game)}.category-acceso-curricular{background:var(--color-curricular);color:var(--color-academic-blue)}.category-causa-efecto{background:var(--color-cause-effect)}.option-count-chip,.support-chip{background:#f2f6f5;color:var(--color-text-muted)}.template-card h2{margin-top:.55rem;font-size:1.13rem;font-weight:700}.template-card p{color:var(--color-text-muted);font-size:.94rem;line-height:1.42}.template-use{display:grid;gap:.12rem}.template-use span{color:var(--color-text-light);font-size:.76rem;font-weight:700;text-transform:uppercase}.template-use strong{color:var(--color-primary-dark);font-size:.94rem;font-weight:600}.template-actions{grid-template-columns:1fr 1fr}.modal-backdrop{position:fixed;z-index:40;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:#183b3861;padding:1rem}.template-preview-dialog{display:grid;gap:.85rem;width:min(46rem,100%);max-height:min(88vh,56rem);overflow:auto;border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface);box-shadow:0 24px 70px #183b3838;padding:1rem}.quick-setup-dialog{display:grid;gap:.9rem;width:min(64rem,100%);max-height:min(90vh,60rem);overflow:auto;border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface);box-shadow:0 24px 70px #183b3838;padding:1rem}.quick-setup-dialog .modal-header h2{margin:.15rem 0 0;font-size:1.35rem}.quick-setup-form{display:grid;gap:.85rem}.quick-setup-section{display:grid;gap:.75rem;border:1px solid var(--color-border);border-radius:var(--radius-md);background:#fbfdfc;padding:.9rem}.quick-setup-section>legend{margin-bottom:.15rem;font-size:1rem}.quick-option-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}.quick-option-row{display:grid;gap:.65rem;min-width:0;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);padding:.75rem}.quick-option-heading,.quick-setup-actions{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.quick-option-heading span{border-radius:999px;background:var(--color-surface-soft);color:var(--color-primary-dark);padding:.25rem .55rem;font-size:.78rem;font-weight:800}.quick-media-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}.quick-media-grid input{padding:.55rem}.quick-setup-actions{justify-content:flex-end;border-top:1px solid var(--color-border);padding-top:.85rem}.modal-header{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.modal-header span{color:var(--color-primary-dark);font-size:.88rem;font-weight:700;text-transform:uppercase}.modal-template-preview{border:0;box-shadow:none;padding:0}.template-preview{position:static;border-radius:var(--radius-md)}.preview-block{border-top-color:var(--color-border)}.preview-options span,.tag-list span{background:var(--color-surface-soft);color:var(--color-primary-dark)}.editor-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1rem,2vw,1.4rem)}.editor-side{position:sticky;top:5.5rem;max-height:calc(100vh - 6rem);overflow:auto;padding-right:.15rem;scrollbar-gutter:stable}.panel-section,.control-group,.validation-box{padding:1rem}legend{color:var(--color-primary-dark);font-size:1.08rem;font-weight:700}label{color:var(--color-primary-dark);font-weight:600}.option-editor{border-color:var(--color-border);border-radius:var(--radius-md);background:#fbfdfc}.sticky-actions{gap:.65rem;border-radius:var(--radius-md);box-shadow:var(--shadow-card)}.activity-row,.result-row{border-radius:var(--radius-md)}.activity-meta{justify-items:start;text-align:left}.row-actions{grid-template-columns:repeat(auto-fit,minmax(7.5rem,1fr))}.click-test-page{gap:1.2rem}.click-test-page .page-heading{text-align:center}.click-target{width:min(100%,54rem);min-height:18rem;border:3px solid var(--color-primary);border-radius:var(--radius-lg);background:linear-gradient(180deg,var(--color-surface-soft),#dcefeb);color:var(--color-primary-dark);box-shadow:var(--shadow-soft);padding:1rem}.click-target span{display:block;margin-bottom:.5rem;color:var(--color-text-muted);font-size:1.05rem;font-weight:700}.click-target strong{font-size:clamp(2rem,6vw,3.8rem);font-weight:700}.test-stats{width:min(100%,54rem);justify-self:center}.test-controls{width:min(100%,54rem)}.student-mode{min-height:100vh;gap:1.4rem;padding:clamp(.8rem,2vw,1.4rem)}.student-toolbar{min-height:3rem}.student-options{width:min(100%,88rem);min-height:min(58vh,42rem);gap:clamp(1rem,2vw,1.6rem)}.option-card{min-height:12rem;border-radius:var(--radius-md)}.card-large{min-height:16rem}.card-extra-large{min-height:20rem}.option-card.no-image .option-text{font-size:clamp(3rem,7vw,5.5rem)}.feedback-overlay{border-radius:var(--radius-lg)}@media (max-width: 1100px){.template-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.template-tools{grid-template-columns:1fr}}@media (max-width: 920px){.topbar{grid-template-columns:1fr}.topbar-actions,.main-nav{justify-content:start}.topbar-actions{flex-wrap:wrap}.editor-grid{grid-template-columns:1fr}.editor-side{position:static;max-height:none;overflow:visible;padding-right:0}.activity-meta{justify-items:center;text-align:center}}@media (max-width: 680px){.app-main{padding:1.25rem .85rem 3rem}.template-grid,.home-summary,.template-actions,.test-stats{grid-template-columns:1fr}.main-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}.utility-button{width:100%}.modal-header{align-items:stretch;flex-direction:column}.template-preview-dialog,.quick-setup-dialog{max-height:92vh;padding:.85rem}.quick-option-list,.quick-media-grid{grid-template-columns:1fr}.quick-setup-actions{align-items:stretch;flex-direction:column-reverse}.click-target{min-height:15rem}}.page-enter{animation:pageEnter var(--motion-normal) var(--motion-ease)}@keyframes pageEnter{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}button,input,select,textarea,.template-count,.option-card,.template-card,.result-row{transition:background-color var(--motion-normal) var(--motion-ease),border-color var(--motion-normal) var(--motion-ease),box-shadow var(--motion-normal) var(--motion-ease),color var(--motion-normal) var(--motion-ease),opacity var(--motion-normal) var(--motion-ease),transform var(--motion-normal) var(--motion-ease)}.nav-button:active,.utility-button:active,.primary-button:active,.secondary-button:active{transform:scale(.985)}.template-count{animation:countFade var(--motion-normal) var(--motion-ease)}@keyframes countFade{0%{opacity:.35;transform:translateY(-2px)}to{opacity:1;transform:translateY(0)}}.template-grid .template-card{animation:cardEnter var(--motion-slow) var(--motion-ease) both}.template-card:hover,.template-card:focus-within{border-color:var(--color-border-strong);box-shadow:var(--shadow-soft);transform:translateY(-3px) scale(1.01)}.template-card:active{transform:translateY(-1px) scale(.995)}.template-card:hover .template-icon,.template-card:focus-within .template-icon{transform:scale(1.06) rotate(-2deg)}.template-card.selected{box-shadow:0 0 0 3px #2f7d6924,var(--shadow-soft)}@keyframes cardEnter{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.preview-options.interactive{display:grid;gap:.75rem}.preview-option{align-items:center;border:2px solid var(--color-border);border-radius:var(--radius-sm);display:inline-flex;gap:.4rem;min-height:3rem;padding:.7rem .9rem}.preview-option.simulated-positive,.option-card.selected.support-frame{border-color:var(--color-success);box-shadow:0 0 0 4px #2f7d691f}.preview-option.simulated-neutral{border-color:#d8c9a6;box-shadow:0 0 0 4px #b7791f1a}.preview-check{color:var(--color-success);font-weight:900}.segmented-control{display:flex;flex-wrap:wrap;gap:.45rem}.segmented-control button{border:1px solid var(--color-border-strong);border-radius:999px;background:var(--color-surface);color:var(--color-primary-dark);font-size:.82rem;font-weight:800;padding:.55rem .75rem}.segmented-control button.active{background:var(--color-primary);color:#fff}.support-hint,.click-alert{border-radius:var(--radius-sm);background:#fff8e6;color:#684a14;font-weight:800;margin:0;padding:.75rem .9rem}.preview-actions{align-items:center;display:flex;flex-wrap:wrap;gap:.7rem}.feedback-overlay.info{background:#edf5f6;color:var(--color-primary-dark)}.feedback-overlay.animation-soft-glow{animation:feedbackGlow var(--motion-slow) var(--motion-ease)}.feedback-overlay.animation-scale,.feedback-overlay.animation-gentle-pop{animation:feedbackScale var(--motion-slow) var(--motion-bounce-soft)}.feedback-overlay.animation-confetti-soft:before{color:#2f7d698c;content:"✓  ✓  ✓";font-size:1rem;left:1rem;letter-spacing:.35rem;position:absolute;top:.6rem}@keyframes feedbackGlow{0%{box-shadow:0 0 #2f7d6933}to{box-shadow:0 18px 40px #2f7d6924}}@keyframes feedbackScale{0%{transform:translateY(8px) scale(.98)}to{transform:translateY(0) scale(1)}}.option-card.support-pulse,.preview-option.support-pulse{animation:supportPulse 1.8s var(--motion-ease) infinite}@keyframes supportPulse{0%,to{box-shadow:0 0 #2f7d6938}50%{box-shadow:0 0 0 10px #2f7d690a}}.student-instruction{animation:pageEnter var(--motion-slow) var(--motion-ease)}.student-options .option-card{animation:cardEnter var(--motion-slow) var(--motion-ease) both;min-height:96px}.student-options .option-card:nth-child(2){animation-delay:60ms}.student-options .option-card:nth-child(3){animation-delay:.12s}.student-options .option-card:nth-child(4){animation-delay:.18s}.student-options .option-card:nth-child(5){animation-delay:.24s}.student-options .option-card:nth-child(6){animation-delay:.3s}.option-card:focus-visible{outline:4px solid rgba(30,58,95,.35);outline-offset:4px}.click-target{overflow:hidden;position:relative}.click-ripple{animation:clickRipple .8s var(--motion-ease);background:#2f7d6938;border-radius:999px;height:1rem;pointer-events:none;position:absolute;transform:translate(-50%,-50%);width:1rem}@keyframes clickRipple{0%{opacity:.75;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-50%) scale(28)}}.test-stats strong{animation:countPop var(--motion-normal) var(--motion-bounce-soft)}@keyframes countPop{0%{transform:scale(.92)}to{transform:scale(1)}}.live-preview{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-card);display:grid;gap:.85rem;overflow:hidden;padding:1rem}.live-preview h2{color:var(--color-primary-dark);font-size:clamp(1.05rem,1.3vw,1.35rem);margin:0}.live-preview p{color:var(--color-text-muted);font-size:.95rem;line-height:1.35;margin:.35rem 0 0}.live-preview-stage{container-type:inline-size;display:grid;min-height:clamp(18rem,46vh,34rem);overflow:hidden;border-radius:var(--radius-lg);background:linear-gradient(180deg,#eef6f494,#fffffff0),var(--color-surface);padding:clamp(.75rem,2cqi,1rem)}.live-preview-options{display:grid;gap:.75rem;min-height:0}.live-preview-options.options-2,.live-preview-options.options-3,.live-preview-options.options-4,.live-preview-options.options-6{grid-template-columns:repeat(2,minmax(0,1fr))}.live-preview-options .option-card{grid-template-rows:minmax(0,1fr) auto;min-height:clamp(8rem,32cqi,17rem);overflow:hidden;border-width:3px;padding:clamp(.65rem,2cqi,.95rem);box-shadow:0 10px 28px #163b371a}.live-preview-options.options-2 .option-card{min-height:clamp(11rem,42cqi,22rem)}.live-preview-options .option-text{max-width:100%;font-size:clamp(1.1rem,3.6cqi,2.2rem);line-height:1.05;overflow-wrap:anywhere}.live-preview-options .option-card.no-image .option-text{max-width:100%;font-size:clamp(1.7rem,5.4cqi,3.35rem)}.live-preview-options .option-image{width:min(100%,11rem);max-height:clamp(4rem,24cqi,11rem)}.live-preview-options.reduced .option-card:not(.support-frame){opacity:.72}.result-row{animation:cardEnter var(--motion-slow) var(--motion-ease) both}.result-row:first-child{border-color:#2f7d6959;box-shadow:0 0 0 3px #2f7d6914}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}}