:root{color-scheme:dark;--bg:#090909;--panel:#111;--line:#303030;--line-strong:#484848;--text:#f2f2f2;--muted:#777;--accent:#f0a17d;--gutter:clamp(1.15rem,5.4vw,5.5rem)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,select,input{font:inherit}.mandel-shell{width:min(1600px,100%);margin:0 auto;padding:0 var(--gutter)}.mandel-topbar{height:84px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:1rem}.wordmark{font-size:1.15rem;font-weight:800;letter-spacing:-.08em}.wordmark span{font: .52rem monospace;vertical-align:top;margin-left:3px;color:#777}.mandel-topbar nav{display:flex;gap:2rem;font: .62rem monospace;letter-spacing:.06em;color:#aaa}.mandel-topbar nav a:hover,.back-link:hover{color:#fff}.topbar-label,.eyebrow,.section-kicker,.interaction-hint,.canvas-overlay,.control-group>label,.label-line label,.mandel-footer,.back-link-row>span{font: .61rem/1.5 "SFMono-Regular",Consolas,monospace;letter-spacing:.08em;color:#929292}.topbar-label{color:#777}.mandel-intro{padding:clamp(4rem,8vw,8rem) 0 3.3rem}.eyebrow{display:flex;align-items:center;gap:.7rem}.status-dot,.live-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#d7a78b;box-shadow:0 0 12px #d7a78b70}.eyebrow-separator{color:#4d4d4d}.mandel-intro h1{font-size:clamp(4.2rem,10vw,9rem);line-height:.83;letter-spacing:-.09em;font-weight:520;margin:2.2rem 0 2.8rem}.mandel-intro h1 span{color:#777}.intro-bottom{display:flex;justify-content:space-between;align-items:end;gap:2rem}.intro-bottom p{max-width:510px;margin:0;color:#aaa;font-size:clamp(.95rem,1.4vw,1.12rem);line-height:1.75}.equation{font:clamp(1.2rem,2.3vw,2rem)/1.2 Georgia,serif;color:#ddd;white-space:nowrap;padding-bottom:.3rem}.equation sub,.equation sup{font-size:.55em}.explorer{border:1px solid var(--line);background:#0e0e0e}.canvas-frame{height:clamp(370px,61vw,720px);min-height:370px;position:relative;overflow:hidden;background:#070707;cursor:crosshair}.canvas-frame canvas{display:block;width:100%;height:100%;outline:none;touch-action:pan-y}.canvas-frame canvas:focus-visible{outline:1px solid #fff;outline-offset:-4px}.canvas-overlay{position:absolute;left:1rem;right:1rem;display:flex;justify-content:space-between;gap:1rem;pointer-events:none;font-size:.58rem;text-shadow:0 1px 8px #000}.canvas-overlay-top{top:1rem}.canvas-overlay-bottom{bottom:1rem}.canvas-overlay-top span:first-child{display:flex;align-items:center;gap:.5rem}.live-dot{width:5px;height:5px;background:#9bd2a9;box-shadow:0 0 9px #9bd2a966}.selection-box{display:none;position:absolute;border:1px solid #fff;background:#ffffff12;box-shadow:0 0 0 9999px #0002;pointer-events:none}.control-panel{display:grid;grid-template-columns:1fr 1.2fr 1.1fr auto;align-items:center;gap:1.4rem;padding:1.1rem 1.2rem;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.control-group{min-width:0;display:flex;flex-direction:column;gap:.65rem}.control-group>label,.label-line label{font-size:.57rem}.label-line{display:flex;justify-content:space-between;align-items:center;gap:1rem}.label-line output{font: .72rem monospace;color:#ddd}.control-group select{width:100%;max-width:210px;background:#151515;border:1px solid #383838;border-radius:0;color:#ddd;padding:.65rem .7rem;font-size:.78rem}.iteration-group input{width:100%;accent-color:#ddd;cursor:pointer}.button-pair{display:flex;gap:.4rem}.button-pair button,.save-button{min-height:36px;border:1px solid #383838;background:#151515;color:#ddd;padding:.45rem .8rem;cursor:pointer;font-size:.72rem;transition:background .2s,border-color .2s}.button-pair button:first-child,.button-pair button:nth-child(2){width:36px;font-size:1.1rem;padding:0}.button-pair button:hover,.save-button:hover{background:#242424;border-color:#777}.button-pair #resetView{font: .58rem monospace;letter-spacing:.04em}.save-button{align-self:end;white-space:nowrap;background:#eee;color:#090909;border-color:#eee;font: .61rem monospace;letter-spacing:.05em;padding:.7rem .9rem}.save-button:hover{background:#ccc;border-color:#ccc}.save-button span{margin-left:.5rem}.interaction-hint{display:flex;flex-wrap:wrap;gap:.6rem 1.5rem;padding:1rem 1.2rem;font-size:.55rem;color:#666}.interaction-hint b{color:#aaa;font-weight:400;margin-left:.25rem}.section-rule{border-top:1px solid var(--line)}.project-notes{margin-top:clamp(4rem,9vw,8rem);padding-top:2rem;display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,8vw,8rem)}.notes-heading h2{font-size:clamp(2.5rem,5vw,5rem);line-height:.98;letter-spacing:-.07em;font-weight:500;margin:1.6rem 0}.notes-heading h2 span{color:#777}.notes-copy{padding-top:1.5rem;color:#a5a5a5;font-size:.9rem;line-height:1.8}.notes-copy p{margin:0 0 1.2rem}.notes-copy code{font-size:.9em;color:#eee;background:#181818;padding:.15rem .3rem}.tech-tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.7rem}.tech-tags span{font: .57rem monospace;letter-spacing:.04em;color:#b9b9b9;border:1px solid #353535;padding:.45rem .6rem}.back-link-row{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:5rem;padding:1.3rem 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.back-link{font: .65rem monospace;letter-spacing:.06em}.back-link-row>span{font-size:.55rem}.mandel-footer{display:flex;justify-content:space-between;gap:1rem;padding:1.5rem 0 2rem;font-size:.56rem;color:#666}.mandel-footer a{color:#aaa}.mandel-footer a:hover{color:#fff}
@media(max-width:760px){.mandel-topbar{height:68px}.topbar-label{display:none}.mandel-topbar nav{gap:1rem;font-size:.57rem}.mandel-intro{padding-top:4.5rem}.mandel-intro h1{font-size:clamp(4rem,17vw,7rem);margin:1.8rem 0 2rem}.intro-bottom{align-items:start;flex-direction:column;gap:1.5rem}.canvas-frame{height:clamp(390px,105vw,570px);min-height:390px}.control-panel{grid-template-columns:1fr 1fr;gap:1.2rem}.control-group select{max-width:none}.save-button{align-self:end;min-height:40px}.interaction-hint{gap:.55rem 1rem}.project-notes{grid-template-columns:1fr;gap:.5rem;margin-top:4rem}.notes-copy{padding-top:0}.back-link-row{align-items:start;flex-direction:column;margin-top:3.5rem}.mandel-footer{font-size:.5rem}}@media(max-width:400px){.mandel-shell{padding:0 1rem}.control-panel{padding:.9rem;gap:1rem}.interaction-hint{font-size:.49rem}.canvas-overlay{left:.7rem;right:.7rem;font-size:.5rem}.equation{font-size:1.3rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition-duration:.01ms!important}}
