:root{--ink:#101016;--paper:#f4efe3;--coral:#ff5d73;--yellow:#ffd166;--cyan:#38bdf8;--mint:#7bd88f;--muted:#9b998f;--line:rgba(244,239,227,.16);--panel:#17171e;--mono:"DM Mono",monospace;--sans:"Manrope",sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:var(--paper);font-family:var(--sans);min-height:100vh;overflow-x:hidden}.noise{position:fixed;inset:0;pointer-events:none;opacity:.055;z-index:20;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E")}.topbar{height:68px;padding:0 max(24px,4vw);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);position:relative;z-index:5}.brand{display:flex;align-items:center;gap:12px;font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.09em;color:var(--paper);text-decoration:none}.brand-mark{display:grid;grid-template-columns:repeat(2,6px);gap:2px;transform:rotate(45deg)}.brand-mark i{width:6px;height:6px;display:block;background:var(--coral)}.brand-mark i:nth-child(2){background:var(--yellow)}.brand-mark i:nth-child(3){background:var(--cyan)}.brand-mark i:nth-child(4){background:var(--mint)}.world-state{font:10px var(--mono);letter-spacing:.08em;display:flex;align-items:center;gap:9px;color:var(--muted)}.world-state b{color:var(--paper);font-weight:500}
.top-actions{display:flex;align-items:center;gap:18px;margin-left:auto;margin-right:28px}.top-actions a,.top-actions button{color:var(--muted);background:transparent;border:0;padding:0;text-decoration:none;font:9px var(--mono);letter-spacing:.08em;cursor:pointer}.top-actions a:hover,.top-actions button:hover{color:var(--paper)}.top-actions .top-brush{color:var(--ink);background:var(--paper);padding:8px 10px}.live-dot{width:7px;height:7px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 4px rgba(123,216,143,.1),0 0 12px var(--mint)}.divider{height:12px;width:1px;background:var(--line);margin:0 5px}main{position:relative}.intro{text-align:center;max-width:850px;margin:0 auto;padding:86px 24px 60px}.eyebrow{font:10px var(--mono);letter-spacing:.2em;color:var(--coral);margin-bottom:20px}.intro h1{font-size:clamp(52px,8vw,104px);line-height:.91;letter-spacing:-.065em;margin:0;font-weight:800}.intro h1 em{font-style:normal;color:transparent;-webkit-text-stroke:1.5px rgba(244,239,227,.7)}.intro p{max-width:580px;margin:30px auto 28px;color:#b6b2aa;font-size:16px;line-height:1.7}.intro-actions{display:flex;justify-content:center;gap:10px}.button{border:0;border-radius:2px;padding:13px 17px;font:700 10px var(--mono);letter-spacing:.08em;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;transition:.18s ease}.button.primary{background:var(--coral);color:var(--ink);box-shadow:4px 4px 0 var(--paper)}.button.primary:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--paper)}.button.primary:disabled{opacity:.35;cursor:not-allowed;transform:none;box-shadow:none}.button.ghost{background:transparent;color:var(--paper);border:1px solid var(--line)}.button.ghost:hover{border-color:var(--paper)}.button.full{width:100%}.world-layout{max-width:1450px;margin:0 auto;padding:0 28px 110px;display:grid;grid-template-columns:minmax(220px,270px) minmax(460px,700px) minmax(230px,300px);gap:18px;align-items:start}.panel,.canvas-shell{border:1px solid var(--line);background:rgba(23,23,30,.78);backdrop-filter:blur(18px)}.panel-title{height:45px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 15px;font:9px var(--mono);letter-spacing:.1em;color:var(--muted)}.panel-title button{border:0;background:transparent;color:var(--muted);font:9px var(--mono);cursor:pointer}.signed-out{padding:31px 18px;text-align:center}.signed-out h2{font-size:18px;margin:20px 0 8px}.signed-out p,.brush-tip{font-size:12px;line-height:1.65;color:var(--muted);margin:0 0 22px}.tiny-orbit{width:48px;height:48px;border:1px dashed rgba(244,239,227,.3);border-radius:50%;margin:auto;position:relative;animation:spin 10s linear infinite}.tiny-orbit:after{content:"";position:absolute;inset:13px;background:var(--yellow);box-shadow:10px 0 var(--coral),0 10px var(--cyan),10px 10px var(--mint)}.tiny-orbit span{position:absolute;width:7px;height:7px;border-radius:50%;background:var(--paper);top:-4px;left:20px}@keyframes spin{to{transform:rotate(360deg)}}.signed-in{padding:17px}.hidden{display:none!important}.identity-card{display:flex;gap:11px;align-items:center;padding-bottom:17px;border-bottom:1px solid var(--line)}.avatar{width:36px;height:36px;display:grid;place-items:center;background:var(--yellow);color:var(--ink);font-weight:800}.identity-card strong,.identity-card span{display:block}.identity-card strong{font-size:13px}.identity-card span{font:8px var(--mono);letter-spacing:.09em;color:var(--muted);margin-top:4px}.ink-meter{padding:17px 0;border-bottom:1px solid var(--line)}.ink-label{display:flex;justify-content:space-between;font:9px var(--mono);letter-spacing:.08em}.ink-label strong{font-weight:400;color:var(--yellow)}.meter{height:4px;background:#292932;margin:9px 0}.meter i{display:block;height:100%;width:100%;background:var(--yellow);transition:width .3s}.ink-meter small{font-size:9px;color:var(--muted)}.brush-label{font:8px var(--mono);letter-spacing:.12em;color:var(--muted);margin:17px 0 9px;display:flex;justify-content:space-between}.palette{display:grid;grid-template-columns:repeat(8,1fr);gap:5px}.swatch{aspect-ratio:1;border:0;background:var(--swatch);cursor:pointer;position:relative;min-width:0}.swatch.selected:after{content:"";position:absolute;inset:-3px;border:1px solid var(--paper)}.stroke-actions{display:grid;grid-template-columns:1fr 34px;gap:8px}.icon-button{border:1px solid var(--line);background:transparent;color:var(--paper);font-size:20px;cursor:pointer}.message-field{display:block;margin-top:14px}.message-field span,dialog label span{font:8px var(--mono);letter-spacing:.12em;color:var(--muted);display:block;margin-bottom:7px}.message-field input,dialog input,dialog select{width:100%;background:#0d0d12;border:1px solid var(--line);color:var(--paper);padding:10px;font:11px var(--mono);outline:none}.message-field input:focus,dialog input:focus,dialog select:focus{border-color:var(--coral)}.brush-tip{margin:11px 0 0;font-size:9px}.canvas-shell{background:#0b0b0f;box-shadow:0 28px 70px rgba(0,0,0,.4)}.canvas-toolbar,.canvas-coordinates{height:45px;padding:0 14px;display:flex;align-items:center;justify-content:space-between;font:8px var(--mono);letter-spacing:.1em;color:var(--muted)}.canvas-toolbar{border-bottom:1px solid var(--line)}.canvas-toolbar i{width:6px;height:6px;background:var(--mint);display:inline-block;border-radius:50%;margin-right:5px}.canvas-toolbar b{color:var(--paper);font-weight:400}.canvas-coordinates{border-top:1px solid var(--line);height:35px}.canvas-wrap{width:100%;aspect-ratio:1;position:relative;overflow:hidden;background:#101016;cursor:crosshair}#pixelCanvas{width:100%;height:100%;display:block;image-rendering:pixelated}.canvas-loading{position:absolute;inset:0;background:#101016;display:grid;place-content:center;text-align:center;z-index:3}.canvas-loading span{width:36px;height:36px;border:2px solid var(--line);border-top-color:var(--coral);border-radius:50%;margin:auto;animation:spin .8s linear infinite}.canvas-loading p{font:8px var(--mono);letter-spacing:.1em;color:var(--muted);margin-top:14px}.canvas-cursor{position:absolute;border:1px solid var(--paper);pointer-events:none;display:none;box-shadow:0 0 0 1px rgba(16,16,22,.8)}
.precision-hint{color:var(--coral)}.precision-editor{position:absolute;right:14px;bottom:14px;width:270px;padding:12px;background:rgba(11,11,15,.96);border:1px solid rgba(244,239,227,.34);box-shadow:8px 8px 0 rgba(0,0,0,.35);z-index:4}.precision-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px;font:8px var(--mono);letter-spacing:.1em;color:var(--paper)}.precision-head b{color:var(--coral);font-weight:400;margin-left:7px}.precision-head button{border:0;background:transparent;color:var(--paper);font-size:18px;line-height:1;cursor:pointer}.precision-editor canvas{display:block;width:242px;height:242px;image-rendering:pixelated;background:var(--ink);cursor:crosshair;touch-action:none}.precision-editor p{margin:9px 0 0;color:var(--muted);font:8px/1.5 var(--mono)}.frozen-banner{margin-top:8px;padding:10px;background:var(--yellow);color:var(--ink);text-align:center;font:9px var(--mono);letter-spacing:.08em}.mobile-brush{display:none}.pixel-inspector{margin:14px;padding:13px;border:1px solid var(--line);display:flex;gap:10px;min-height:70px}.inspector-swatch{width:32px;height:32px;flex:0 0 auto;background:#24242c}.pixel-inspector strong{font-size:11px}.pixel-inspector p{font-size:9px;line-height:1.5;color:var(--muted);margin:4px 0}.event-list{border-top:1px solid var(--line)}.event{padding:13px 15px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:9px 1fr;gap:9px}.event-dot{width:7px;height:7px;background:var(--event-color,var(--coral));margin-top:4px}.event-head{display:flex;justify-content:space-between;gap:8px;font-size:10px}.event-head time{font:8px var(--mono);color:var(--muted);white-space:nowrap}.event p{margin:4px 0 0;font-size:9px;line-height:1.45;color:var(--muted)}.event a{color:inherit;text-decoration:none}.event-skeleton{height:55px;margin:12px 15px;background:linear-gradient(90deg,#1f1f27,#292932,#1f1f27);background-size:200%;animation:shimmer 1.5s infinite}@keyframes shimmer{to{background-position:-200%}}.principles{border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:grid;grid-template-columns:repeat(4,1fr)}.principles article{padding:45px max(24px,3vw);border-right:1px solid var(--line);min-height:240px}.principles article:last-child{border:0}.principles b{font:9px var(--mono);color:var(--coral)}.principles h3{font-size:18px;margin:38px 0 12px}.principles p{font-size:12px;line-height:1.7;color:var(--muted);margin:0}.api-section{max-width:1230px;margin:auto;padding:120px 28px;display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;align-items:center}.api-copy h2{font-size:clamp(36px,5vw,62px);letter-spacing:-.05em;line-height:1;margin:0 0 20px}.api-copy>p{font-size:14px;line-height:1.7;color:var(--muted)}.endpoint-list{margin-top:30px;border-top:1px solid var(--line)}.endpoint-list>a,.endpoint-list>div{display:grid;grid-template-columns:38px 1fr auto;gap:9px;padding:11px 0;border-bottom:1px solid var(--line);align-items:center;text-decoration:none;color:inherit}.endpoint-list b{font:8px var(--mono);color:var(--mint)}.endpoint-list code{font:10px var(--mono)}.endpoint-list span{font-size:9px;color:var(--muted)}.terminal-card{background:#09090c;border:1px solid #2d2d36;box-shadow:16px 16px 0 #17171e}.terminal-head,.terminal-foot{height:44px;border-bottom:1px solid #2d2d36;padding:0 15px;display:flex;align-items:center;justify-content:space-between;font:8px var(--mono);letter-spacing:.1em;color:var(--muted)}.terminal-head>span{display:flex;gap:5px}.terminal-head i{width:7px;height:7px;border-radius:50%;background:var(--coral)}.terminal-head i:nth-child(2){background:var(--yellow)}.terminal-head i:nth-child(3){background:var(--mint)}.terminal-head button{background:transparent;border:0;color:var(--muted);font:8px var(--mono);cursor:pointer}.terminal-card pre{margin:0;padding:24px;overflow:auto;font:11px/1.75 var(--mono);color:#d7d4cb}.terminal-card .comment{color:#666674}.terminal-card .string{color:var(--yellow)}.terminal-foot{border-top:1px solid #2d2d36;border-bottom:0;justify-content:flex-start;gap:20px}footer{border-top:1px solid var(--line);padding:35px 4vw;display:flex;justify-content:space-between;align-items:center;font-size:10px;color:var(--muted)}footer p{margin:0}footer a{color:var(--paper);font:9px var(--mono);text-decoration:none}dialog{background:var(--panel);border:1px solid #3a3942;color:var(--paper);width:min(430px,calc(100vw - 28px));padding:0;box-shadow:0 24px 90px #000}dialog::backdrop{background:rgba(5,5,8,.8);backdrop-filter:blur(8px)}body:has(dialog[open]){overflow:hidden}dialog form{padding:35px;position:relative}dialog h2{font-size:28px;letter-spacing:-.04em;margin:0 0 10px}dialog p{font-size:12px;line-height:1.6;color:var(--muted);margin-bottom:24px}dialog label{display:block;margin:15px 0}dialog select{appearance:none}.dialog-close{position:absolute;right:12px;top:10px;border:0;background:transparent;color:var(--muted);font-size:25px;cursor:pointer}.dialog-pixels{display:flex;gap:4px;margin-bottom:25px}.dialog-pixels i{width:9px;height:9px;background:var(--coral)}.dialog-pixels i:nth-child(2){background:var(--yellow)}.dialog-pixels i:nth-child(3){background:var(--mint)}.dialog-pixels i:nth-child(4){background:var(--cyan)}.dialog-pixels i:nth-child(5){background:#9b5de5}.dialog-error{min-height:18px;color:var(--coral);font-size:10px;margin:8px 0}dialog small{font-size:8px;display:block;color:var(--muted);margin-top:13px;text-align:center}.toast{position:fixed;z-index:50;left:50%;bottom:25px;transform:translate(-50%,120px);background:var(--paper);color:var(--ink);padding:12px 18px;font:10px var(--mono);box-shadow:5px 5px 0 var(--coral);transition:transform .25s;max-width:calc(100vw - 30px);text-align:center}.toast.show{transform:translate(-50%,0)}@media(max-width:1050px){.world-layout{grid-template-columns:220px minmax(430px,1fr)}.right-rail{display:none}.principles{grid-template-columns:repeat(2,1fr)}.principles article:nth-child(2){border-right:0}.principles article:nth-child(-n+2){border-bottom:1px solid var(--line)}.api-section{gap:40px}}@media(max-width:760px){input,select,textarea{font-size:16px!important}.topbar{padding:0 12px;height:56px}.world-state{display:none}.top-actions{margin:0 0 0 auto;gap:11px}.top-actions button{display:none}.top-actions a{font-size:7px}.top-actions .top-brush{padding:7px}.brand>span:last-child{display:none}.intro{padding:60px 18px 45px}.intro h1{font-size:15vw}.intro p{font-size:14px}.world-layout{display:block;padding:0 12px 70px}.left-rail{display:none}.canvas-shell{width:100%}.mobile-brush{display:flex;margin-top:10px;padding:11px;gap:12px;position:sticky;bottom:8px;z-index:4;align-items:center}.mobile-brush .palette{flex:1;grid-template-columns:repeat(8,1fr)}.mobile-brush .button{flex:0 0 90px}.principles{grid-template-columns:1fr}.principles article{border-right:0!important;border-bottom:1px solid var(--line);min-height:auto;padding:30px 22px}.principles article:last-child{border-bottom:0}.principles h3{margin:18px 0 8px}.api-section{display:block;padding:80px 20px}.terminal-card{margin-top:45px;box-shadow:8px 8px 0 #17171e}.terminal-card pre{font-size:9px;padding:16px}.endpoint-list span{display:none}.endpoint-list>a,.endpoint-list>div{grid-template-columns:38px 1fr}footer{display:block;text-align:center}footer .brand{justify-content:center}footer p{margin:16px 0}.canvas-toolbar{height:38px}.precision-hint{display:none}.precision-editor{right:50%;bottom:10px;transform:translateX(50%);width:268px}.canvas-coordinates{font-size:7px}dialog form{padding:28px 22px}}