:root{--bg: #f2eee6;--fg: #11100f;--border: #201f1d;--muted: #5d5952;--accent: #2e44ff}html[data-theme=dark]{--bg: #0f0f0d;--fg: #ebe5da;--border: #dfd9cd;--muted: #b3ab9b;--accent: #7f8dff}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--fg);font-family:Space Grotesk,sans-serif}html.drag-locked,html.drag-locked body{height:100%;overflow:hidden;overscroll-behavior:none}a{color:inherit;text-decoration:none}.site-frame{max-width:1100px;margin:0 auto;padding:1rem}.site-frame--standalone{max-width:none;width:100vw;min-height:100dvh;margin:0;padding:1rem}.site-header{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:2px solid var(--border)}.nav-cell{border-right:2px solid var(--border);padding:.9rem 1rem;text-transform:uppercase;letter-spacing:.05em;font-size:.78rem;font-family:IBM Plex Mono,monospace}.nav-cell:last-child{border-right:0}.nav-cell.is-active{background:var(--fg);color:var(--bg)}.nav-cell-toggle{display:flex;align-items:center;justify-content:flex-end}.site-main{border:2px solid var(--border);border-top:0;min-height:calc(100dvh - 5rem);padding:clamp(1rem,2vw,1.5rem);background-image:linear-gradient(to right,color-mix(in srgb,var(--border) 14%,transparent) 1px,transparent 1px),linear-gradient(to bottom,color-mix(in srgb,var(--border) 14%,transparent) 1px,transparent 1px);background-size:28px 28px}.site-main--standalone{border-top:2px solid var(--border);min-height:calc(100dvh - 2rem);display:grid;align-items:center;padding:0}.page-grid{display:grid;gap:1rem}.site-main--standalone .page-grid{width:100%;height:100%;margin:0;place-items:center}.page-grid--center{width:100%;place-items:center}.page-grid--center .watch-mock{width:min(100%,860px)}.box{border:2px solid var(--border);background:color-mix(in srgb,var(--bg) 95%,var(--fg) 5%)}.section-headline{margin:0;font-size:clamp(2.4rem,7vw,6rem);line-height:.95;text-transform:uppercase;letter-spacing:-.03em}.section-subline{margin:0;font-family:IBM Plex Mono,monospace;color:var(--muted)}.card-grid{display:grid;gap:.8rem;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.card{border:2px solid var(--border);padding:1rem;display:grid;gap:.6rem;min-height:180px;background:var(--bg);transition:transform .13s ease,background-color .13s ease}.card:hover{transform:translate(-2px,-2px);background:color-mix(in srgb,var(--bg) 88%,var(--accent) 12%)}.kicker{margin:0;font-family:IBM Plex Mono,monospace;font-size:.72rem;text-transform:uppercase;letter-spacing:.07em;color:var(--muted)}.mono{font-family:IBM Plex Mono,monospace}.theme-toggle{border:2px solid var(--border);background:transparent;color:var(--fg);padding:.4rem .6rem;font-size:.74rem;text-transform:uppercase;letter-spacing:.05em;cursor:pointer}.theme-toggle:not(.theme-toggle--circle):hover{background:var(--fg);color:var(--bg)}.theme-toggle--circle{width:2.1rem;height:2.1rem;padding:0;border-radius:999px;display:grid;place-items:center;background:color-mix(in srgb,var(--bg) 86%,transparent);overflow:hidden}.theme-toggle--circle:before{content:"";width:.72rem;height:.72rem;border-radius:999px;background:var(--fg);transition:width .16s ease,height .16s ease}.theme-toggle--circle.is-hovered:before{width:80%;height:80%}.grid-lab{display:grid;gap:1rem;padding:1rem}.grid-lab-head{display:grid;gap:.35rem}.grid-lab-head p{margin:0}.grid-controls{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8rem;align-items:center;font-family:IBM Plex Mono,monospace;font-size:.75rem}.grid-controls label{display:grid;gap:.25rem}.grid-controls input,.grid-controls button{width:100%}.grid-controls button{border:2px solid var(--border);background:var(--bg);color:var(--fg);padding:.45rem .65rem;text-transform:uppercase;letter-spacing:.05em;cursor:pointer}.grid-controls button:hover{background:var(--fg);color:var(--bg)}.grid-canvas{display:grid;grid-template-columns:repeat(14,minmax(0,1fr));gap:3px;border:2px solid var(--border);padding:.5rem;background:color-mix(in srgb,var(--fg) 5%,var(--bg) 95%);touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.grid-cell{aspect-ratio:1 / 1;border:1px solid color-mix(in srgb,var(--border) 65%,transparent);background:var(--fg);cursor:crosshair;touch-action:none;pointer-events:none}.rosetta{display:grid;gap:.9rem;padding:1rem}.rosetta-head{display:grid;gap:.45rem}.rosetta-title{margin:0;font-size:clamp(1.5rem,2.5vw,2.1rem);text-transform:uppercase;letter-spacing:-.02em}.rosetta-controls{display:grid;gap:.75rem;grid-template-columns:repeat(3,minmax(0,1fr));align-items:end;font-family:IBM Plex Mono,monospace;font-size:.75rem}.rosetta-controls label{display:grid;gap:.2rem}.rosetta-controls input,.rosetta-controls button{width:100%}.rosetta-controls button{border:2px solid var(--border);background:var(--bg);color:var(--fg);padding:.45rem .65rem;text-transform:uppercase;letter-spacing:.04em;cursor:pointer}.rosetta-controls button:hover{background:var(--fg);color:var(--bg)}.rosetta-canvas-shell{border:2px solid var(--border);background:color-mix(in srgb,var(--fg) 4%,var(--bg) 96%);aspect-ratio:1 / 1;width:min(100%,820px);margin:0 auto}.rosetta-canvas{transform:rotate(-30deg);display:block;width:100%;height:100%;touch-action:none}.rosetta-status{margin:0;font-size:.74rem;color:var(--muted)}.rosetta-preview{padding:.8rem;display:grid;gap:.55rem}.rosetta-preview-stage{position:relative;width:min(100%,520px);aspect-ratio:1 / 1;overflow:hidden;background:color-mix(in srgb,var(--fg) 7%,var(--bg) 93%)}.rosetta-preview-image,.rosetta-preview-fallback,.rosetta-preview-overlay{position:absolute;inset:0;width:100%;height:100%}.rosetta-preview-image{object-fit:cover}.rosetta-preview-fallback{background:radial-gradient(circle at 20% 20%,#f6de9f 0%,transparent 42%),radial-gradient(circle at 70% 30%,#f68f7f 0%,transparent 38%),radial-gradient(circle at 45% 70%,#5371d0 0%,transparent 46%),#1f1f26}.rosetta-preview-overlay polygon{fill:#fff3;stroke:color-mix(in srgb,var(--fg) 30%,#ffd166 70%);stroke-width:.5px}.watch-mock{position:relative;aspect-ratio:1 / 1;overflow:hidden;background:color-mix(in srgb,var(--bg) 95%,var(--fg) 5%) url(/hand.webp) center / cover no-repeat;z-index:1;will-change:width;contain:layout;backface-visibility:hidden;transition:width .28s cubic-bezier(.22,.7,.18,1)}.watch-mock-wrap{--watch-gap: 16px;--watch-outer: 32px;--source-scale: .75;--source-gap: 0px;--watch-size-closed: min(100%, calc(100dvh - (2 * var(--watch-outer))));--watch-size-open: var(--watch-size-closed);--source-size: calc(var(--source-scale) * var(--watch-size-open));width:100%;height:100%;display:flex;justify-content:center;align-items:center;gap:var(--source-gap);padding:var(--watch-gap);transition:gap .28s cubic-bezier(.22,.7,.18,1)}.watch-mock-wrap--with-source{--watch-size-open: min( 100%, calc((100dvh - (2 * var(--watch-outer)) - var(--watch-gap)) / (1 + var(--source-scale))) );--source-size: calc(var(--source-scale) * min( calc(100vw - (2 * var(--watch-outer))), calc((100dvh - (2 * var(--watch-outer)) - var(--watch-gap)) / (1 + var(--source-scale))) ));flex-direction:column}.watch-mock-wrap.is-source-open{--source-gap: var(--watch-gap)}.watch-mock-wrap:not(.watch-mock-wrap--with-source) .watch-mock{width:var(--watch-size-closed)}.watch-mock-wrap--with-source:not(.is-source-open) .watch-mock{width:var(--watch-size-closed)}.watch-mock-wrap--with-source.is-source-open .watch-mock{width:var(--watch-size-open)}.watch-mock-wrap--with-source .watch-source-panel{width:var(--source-size);margin-top:calc(-1 * var(--source-size))}.watch-mock-theme-toggle{position:absolute;top:.8rem;right:.8rem;z-index:8}.watch-mock-theme-toggle .theme-toggle{backdrop-filter:blur(2px)}.watch-top-controls{position:absolute;top:.8rem;left:.8rem;z-index:8;display:flex;align-items:center;gap:.8rem}.watch-pause-btn,.watch-source-btn,.watch-border-btn{font-family:Gosha Sans,sans-serif!important;text-transform:none!important;font-variant-caps:normal!important;font-feature-settings:"smcp" 0,"c2sc" 0;display:inline-flex;align-items:center;justify-content:center;line-height:1;border:2px solid var(--border);background:color-mix(in srgb,var(--bg) 88%,transparent);color:var(--fg);height:2.1rem;padding:0 .66rem;font-size:.85rem;letter-spacing:.03em;cursor:pointer;box-shadow:2px 2px 0 var(--border);transform:translate(0);transition:background-color 80ms ease,color 80ms ease,transform 80ms ease,box-shadow 80ms ease;-webkit-tap-highlight-color:transparent}.watch-pause-btn{width:2.1rem;height:2.1rem;padding:0;letter-spacing:.03em}.watch-pause-btn svg{width:.95rem;height:.95rem}.watch-source-btn,.watch-border-btn{letter-spacing:.02em}.watch-path-btn{position:absolute;top:.8rem;right:.8rem;z-index:3;border:2px solid var(--border);background:color-mix(in srgb,var(--bg) 88%,transparent);color:var(--fg);height:2.1rem;padding:0 .66rem;display:inline-flex;align-items:center;justify-content:center;font-family:Gosha Sans,sans-serif!important;text-transform:none!important;font-variant-caps:normal!important;font-feature-settings:"smcp" 0,"c2sc" 0;font-size:.85rem;line-height:1;letter-spacing:.02em;cursor:pointer;box-shadow:2px 2px 0 var(--border);transform:translate(0);transition:background-color 80ms ease,color 80ms ease,transform 80ms ease,box-shadow 80ms ease;-webkit-tap-highlight-color:transparent}@media(hover:hover)and (pointer:fine){.watch-pause-btn:hover,.watch-source-btn:hover,.watch-border-btn:hover,.watch-path-btn:hover{background:color-mix(in srgb,var(--bg) 72%,var(--fg) 28%)}}.watch-pause-btn:active,.watch-source-btn:active,.watch-border-btn:active,.watch-path-btn:active{transform:translate(2px,2px);box-shadow:0 0 0 var(--border)}.watch-upload-dropzone{font-family:Gosha Sans,sans-serif!important;text-transform:none!important;font-variant-caps:normal!important;font-feature-settings:"smcp" 0,"c2sc" 0;position:absolute;left:.8rem;bottom:.8rem;z-index:8;border:2px dotted var(--border);background:color-mix(in srgb,var(--bg) 88%,transparent);color:var(--fg);height:2.1rem;padding:0 .66rem;display:grid;place-items:center;font-size:.85rem;letter-spacing:.02em;line-height:1;cursor:pointer;transition:background-color .14s ease,color .14s ease;-webkit-tap-highlight-color:transparent;transform:translateZ(0);backface-visibility:hidden}@media(min-width:1024px){.watch-upload-dropzone{height:2.35rem;padding:0 .78rem;font-size:1rem}}.watch-upload-dropzone input{position:absolute;inset:0;width:100%;height:100%;opacity:0;z-index:1;cursor:pointer}@media(hover:hover)and (pointer:fine){.watch-upload-dropzone:hover{background:color-mix(in srgb,var(--bg) 72%,var(--fg) 28%)}}.watch-upload-dropzone:active{background:color-mix(in srgb,var(--bg) 66%,var(--fg) 34%)}.watch-upload-dropzone.is-dragover{background:color-mix(in srgb,var(--bg) 62%,var(--fg) 38%)}.watch-mock-screen{position:absolute;left:36.8%;top:30.13%;width:26.4%;height:32.1%;border-radius:10%;overflow:hidden;background:#070912;box-shadow:inset 0 0 0 1px #0b101a99}.watch-source-panel{position:relative;aspect-ratio:1 / 1;padding:0;gap:0;opacity:0;transform:translateY(0);will-change:margin,opacity,transform;contain:layout paint;backface-visibility:hidden;overflow:hidden;z-index:0;transition:opacity .26s cubic-bezier(.16,.84,.2,1),transform .28s cubic-bezier(.16,.84,.2,1),margin-top .28s cubic-bezier(.22,.7,.18,1),margin-left .28s cubic-bezier(.22,.7,.18,1);pointer-events:none}.watch-source-panel.is-visible{opacity:1;margin-top:0;pointer-events:auto}@media(min-width:1024px){.watch-pause-btn,.watch-source-btn,.watch-border-btn,.watch-path-btn{height:2.35rem;font-size:1rem}.watch-pause-btn{width:2.35rem;height:2.35rem}.watch-pause-btn svg{width:1.05rem;height:1.05rem}.watch-top-controls{gap:.85rem}}.watch-source-stage{width:100%;height:100%;overflow:hidden}.watch-source-image{object-fit:fill}.watch-source-overlay polyline{fill:none;stroke:#ffffffe6;stroke-width:.65px;stroke-linecap:round;stroke-linejoin:round;opacity:.75}.watch-source-overlay polygon{fill:#ffffff1a;stroke:#fff;stroke-width:.5px}.watch-source-overlay circle{fill:#ffd166;stroke:color-mix(in srgb,#ebe5da 35%,transparent);stroke-width:.35px}@media(orientation:landscape){.watch-mock-wrap--with-source{--watch-size-open: min( calc((100% - var(--watch-gap)) / (1 + var(--source-scale))), calc(100dvh - (2 * var(--watch-outer))) );--source-size: calc(var(--source-scale) * min( calc((100vw - (2 * var(--watch-outer)) - var(--watch-gap)) / (1 + var(--source-scale))), calc(100dvh - (2 * var(--watch-outer))) ));flex-direction:row}.watch-mock-wrap--with-source:not(.is-source-open) .watch-mock{width:min(calc(100dvh - (2 * var(--watch-outer))),100%)}.watch-mock-wrap--with-source.is-source-open .watch-mock{width:var(--watch-size-open)}.watch-mock-wrap--with-source .watch-source-panel{width:var(--source-size);margin-top:0;margin-left:calc(-1 * var(--source-size))}.watch-mock-wrap--with-source .watch-source-panel.is-visible{margin-left:0}}.watch-crown-overlay{position:absolute;left:56.2%;top:17.3%;width:22%;height:43%;z-index:6;cursor:ns-resize;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;outline:none}.watch-crown-wheel{position:absolute;left:50%;top:50%;width:11.36%;height:15.5%;transform:translate(-50%,-50%);border-radius:30%;overflow:hidden;background:radial-gradient(120% 90% at 28% 20%,rgba(194,201,214,.52),transparent 48%),linear-gradient(165deg,#4a5160,#222836 42%,#0e1119);box-shadow:inset 0 0 0 1px #adbad21f,inset 0 -1px 2px #00000080,0 1px 5px #00000073}.watch-crown-wheel:before{content:"";position:absolute;left:-34%;top:18%;width:44%;height:64%;border-radius:30%;background:linear-gradient(180deg,#10141ecc,#06080cf2);box-shadow:inset 0 0 0 1px #414a5f73}.watch-crown-ridges{position:absolute;inset:0;border-radius:37%;background:linear-gradient(180deg,#96a1b733,#12162047);box-shadow:inset 0 0 0 1px #06080c80;overflow:hidden}.watch-crown-ridges-svg{width:100%;height:100%}.watch-crown-ridges-svg line{stroke:#e2eafa73;stroke-width:.7}.watch-photo-overlay{position:absolute;right:.8rem;bottom:.8rem;z-index:6;border:1px solid color-mix(in srgb,var(--fg) 20%,transparent);background:#f5f5f5db;color:#121212;padding:.24rem .35rem;display:grid;gap:.2rem;font-size:.64rem;text-transform:uppercase}.watch-photo-overlay input{width:140px}@media(max-width:720px){.grid-controls,.rosetta-controls{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:720px){.site-header{grid-template-columns:1fr 1fr}.nav-cell:nth-child(2){border-right:0}.nav-cell-toggle{justify-content:flex-start}}@font-face{font-family:Gosha Sans;src:url(/fonts/GoshaSans-Regular.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Strawford;src:url(/fonts/Strawford-Medium.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}@keyframes crown-hint-bob{0%,to{transform:translate(-50%,-50%) translateY(0)}50%{transform:translate(-50%,-50%) translateY(-18%)}}@keyframes crown-hint-fade-in{0%{opacity:0;transform:translate(-50%,-50%) scale(.85)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}.crown-hint{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;pointer-events:none;display:flex;flex-direction:column;align-items:center;gap:2px;animation:crown-hint-fade-in .6s cubic-bezier(.16,.84,.2,1) 1.2s both,crown-hint-bob 1.6s cubic-bezier(.37,0,.63,1) 1.8s infinite;transition:opacity .4s ease}.crown-hint.is-dismissed{opacity:0;pointer-events:none;animation:none}.crown-hint-icon{width:clamp(16px,3.2%,28px);height:auto;color:#e2eafae0;filter:drop-shadow(0 1px 3px rgba(0,0,0,.6))}