:root{--bg: #FAF9F6;--bg-elev: #FFFFFF;--bg-tint: #F5F3EE;--ink: #0F172A;--ink-soft: #475569;--ink-faint: #94A3B8;--line: #E2E8F0;--line-strong: #CBD5E1;--primary: #4F46E5;--primary-hover: #4338CA;--primary-soft: #EEF2FF;--accent: #F59E0B;--accent-soft: #FEF3C7;--pos: #DC2626;--neg: #2563EB;--ok: #059669;--warn: #D97706;--err: #DC2626;--radius-sm: 6px;--radius: 12px;--radius-lg: 20px;--shadow-sm: 0 1px 2px rgba(15,23,42,.06);--shadow: 0 4px 14px rgba(15,23,42,.08);--shadow-lg: 0 16px 40px rgba(15,23,42,.12);--font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Consolas, "Liberation Mono", monospace;--ease: cubic-bezier(.22,.61,.36,1);--ease-spring: cubic-bezier(.34,1.56,.64,1);--dur-fast: .18s;--dur: .32s;--dur-slow: .56s;--header-h: 64px;--max-w: 1240px}@media (prefers-reduced-motion: reduce){:root{--dur-fast: 0ms;--dur: 0ms;--dur-slow: 0ms}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0}html{-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{background:var(--bg);color:var(--ink);font-family:var(--font-sans);font-size:16px;line-height:1.55;min-height:100vh;min-height:100dvh;overflow-x:hidden}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline;text-underline-offset:3px}h1,h2,h3,h4{margin:0;font-weight:600;letter-spacing:-.01em;color:var(--ink)}h1{font-size:clamp(1.75rem,2.4vw + 1rem,2.5rem);line-height:1.15;letter-spacing:-.02em}h2{font-size:clamp(1.25rem,1vw + 1rem,1.5rem)}h3{font-size:1.125rem}p{margin:0}ul,ol{margin:0;padding:0 0 0 1.25rem}input,select,textarea,button{font:inherit}::selection{background:var(--primary);color:#fff}:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:4px}.page{max-width:var(--max-w);margin:0 auto;padding:0 clamp(1rem,3vw,2rem) 4rem;display:grid;grid-template-rows:auto auto 1fr auto auto;gap:clamp(1rem,2vw,1.5rem);min-height:100vh;min-height:100dvh}.page-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 0;border-bottom:1px solid var(--line);min-height:var(--header-h)}.page-header .brand{display:flex;align-items:center;gap:.625rem;font-weight:600;font-size:.9375rem;color:var(--ink);letter-spacing:-.01em}.page-header .brand-mark{width:28px;height:28px;display:grid;place-items:center;background:var(--primary);color:#fff;border-radius:var(--radius-sm);font-size:.75rem;font-weight:700;letter-spacing:0}.page-header .back-link{display:inline-flex;align-items:center;gap:.375rem;color:var(--ink-soft);font-size:.875rem;font-weight:500;padding:.375rem .625rem;border-radius:var(--radius-sm);transition:color var(--dur-fast) var(--ease),background var(--dur-fast) var(--ease)}.page-header .back-link:hover{color:var(--ink);background:var(--line);text-decoration:none}.page-header .tools{display:flex;gap:.5rem;align-items:center}.intro{padding:1rem 0 .5rem;max-width:68ch}.intro .eyebrow{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--primary);margin-bottom:.5rem}.intro h1{margin-bottom:.5rem}.intro p{color:var(--ink-soft);font-size:1.0625rem;line-height:1.6}.sim-shell{container-type:inline-size;container-name:sim;display:grid;gap:clamp(1rem,2vw,1.5rem);grid-template-columns:minmax(0,1fr)}@container sim (min-width: 760px){.sim-shell.with-side{grid-template-columns:minmax(0,1fr) 300px}}@supports not (container-type: inline-size){@media (min-width: 960px){.sim-shell.with-side{grid-template-columns:minmax(0,1fr) 300px}}}.stage-card{background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow);overflow:hidden;position:relative}.stage{position:relative;width:100%;aspect-ratio:16 / 10;background:radial-gradient(circle at 30% 20%,rgba(79,70,229,.04),transparent 50%),radial-gradient(circle at 80% 80%,rgba(245,158,11,.04),transparent 50%),var(--bg-elev)}.stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}.stage-overlay{position:absolute;inset:0;pointer-events:none;display:flex;align-items:flex-start;justify-content:space-between;padding:1rem}.stage-overlay>*{pointer-events:auto}.readout{background:#ffffffd9;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:var(--radius);padding:.625rem .875rem;font-family:var(--font-mono);font-size:.8125rem;font-variant-numeric:tabular-nums;color:var(--ink);min-width:140px;box-shadow:var(--shadow-sm)}.readout .label{font-family:var(--font-sans);font-size:.6875rem;font-weight:500;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-faint);margin-bottom:.125rem;display:block}.readout .value{font-weight:500}.readout .unit{color:var(--ink-soft);margin-left:.1875rem}.controls{background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--radius-lg);padding:clamp(1rem,2vw,1.25rem);display:grid;gap:1rem;box-shadow:var(--shadow-sm)}.controls h3{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--ink-soft);margin-bottom:-.25rem}.control-row{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.625rem 1rem;border-radius:var(--radius-sm);font-size:.9375rem;font-weight:500;transition:background var(--dur-fast) var(--ease),transform var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease);white-space:nowrap}.btn svg{width:1em;height:1em}.btn:active{transform:translateY(1px)}.btn.primary{background:var(--primary);color:#fff;box-shadow:0 1px 2px #4f46e54d,inset 0 -1px #0000001f}.btn.primary:hover{background:var(--primary-hover)}.btn.primary:disabled{background:var(--ink-faint);cursor:not-allowed;box-shadow:none}.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--line-strong)}.btn.ghost:hover{background:var(--bg-tint);border-color:var(--ink-faint)}.btn.accent{background:var(--accent);color:#fff;box-shadow:0 1px 2px #f59e0b4d,inset 0 -1px #0000001f}.btn.accent:hover{filter:brightness(.96)}.btn.icon-only{padding:.5rem;width:2.25rem;height:2.25rem;justify-content:center}.slider{display:grid;grid-template-columns:1fr auto;gap:.5rem .75rem;align-items:center;min-width:220px}.slider .slider-label{grid-column:1 / -1;display:flex;justify-content:space-between;align-items:baseline;font-size:.875rem;font-weight:500}.slider .slider-label .value{font-family:var(--font-mono);font-size:.8125rem;color:var(--primary);font-variant-numeric:tabular-nums;background:var(--primary-soft);padding:.125rem .5rem;border-radius:4px}.slider input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:24px;background:transparent;grid-column:1 / -1;cursor:pointer;margin:0}.slider input[type=range]::-webkit-slider-runnable-track{height:4px;background:var(--line-strong);border-radius:999px}.slider input[type=range]::-moz-range-track{height:4px;background:var(--line-strong);border-radius:999px}.slider input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;margin-top:-8px;background:var(--bg-elev);border:2px solid var(--primary);border-radius:50%;box-shadow:var(--shadow-sm);cursor:grab;transition:transform var(--dur-fast) var(--ease)}.slider input[type=range]::-moz-range-thumb{width:20px;height:20px;background:var(--bg-elev);border:2px solid var(--primary);border-radius:50%;box-shadow:var(--shadow-sm);cursor:grab}.slider input[type=range]:hover::-webkit-slider-thumb{transform:scale(1.15)}.slider input[type=range]:active::-webkit-slider-thumb{transform:scale(1.25);cursor:grabbing}.toggle{display:inline-flex;background:var(--bg-tint);border:1px solid var(--line);border-radius:var(--radius-sm);padding:3px;gap:2px}.toggle button{padding:.4375rem .875rem;font-size:.875rem;font-weight:500;border-radius:calc(var(--radius-sm) - 2px);color:var(--ink-soft);transition:background var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease)}.toggle button:hover{color:var(--ink)}.toggle button[aria-pressed=true]{background:var(--bg-elev);color:var(--ink);box-shadow:var(--shadow-sm)}.check{display:inline-flex;align-items:center;gap:.5rem;font-size:.875rem;cursor:pointer;padding:.375rem .75rem;border-radius:999px;background:var(--bg-tint);border:1px solid var(--line);transition:background var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease);user-select:none}.check:hover{border-color:var(--line-strong)}.check input{appearance:none;-webkit-appearance:none;width:16px;height:16px;border:1.5px solid var(--line-strong);border-radius:4px;margin:0;cursor:pointer;position:relative;transition:all var(--dur-fast) var(--ease)}.check input:checked{background:var(--primary);border-color:var(--primary)}.check input:checked:after{content:"";position:absolute;top:2px;left:4px;width:4px;height:8px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}.concept{padding:1rem 1.25rem;background:linear-gradient(135deg,var(--primary-soft),var(--accent-soft));border-left:3px solid var(--primary);border-radius:var(--radius);font-size:.9375rem;color:var(--ink)}.concept strong{color:var(--primary);font-weight:600}.page-footer{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-top:1.5rem;margin-top:1rem;border-top:1px solid var(--line)}.page-footer .nav-link{display:inline-flex;align-items:center;gap:.5rem;color:var(--ink-soft);font-size:.9375rem;font-weight:500;padding:.5rem .75rem;border-radius:var(--radius-sm);transition:color var(--dur-fast),background var(--dur-fast)}.page-footer .nav-link:hover{color:var(--ink);background:var(--bg-tint);text-decoration:none}.page-footer .nav-link.disabled{color:var(--ink-faint);pointer-events:none}.hero{padding:clamp(2rem,6vw,4rem) 0 clamp(1.5rem,4vw,2.5rem);text-align:left;max-width:72ch}.hero .eyebrow{display:inline-flex;align-items:center;gap:.5rem;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--primary);background:var(--primary-soft);padding:.375rem .75rem;border-radius:999px;margin-bottom:1rem}.hero h1{font-size:clamp(2rem,4vw + 1rem,3.5rem);letter-spacing:-.025em;line-height:1.05}.hero h1 .accent{color:var(--primary)}.hero p.lede{font-size:clamp(1.0625rem,1vw + 1rem,1.25rem);color:var(--ink-soft);margin-top:1rem;line-height:1.55}.filter-bar{display:flex;flex-wrap:wrap;gap:.375rem;padding:.5rem 0 1.5rem;position:sticky;top:0;z-index:10;background:linear-gradient(to bottom,var(--bg) 80%,transparent)}.filter-bar button{padding:.4375rem .875rem;font-size:.875rem;font-weight:500;border-radius:999px;color:var(--ink-soft);border:1px solid var(--line);transition:all var(--dur-fast) var(--ease)}.filter-bar button:hover{color:var(--ink);border-color:var(--line-strong)}.filter-bar button[aria-pressed=true]{background:var(--ink);color:#fff;border-color:var(--ink)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:clamp(.75rem,1.5vw,1.25rem)}.card{position:relative;background:var(--bg-elev);border:1px solid var(--line);border-radius:var(--radius-lg);padding:1.25rem;display:grid;grid-template-rows:120px auto auto 1fr auto;gap:.625rem;box-shadow:var(--shadow-sm);transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),border-color var(--dur) var(--ease);color:inherit;overflow:hidden}.card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:var(--line-strong);text-decoration:none}.card .thumb{position:relative;background:linear-gradient(135deg,var(--primary-soft),var(--accent-soft));border-radius:var(--radius);overflow:hidden;display:grid;place-items:center}.card .thumb canvas,.card .thumb svg{width:100%;height:100%;display:block}.card .num{font-family:var(--font-mono);font-size:.75rem;color:var(--primary);font-weight:500;letter-spacing:.02em}.card h3{font-size:1.0625rem;line-height:1.3;letter-spacing:-.01em}.card p{font-size:.875rem;color:var(--ink-soft);line-height:1.5}.card .tag{display:inline-flex;align-items:center;gap:.25rem;font-size:.6875rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft);padding:.25rem .5rem;border-radius:999px;background:var(--bg-tint);border:1px solid var(--line);width:fit-content}.card .tag.contact{color:#047857;background:#d1fae5;border-color:#a7f3d0}.card .tag.non-contact{color:#6d28d9;background:#ede9fe;border-color:#ddd6fe}.card .tag.measurement{color:#c2410c;background:#ffedd5;border-color:#fed7aa}.card .tag.buoyancy{color:#0369a1;background:#e0f2fe;border-color:#bae6fd}.card .tag.challenge{color:#fff;background:var(--ink);border-color:var(--ink)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.kbd{display:inline-block;font-family:var(--font-mono);font-size:.75rem;padding:.125rem .4375rem;background:var(--bg-tint);border:1px solid var(--line-strong);border-bottom-width:2px;border-radius:4px;color:var(--ink-soft)}.bars{display:grid;gap:.5rem;padding:1rem 0}.bar-row{display:grid;grid-template-columns:90px 1fr 60px;align-items:center;gap:.75rem;font-size:.8125rem}.bar-row .label{color:var(--ink-soft);font-weight:500}.bar-row .track{height:10px;background:var(--bg-tint);border-radius:999px;overflow:hidden}.bar-row .fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--accent));border-radius:999px;width:0;transition:width var(--dur-slow) var(--ease)}.bar-row .num{font-family:var(--font-mono);font-size:.8125rem;color:var(--ink);text-align:right}@media print{.page-header .tools,.page-footer,.controls,.filter-bar{display:none}body{background:#fff}.card{break-inside:avoid}}html{-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%}body{overscroll-behavior-y:contain}.btn,.filter-bar button,.toggle button,.check,.card{touch-action:manipulation}@supports (height: 100dvh){body,.page{min-height:100dvh}}.page{padding-left:max(clamp(1rem,3vw,2rem),env(safe-area-inset-left));padding-right:max(clamp(1rem,3vw,2rem),env(safe-area-inset-right));padding-bottom:max(4rem,env(safe-area-inset-bottom))}@media (max-width: 900px){.hero{padding:clamp(1.5rem,4vw,2.5rem) 0 clamp(1rem,3vw,1.75rem)}.grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.875rem}.card{padding:1rem;grid-template-rows:108px auto auto 1fr auto;gap:.5rem}}@media (max-width: 640px){.page{gap:.875rem;padding-top:0;padding-bottom:max(2rem,env(safe-area-inset-bottom))}.page-header{padding:.75rem 0;min-height:52px}.page-header .brand{font-size:.875rem}.page-header .brand-mark{width:26px;height:26px}.hero{padding:1.25rem 0 1rem}.hero .eyebrow{font-size:.6875rem;padding:.3125rem .625rem;margin-bottom:.75rem}.hero h1{font-size:clamp(1.625rem,7vw,2rem);line-height:1.1}.hero p.lede{font-size:1rem;margin-top:.75rem}.filter-bar{display:flex;flex-wrap:wrap;gap:.5rem;padding:.25rem 0 1rem}.filter-bar button{padding:.5rem .875rem;min-height:44px}.grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:.75rem}.card{padding:.875rem;grid-template-rows:96px auto auto 1fr auto;gap:.5rem;border-radius:var(--radius)}.card:hover{transform:none}.card:active{transform:scale(.985)}.card h3{font-size:.9375rem;line-height:1.25}.card p{font-size:.8125rem;line-height:1.4}.card .num{font-size:.6875rem}.card .tag{font-size:.625rem;padding:.1875rem .4375rem}}@media (max-width: 400px){.grid{grid-template-columns:1fr}.card{grid-template-rows:140px auto auto auto auto}.hero h1{font-size:1.5rem}}@media (max-height: 520px) and (orientation: landscape){.page-header{min-height:44px;padding:.375rem 0}.hero{padding:.75rem 0}.hero h1{font-size:1.5rem}.hero p.lede{font-size:.9375rem;margin-top:.375rem}.filter-bar{padding:.25rem 0 .5rem}}#activity-slot:not(:empty){padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}.sim-shell:fullscreen .controls{max-height:100vh;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}body{background:#faf9f6;color:#0f172a;font-family:Inter,system-ui,sans-serif;margin:0}.thumb svg{width:100%;height:100%}@keyframes float-y{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes slide-r{0%{transform:translate(-18px);opacity:0}50%{opacity:1}to{transform:translate(18px);opacity:0}}@keyframes bob-x{0%,to{transform:translate(-3px)}50%{transform:translate(3px)}}@keyframes pulse-o{0%,to{opacity:.3;transform:scale(1)}50%{opacity:1;transform:scale(1.15)}}@keyframes arc{0%{offset-distance:0%}to{offset-distance:100%}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes wave{0%,to{d:path("M0 12 Q 20 8, 40 12 T 80 12")}50%{d:path("M0 12 Q 20 16, 40 12 T 80 12")}}@keyframes stretch{0%,to{transform:scaleY(1)}50%{transform:scaleY(1.15)}}@keyframes sparkle{0%,to{opacity:0}50%{opacity:1}}@keyframes diverge{0%,to{transform:rotate(0)}50%{transform:rotate(var(--ang,20deg))}}.t-box{animation:slide-r 2.4s ease-in-out infinite}.t-arrow-p{animation:pulse-o 1.4s ease-in-out infinite;transform-origin:center}.t-ball{animation:float-y 1.6s ease-in-out infinite}.t-magnet-t{animation:float-y 2s ease-in-out infinite}.t-spring{animation:stretch 1.8s ease-in-out infinite;transform-origin:center top}.t-spark{animation:sparkle 1.2s ease-in-out infinite;transform-origin:center}.t-leaf-l{animation:diverge 2.4s ease-in-out infinite;transform-origin:top center;--ang: -18deg}.t-leaf-r{animation:diverge 2.4s ease-in-out infinite;transform-origin:top center;--ang: 18deg}.t-bal-l{animation:bob-x 2s ease-in-out infinite;transform-origin:top center}.t-bal-r{animation:bob-x 2s ease-in-out infinite reverse;transform-origin:top center}.t-chapati{animation:spin 3s linear infinite;transform-origin:center}.t-bottle{animation:float-y 2.4s ease-in-out infinite}@media (prefers-reduced-motion: reduce){[class^=t-],[class*=" t-"]{animation:none!important}}.card[aria-disabled=true]{opacity:.62;cursor:not-allowed}.card[aria-disabled=true]:hover{transform:none;box-shadow:var(--shadow-sm);border-color:var(--line)}.card .coming{position:absolute;top:.75rem;right:.75rem;font-size:.625rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;background:#0f172ad1;color:#fff;padding:.25rem .5rem;border-radius:999px;backdrop-filter:blur(4px)}#gallery[hidden]{display:none}#activity-slot:not(:empty){position:fixed;inset:0;background:var(--bg, #FAF9F6);z-index:9999;height:100vh}@supports (height: 100dvh){#activity-slot:not(:empty){height:100dvh}}#activity-slot iframe{width:100%;height:100%;border:0;background:var(--bg, #FAF9F6);display:block}#activity-slot:empty{display:none}#activity-slot:not(:empty){position:fixed;inset:0;z-index:50;background:var(--bg)}.activity-frame{width:100%;height:100vh;height:100svh;height:100dvh;border:0;display:block}#gallery[hidden]{display:none!important}.page-footer{margin-top:3rem;color:var(--ink-faint);font-size:.8125rem;text-align:center;padding:1.5rem 0;border-top:1px solid var(--line)}.tools .tool{background:transparent;border:1px solid var(--line);border-radius:var(--radius);width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;color:var(--ink-soft);cursor:pointer;transition:background var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease)}.tools .tool:hover{background:var(--bg-tint);color:var(--ink)}.tools .tool[aria-pressed=false]{color:var(--ink-faint)}