:root{--font-sans:"Inter", -apple-system, BlinkMacSystemFont, sans-serif;--font-display:"Space Grotesk", "Inter", sans-serif;--font-mono:"JetBrains Mono", monospace;--bg-canvas:#f8f7f4;--bg-web-grid:#ef44440d;--surface-glass:#ffffffe0;--surface-solid:#fff;--surface-soft:#f1efe9;--text-primary:#0f172a;--text-secondary:#334155;--text-muted:#64748b;--border-subtle:#0f172a1a;--spidey-red:#dc2626;--spidey-red-glow:#dc262638;--web-cyan:#0284c7;--web-cyan-soft:#0284c71c;--sense-gold:#d97706;--mastery-green:#059669}@media (prefers-color-scheme:dark){:root{--bg-canvas:#070b18;--bg-web-grid:#38bdf80f;--surface-glass:#0d1426d1;--surface-solid:#0f172a;--surface-soft:#1e293ba6;--text-primary:#f8fafc;--text-secondary:#cbd5e1;--text-muted:#94a3b8;--border-subtle:#94a3b829;--spidey-red:#ef4444;--spidey-red-glow:#ef444447;--web-cyan:#38bdf8;--web-cyan-soft:#38bdf821;--sense-gold:#fbbf24;--mastery-green:#34d399}}html:has(meta[name=color-scheme][content=dark]){--bg-canvas:#070b18;--bg-web-grid:#38bdf80f;--surface-glass:#0d1426d1;--surface-solid:#0f172a;--surface-soft:#1e293ba6;--text-primary:#f8fafc;--text-secondary:#cbd5e1;--text-muted:#94a3b8;--border-subtle:#94a3b829;--spidey-red:#ef4444;--spidey-red-glow:#ef444447;--web-cyan:#38bdf8;--web-cyan-soft:#38bdf821;--sense-gold:#fbbf24;--mastery-green:#34d399}html:has(meta[name=color-scheme][content=light]){--bg-canvas:#f8f7f4;--bg-web-grid:#dc26260b;--surface-glass:#ffffffe6;--surface-solid:#fff;--surface-soft:#f1efe9;--text-primary:#0f172a;--text-secondary:#334155;--text-muted:#64748b;--border-subtle:#0f172a1a;--spidey-red:#dc2626;--spidey-red-glow:#dc262633;--web-cyan:#0284c7;--web-cyan-soft:#0284c71a;--sense-gold:#d97706;--mastery-green:#059669}*,:before,:after{box-sizing:border-box}html,body{font-family:var(--font-sans);background-color:var(--bg-canvas);background-image:radial-gradient(circle at 50% 0%, var(--spidey-red-glow), transparent 46%), radial-gradient(circle at 90% 20%, var(--web-cyan-soft), transparent 40%), linear-gradient(to right, var(--bg-web-grid) 1px, transparent 1px), linear-gradient(to bottom, var(--bg-web-grid) 1px, transparent 1px);color:var(--text-primary);-webkit-font-smoothing:antialiased;background-size:100% 100%,100% 100%,36px 36px,36px 36px;min-block-size:100dvh;margin:0;padding:0;overflow-x:clip}.app-shell{min-block-size:100dvh;max-inline-size:680px;flex-direction:column;gap:.95rem;margin-inline:auto;padding-block-start:calc(env(safe-area-inset-top,0px) + .75rem);padding-block-end:calc(env(safe-area-inset-bottom,0px) + 6.4rem);padding-inline:.95rem;display:flex}.app-shell>main{flex-direction:column;gap:.95rem;inline-size:100%;min-inline-size:0;display:flex}.top-header{background:var(--surface-glass);-webkit-backdrop-filter:blur(18px);border:1px solid var(--border-subtle);top:calc(env(safe-area-inset-top,0px) + .45rem);z-index:30;border-radius:999px;justify-content:space-between;align-items:center;gap:.65rem;padding:.62rem .85rem;display:flex;position:sticky;box-shadow:0 10px 28px -10px #00000059}.brand-cluster{align-items:center;gap:.6rem;min-inline-size:0;display:flex}.brand-icon{object-fit:cover;border:1.5px solid var(--spidey-red);border-radius:11px;flex-shrink:0;block-size:36px;inline-size:36px}.brand-kicker{letter-spacing:.08em;text-transform:uppercase;color:var(--spidey-red);font-size:.67rem;font-weight:800}.brand-rank{font-family:var(--font-display);white-space:nowrap;text-overflow:ellipsis;max-inline-size:195px;font-size:.88rem;font-weight:700;overflow:hidden}.header-actions{flex-shrink:0;align-items:center;gap:.4rem;display:flex}.status-pill{font-family:var(--font-sans);color:var(--text-primary);background:var(--surface-soft);border:1px solid var(--border-subtle);cursor:pointer;white-space:nowrap;border-radius:999px;align-items:center;gap:.38rem;padding:.34rem .7rem;font-size:.73rem;font-weight:700;display:inline-flex}.pulse-dot{background:var(--mastery-green);block-size:7px;inline-size:7px;box-shadow:0 0 9px var(--mastery-green);border-radius:50%}.pulse-dot.working{background:var(--web-cyan);box-shadow:0 0 11px var(--web-cyan);animation:1.1s ease-in-out infinite spidey-pulse}@keyframes spidey-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.65;transform:scale(1.45)}}.icon-btn{border:1px solid var(--border-subtle);background:var(--surface-soft);block-size:35px;inline-size:35px;color:var(--text-primary);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;display:inline-flex}.spidey-card{background:var(--surface-glass);-webkit-backdrop-filter:blur(18px);border:1px solid var(--border-subtle);border-radius:24px;min-inline-size:0;max-inline-size:100%;padding:1.2rem;box-shadow:0 12px 32px -14px #00000047}.eyebrow{letter-spacing:.07em;text-transform:uppercase;color:var(--web-cyan);justify-content:space-between;align-items:center;gap:.5rem;margin-block-end:.45rem;font-size:.71rem;font-weight:800;display:flex}.display-title{font-family:var(--font-display);text-wrap:balance;margin:0 0 .45rem;font-size:clamp(1.38rem,4.8vw,1.8rem);font-weight:700;line-height:1.2}.lead-sub{color:var(--text-secondary);margin:0;font-size:.94rem;line-height:1.55}.btn-row{flex-wrap:wrap;gap:.55rem;margin-block-start:.9rem;display:flex}.btn{font-family:var(--font-sans);cursor:pointer;border:1px solid #0000;border-radius:14px;justify-content:center;align-items:center;gap:.45rem;padding:.68rem 1.05rem;font-size:.86rem;font-weight:700;transition:transform .14s,opacity .2s;display:inline-flex}.btn:active:not(:disabled){transform:scale(.97)}.btn:disabled{opacity:.55;cursor:not-allowed}.btn-spidey{color:#fff;box-shadow:0 6px 20px -4px var(--spidey-red-glow);background:linear-gradient(135deg,#ef4444,#dc2626)}.btn-web{background:var(--web-cyan-soft);color:var(--web-cyan);border-color:#38bdf859}.btn-soft{background:var(--surface-soft);color:var(--text-primary);border-color:var(--border-subtle)}progress.spidey-progress{appearance:none;--progress-bar-radius:100000px;--progress-bar-track:var(--surface-soft);--progress-bar-fill:linear-gradient(90deg, var(--spidey-red), var(--web-cyan));--progress-bar-indeterminate-size:32%;--progress-bar-indeterminate-animation-duration:1.4s;border-radius:var(--progress-bar-radius);background:var(--progress-bar-track);border:0 solid;block-size:8px;inline-size:100%;display:block;overflow:clip;container-type:inline-size}progress.spidey-progress:indeterminate{--progress-bar-animation:spidey-indeterminate var(--progress-bar-indeterminate-animation-duration) infinite linear}progress.spidey-progress::-webkit-progress-bar{background:0 0}progress.spidey-progress::-webkit-progress-value{background:var(--progress-bar-fill);border-radius:var(--progress-bar-radius);animation:var(--progress-bar-animation,revert-rule);transition:inline-size .35s}progress.spidey-progress::-moz-progress-bar{background:var(--progress-bar-fill);border-radius:var(--progress-bar-radius);animation:var(--progress-bar-animation,revert-rule);transition:inline-size .35s}@keyframes spidey-indeterminate{0%,to{inline-size:var(--progress-bar-indeterminate-size);margin-right:auto}0%{translate:-100%}to{translate:100cqi}}.step-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:.35rem;margin-block-start:.9rem;display:grid}.step-pill{border:1px solid var(--border-subtle);background:var(--surface-soft);color:var(--text-muted);font-family:var(--font-sans);text-align:center;cursor:pointer;border-radius:12px;padding:.48rem .3rem;font-size:.69rem;font-weight:700;transition:all .2s}.step-pill.done{color:var(--mastery-green);border-color:#34d39966}.step-pill.active{border-color:var(--spidey-red);color:var(--text-primary);background:linear-gradient(135deg,#ef44442e,#38bdf829)}.notebook-block{background:var(--surface-soft);border:1px solid var(--border-subtle);border-radius:18px;flex-direction:column;gap:.5rem;padding:1rem 1.05rem;display:flex}.notebook-block.pitch-highlight{border-inline-start:4px solid var(--spidey-red)}.notebook-block.analogy-highlight{border-inline-start:4px solid var(--web-cyan);background:linear-gradient(145deg, var(--web-cyan-soft), var(--surface-soft))}.md-prose{color:var(--text-primary);overflow-wrap:anywhere;word-break:break-word;font-size:.93rem;line-height:1.68}.md-prose p{margin:0 0 .72rem}.md-prose p:last-child{margin-block-end:0}.md-prose ul,.md-prose ol{margin:0 0 .72rem;padding-inline-start:1.25rem}.md-prose li{margin-block-end:.42rem}.md-prose code{font-family:var(--font-mono);background:var(--surface-solid);color:var(--web-cyan);border-radius:6px;padding:.12rem .36rem;font-size:.81rem}.chat-box{flex-direction:column;gap:.65rem;max-block-size:52dvh;padding-inline-end:.15rem;display:flex;overflow-y:auto}.bubble{background:var(--surface-soft);border:1px solid var(--border-subtle);overflow-wrap:anywhere;border-radius:18px;padding:.88rem 1rem}.bubble.pete{border-inline-start:3px solid var(--spidey-red)}.bubble.student{background:linear-gradient(135deg,#ef444429,#38bdf824);border-color:#38bdf859;margin-inline-start:1.5rem}.input-field,.textarea-field{border:1px solid var(--border-subtle);background:var(--surface-solid);inline-size:100%;color:var(--text-primary);font-family:var(--font-sans);border-radius:15px;padding:.75rem .95rem;font-size:.93rem}.textarea-field{resize:vertical;min-block-size:74px}.input-field:focus-visible,.textarea-field:focus-visible{outline:2px solid var(--web-cyan);outline-offset:2px}.bottom-dock{inset-inline:0;z-index:40;padding:.55rem .95rem calc(env(safe-area-inset-bottom,0px) + .65rem);pointer-events:none;justify-content:center;display:flex;position:fixed;bottom:0}.dock-inner{pointer-events:auto;background:var(--surface-glass);-webkit-backdrop-filter:blur(22px);border:1px solid var(--border-subtle);border-radius:999px;grid-template-columns:repeat(4,1fr);gap:.3rem;inline-size:min(520px,100%);padding:.38rem;display:grid;box-shadow:0 14px 36px #00000059}.dock-tab{color:var(--text-muted);font-family:var(--font-sans);cursor:pointer;background:0 0;border:0;border-radius:999px;flex-direction:column;align-items:center;gap:.2rem;padding:.52rem .35rem;font-size:.7rem;font-weight:700;display:flex}.dock-tab.active{color:#fff;background:linear-gradient(135deg,#ef4444,#dc2626)}.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;block-size:1px;inline-size:1px;position:absolute;overflow:hidden}
