:root{--color-graph:#eef0ec;--color-graph-card:#f6f7f4;--color-inset:#fff;--color-graphite:#1b2a33;--color-graphite-60:#1b2a33b8;--color-graphite-40:#1b2a3366;--color-crease:#2e5e8c;--color-crease-line:#2e5e8c21;--color-crease-line-bold:#2e5e8c47;--color-grid-line:#2e5e8c12;--color-crane:#e84a27;--color-crane-dark:#c23a1c;--color-sax:#d9a521;--color-orbit:#2a2a6e;--font-display:"Bricolage Grotesque", ui-sans-serif, system-ui, sans-serif;--font-body:"Hanken Grotesk", ui-sans-serif, system-ui, sans-serif;--font-mono:"IBM Plex Mono", ui-monospace, monospace;--r-sm:6px;--r-md:10px;--r-lg:16px;--shadow-card:0 1px 2px #1b2a330f, 0 8px 24px #1b2a3314}[data-theme=dark]{--color-graph:#13202a;--color-graph-card:#182530;--color-inset:#1d2c38;--color-graphite:#e9ece7;--color-graphite-60:#e9ece7a8;--color-graphite-40:#e9ece780;--color-crease:#82a9ce;--color-crease-line:#82a9ce29;--color-crease-line-bold:#82a9ce4d;--color-grid-line:#82a9ce14;--color-crane:#f5613c;--shadow-card:0 1px 2px #0000004d, 0 8px 24px #0006}@font-face{font-family:Bricolage Grotesque;src:url(/fonts/BricolageGrotesque-SemiBold.woff2)format("woff2");font-weight:600;font-display:swap}@font-face{font-family:Hanken Grotesk;src:url(/fonts/HankenGrotesk-Regular.woff2)format("woff2");font-weight:400;font-display:swap}@font-face{font-family:Hanken Grotesk;src:url(/fonts/HankenGrotesk-Medium.woff2)format("woff2");font-weight:500;font-display:swap}@font-face{font-family:IBM Plex Mono;src:url(/fonts/IBMPlexMono-Regular.woff2)format("woff2");font-weight:400;font-display:swap}*,:before,:after{box-sizing:border-box}html,body{height:100%;margin:0}body{font-family:var(--font-body);color:var(--color-graphite);background:var(--color-graph);-webkit-font-smoothing:antialiased;overscroll-behavior:none}#app{height:100dvh}button{font-family:inherit}:focus-visible{outline:2px solid var(--color-crease);outline-offset:2px;border-radius:4px}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.001ms!important;animation-duration:.001ms!important}}.studio{grid-template-rows:auto 1fr;height:100dvh;display:grid;overflow:hidden}.canvas-host{touch-action:none;width:100%;height:100%;position:relative;overflow:hidden}.toolbar{background:color-mix(in srgb, var(--color-graph-card) 88%, transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--color-crease-line-bold);z-index:10;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:8px 12px;display:flex}.tb-brand{font-family:var(--font-display);letter-spacing:.2px;color:var(--color-graphite);align-items:center;gap:8px;padding-right:6px;font-size:15px;font-weight:600;display:inline-flex}.tb-mark{background:conic-gradient(from 0deg, var(--color-crane), var(--color-sax), #1d9e75, var(--color-orbit), var(--color-crane));width:16px;height:16px;box-shadow:inset 0 0 0 3px var(--color-graph-card);border-radius:50%}.tb-group{border-left:1px solid var(--color-crease-line);align-items:center;gap:4px;padding:0 8px;display:inline-flex}.tb-group:first-of-type{border-left:none}.tb-spacer{flex:auto}.swatch{border:2px solid var(--color-inset);width:24px;height:24px;box-shadow:0 0 0 1px var(--color-crease-line-bold);cursor:pointer;border-radius:50%;padding:0;transition:transform 80ms}.swatch:hover{transform:scale(1.1)}.swatch.is-active{box-shadow:0 0 0 2px var(--color-crane)}.swatch-spectrum{background:conic-gradient(red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.swatch-picker{background:var(--color-inset);place-items:center;display:grid;position:relative;overflow:hidden}.swatch-picker:after{content:"+";color:var(--color-graphite-60);font-size:16px;line-height:1}.swatch-picker input{opacity:0;cursor:pointer;position:absolute;inset:-6px}.icon-btn{border-radius:var(--r-sm);width:36px;height:36px;color:var(--color-graphite-60);cursor:pointer;background:0 0;border:1px solid #0000;place-items:center;transition:background .1s,color .1s;display:inline-grid}.icon-btn:hover:not(:disabled){background:var(--color-crease-line);color:var(--color-graphite)}.icon-btn.is-active{background:color-mix(in srgb, var(--color-crane) 16%, transparent);color:var(--color-crane);border-color:color-mix(in srgb, var(--color-crane) 35%, transparent)}.icon-btn:disabled{opacity:.35;cursor:not-allowed}.btn{border-radius:var(--r-sm);border:1px solid var(--color-crease-line-bold);background:var(--color-inset);height:36px;color:var(--color-graphite);cursor:pointer;align-items:center;gap:6px;padding:0 12px;font-size:13px;font-weight:500;text-decoration:none;display:inline-flex}.btn:hover{border-color:var(--color-crease)}.btn-ghost{background:0 0}.btn-primary{background:var(--color-crane);border-color:var(--color-crane);color:#fff}.btn-primary:hover{background:var(--color-crane-dark)}.btn-text{font-size:13px}.slider{flex-direction:column;gap:2px;min-width:96px;display:inline-flex}.slider-label{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.5px;color:var(--color-graphite-40);font-size:10px}.slider input[type=range]{width:100%;accent-color:var(--color-crane)}.menu{position:relative}.menu>summary{list-style:none}.menu>summary::-webkit-details-marker{display:none}.menu-panel{background:var(--color-graph-card);border:1px solid var(--color-crease-line-bold);border-radius:var(--r-md);min-width:160px;box-shadow:var(--shadow-card);z-index:20;gap:2px;padding:6px;display:grid;position:absolute;top:calc(100% + 6px);right:0}.menu-panel button,.menu-panel a{text-align:left;border-radius:var(--r-sm);color:var(--color-graphite);cursor:pointer;background:0 0;border:none;padding:8px 10px;font-size:13px;text-decoration:none;display:block}.menu-panel button:hover:not(:disabled),.menu-panel a:hover{background:var(--color-crease-line)}.menu-panel button:disabled{opacity:.4}.overlay{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:100;background:#0b121780;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.overlay-card{background:var(--color-graph-card);border:1px solid var(--color-crease-line-bold);border-radius:var(--r-lg);width:min(460px,100%);box-shadow:var(--shadow-card);max-height:min(88dvh,720px);padding:20px 22px;overflow:auto}@media (width<=640px){.overlay{place-items:end stretch;padding:0}.overlay-card{width:100%;max-width:none;max-height:90dvh;padding-bottom:calc(16px + env(safe-area-inset-bottom));border-radius:16px 16px 0 0}.overlay-card:before{content:"";background:var(--color-crease-line-bold);border-radius:2px;width:36px;height:4px;margin:0 auto 12px;display:block}}@media (width<=640px) and (prefers-reduced-motion:no-preference){.overlay-card{animation:.22s sheet-up}}@keyframes sheet-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}.overlay-head{justify-content:space-between;align-items:center;margin-bottom:14px;display:flex}.overlay-head h2{font-family:var(--font-display);margin:0;font-size:18px}.shortcuts{gap:8px;margin:0;display:grid}.shortcut{justify-content:space-between;align-items:center;gap:16px;display:flex}.shortcut dt{margin:0}.shortcut dd{color:var(--color-graphite-60);margin:0;font-size:13px}kbd{font-family:var(--font-mono);background:var(--color-inset);border:1px solid var(--color-crease-line-bold);color:var(--color-graphite);white-space:nowrap;border-bottom-width:2px;border-radius:4px;padding:2px 6px;font-size:12px}.overlay-foot{color:var(--color-graphite-60);margin:16px 0 0;font-size:12.5px;line-height:1.5}.toolbar-compact,.toolbar-phone-top{flex-wrap:nowrap;overflow:visible}.toolbar-compact .btn-text{display:none}.pop>summary{list-style:none}.pop>summary::-webkit-details-marker{display:none}.pop-panel{gap:10px;min-width:200px;display:grid;left:0;right:auto}.pop-panel .slider{width:100%;min-width:0}.pop-row{gap:4px;display:flex}.pop-swatches{flex-wrap:wrap;gap:6px;min-width:168px;display:flex}.dock-brand{font-family:var(--font-display);color:var(--color-graphite);align-items:center;gap:8px;font-size:15px;font-weight:600;display:inline-flex}.dock{padding:6px 10px calc(6px + env(safe-area-inset-bottom));background:color-mix(in srgb, var(--color-graph-card) 92%, transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-top:1px solid var(--color-crease-line-bold);z-index:10;justify-content:space-around;align-items:center;gap:4px;display:flex;position:relative}.dock .menu-panel{inset:auto auto calc(100% + 8px) 50%;transform:translate(-50%)}@media (width<=640px){.studio{grid-template-rows:auto 1fr auto}.canvas-host{grid-row:2}.dock{grid-row:3}.toolbar-phone-top{gap:8px;padding:8px 12px}}@media (pointer:coarse){.icon-btn,.menu>summary.icon-btn{width:44px;height:44px}.btn,.menu>summary.btn{min-height:44px}.dock .swatch,.pop-swatches .swatch{width:32px;height:32px}}@media (prefers-reduced-motion:reduce){.icon-btn,.swatch{transition:none}.swatch:hover{transform:none}}.page{flex-direction:column;min-height:100dvh;display:flex}.page-nav{border-bottom:1px solid var(--color-crease-line-bold);background:color-mix(in srgb, var(--color-graph-card) 90%, transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:10;justify-content:space-between;align-items:center;gap:12px;padding:10px 16px;display:flex;position:sticky;top:0}.page-nav .tb-brand{text-decoration:none}.page-nav-links{align-items:center;gap:8px;display:flex}.page-body{flex:1;width:min(1100px,100%);margin:0 auto;padding:24px 16px 64px}.page-head h1{font-family:var(--font-display);margin:4px 0 16px;font-size:26px}.empty{color:var(--color-graphite-60);padding:40px 0;font-size:15px}.link{color:var(--color-crease);text-decoration:underline}.link-danger{color:var(--color-crane);cursor:pointer;background:0 0;border:none;padding:0;font-size:12px}.masonry{column-count:4;column-gap:14px}@media (width<=1023px){.masonry{column-count:3}}@media (width<=640px){.masonry{column-count:2}}.art-card{break-inside:avoid;background:var(--color-graph-card);border:1px solid var(--color-crease-line);border-radius:var(--r-md);box-shadow:var(--shadow-card);margin:0 0 14px;overflow:hidden}.art-card img{background:var(--color-inset);width:100%;height:auto;display:block}.art-card figcaption{flex-direction:column;gap:4px;padding:8px 10px 10px;display:flex}.art-title{font-size:13px;font-weight:500}.art-author,.art-meta{color:var(--color-graphite-60);font-size:12px}.art-author{align-items:center;gap:6px;display:flex}.avatar-img{object-fit:cover;background:var(--color-inset);border-radius:50%;flex:none}.art-author .avatar-img,.artwork-author .avatar-img{width:20px;height:20px}.artwork-author .avatar-img{width:24px;height:24px}.art-author .avatar-fallback,.artwork-author .avatar-fallback{background:var(--color-crease-line);border-radius:50%;flex:none;place-items:center;width:20px;height:20px;font-size:11px;line-height:1;display:inline-grid}.artwork-author .avatar-fallback{width:24px;height:24px;font-size:13px}.art-controls{justify-content:space-between;align-items:center;gap:8px;display:flex}.art-controls select{border:1px solid var(--color-crease-line-bold);background:var(--color-inset);color:var(--color-graphite);border-radius:4px;padding:2px 4px;font-size:12px}.load-more{place-items:center;padding:28px 0;display:grid}.artwork{grid-template-columns:minmax(0,1.4fr) minmax(240px,1fr);align-items:start;gap:28px;display:grid}@media (width<=760px){.artwork{grid-template-columns:1fr}}.artwork-frame{background:var(--color-graph-card);border:1px solid var(--color-crease-line-bold);border-radius:var(--r-lg);box-shadow:var(--shadow-card);padding:14px}.artwork-frame img{border-radius:var(--r-md);width:100%;height:auto;display:block}.artwork-side h1{font-family:var(--font-display);margin:0 0 4px;font-size:24px}.artwork-author{color:var(--color-graphite-60);align-items:center;gap:8px;margin:0 0 12px;display:flex}.artwork-meta{color:var(--color-graphite-60);margin:0 0 20px;font-size:13px}.artwork-actions{gap:8px;margin-bottom:20px;display:flex}.artwork-downloads{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.downloads-label{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.5px;color:var(--color-graphite-40);font-size:11px}.auth-menu{position:relative}.avatar-btn{border:1px solid var(--color-crease-line-bold);background:var(--color-inset);cursor:pointer;border-radius:50%;place-items:center;width:36px;height:36px;padding:0;display:grid;overflow:hidden}.avatar-btn img{object-fit:cover;width:100%;height:100%}.avatar-fallback{color:var(--color-crease);font-weight:600}.auth-skel{background:var(--color-crease-line);border-radius:50%;width:36px;height:36px}.auth-panel{min-width:180px}.auth-name{color:var(--color-graphite-60);border-bottom:1px solid var(--color-crease-line);margin-bottom:4px;padding:6px 10px;font-size:12px}.save-form,.save-signin{flex-direction:column;gap:14px;display:flex}.save-signin p{color:var(--color-graphite-60);margin:0;font-size:14px;line-height:1.5}.field{flex-direction:column;gap:5px;display:flex}.field span{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.5px;color:var(--color-graphite-40);font-size:11px}.field input,.field select{border-radius:var(--r-sm);border:1px solid var(--color-crease-line-bold);background:var(--color-inset);color:var(--color-graphite);font-size:14px;font-family:var(--font-body);padding:9px 10px}.ts-widget{min-height:65px}.form-error{color:var(--color-crane);margin:0;font-size:13px}.save-actions{justify-content:flex-end;gap:8px;display:flex}@media (width<=480px){.signin-tail{display:none}}@media (width<=560px){.page-nav{gap:8px;padding:8px 12px}.page-nav-links{gap:6px}}@media (width<=640px){.art-controls{flex-direction:column;align-items:stretch;gap:6px}.art-controls select{width:100%}.art-controls .link-danger{text-align:center;border:1px solid var(--color-crease-line-bold);border-radius:var(--r-sm);width:100%;padding:8px 0}.artwork-actions .btn{flex:1}.artwork-downloads{width:100%}}@media (pointer:coarse){.art-controls select{min-height:40px}}