:root{--bg: #05070a;--fg: #d8dde6;--dim: #6a7280;--dimmer: #4a5260;--accent: #ff5a3c;--mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;--backdrop-bg: rgba(5, 7, 10, .62);--backdrop-bg-strong: rgba(5, 7, 10, .82);--backdrop-blur: blur(10px) saturate(140%);--backdrop-border: 1px solid rgba(255, 255, 255, .06)}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;width:100%;background:var(--bg);color:var(--fg);font-family:var(--mono);overflow:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}#app{position:fixed;inset:0}#stage{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:pan-y}.hud{position:absolute;font-size:10px;letter-spacing:.32em;text-transform:uppercase;color:var(--dimmer);z-index:10;pointer-events:none;background:var(--backdrop-bg);backdrop-filter:var(--backdrop-blur);-webkit-backdrop-filter:var(--backdrop-blur);border:var(--backdrop-border);border-radius:4px;padding:8px 12px}#brand{top:22px;left:24px;display:flex;gap:12px;align-items:baseline}.brand-mark{color:var(--accent);font-weight:700;letter-spacing:.4em}.brand-meta{color:#aab1bd}#hud{bottom:22px;left:24px;display:flex;flex-direction:column;gap:4px;min-width:220px}#hud-title{color:#fff;font-size:11px}#hud-sub{color:var(--dim);font-size:9px}#back-button{position:absolute;top:64px;left:24px;z-index:26;pointer-events:auto;appearance:none;border:1px solid rgba(255,90,60,.32);border-radius:999px;background:var(--backdrop-bg-strong);backdrop-filter:var(--backdrop-blur);-webkit-backdrop-filter:var(--backdrop-blur);color:#ffffffe6;cursor:pointer;font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.18em;line-height:1;padding:10px 14px;text-transform:uppercase;transition:opacity .18s ease,background-color .16s ease,color .16s ease,transform .18s ease}#back-button:hover{background:#ff5a3c2e;color:#fff}#back-button:active{transform:scale(.96)}#back-button:focus-visible{outline:1px dashed var(--accent);outline-offset:3px}#back-button.hidden{opacity:0;pointer-events:none}#menu{position:absolute;left:0;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:2px;z-index:20;pointer-events:auto;user-select:none;background:linear-gradient(to right,var(--backdrop-bg-strong) 0%,var(--backdrop-bg) 65%,rgba(5,7,10,0) 100%);backdrop-filter:var(--backdrop-blur);-webkit-backdrop-filter:var(--backdrop-blur);border-right:var(--backdrop-border);padding:18px 36px 18px 22px;border-radius:0 16px 16px 0;transition:transform .26s cubic-bezier(.2,.7,.2,1)}#menu:after{content:"Menu";position:absolute;top:50%;right:-31.2px;width:31.2px;height:182.4px;display:flex;align-items:center;justify-content:center;transform:translateY(-50%);border:1px solid rgba(255,90,60,.32);border-left:0;border-radius:0 999px 999px 0;background:linear-gradient(to right,#05070a,#05070a);box-shadow:0 0 22px #ff5a3c38;color:#ffffffe0;font-family:var(--mono);font-size:14.4px;font-weight:700;letter-spacing:.16em;line-height:1;opacity:0;pointer-events:none;text-orientation:upright;text-transform:uppercase;writing-mode:vertical-rl;transition:background .18s ease,opacity .18s ease,transform .26s cubic-bezier(.2,.7,.2,1)}.menu-item{appearance:none;background:transparent;border:0;border-left:2px solid transparent;color:#dce2ea99;font-family:inherit;font-size:13px;letter-spacing:.22em;text-transform:uppercase;padding:10px 14px 10px 16px;cursor:pointer;text-align:left;white-space:nowrap;transition:color .22s ease,border-color .22s ease,transform .26s cubic-bezier(.2,.7,.2,1),letter-spacing .26s ease}.menu-item:hover{color:#cfd5e0}.menu-item.active{color:#fff;border-left-color:var(--accent);transform:translate(8px);letter-spacing:.28em}.menu-item:focus-visible{outline:1px dashed var(--accent);outline-offset:4px}.menu-item:before{content:"";display:inline-block;width:6px;height:1px;background:currentColor;margin-right:10px;vertical-align:middle;opacity:.4;transition:width .26s ease,opacity .26s ease}.menu-item.active:before{width:18px;opacity:1}.submenu{display:flex;flex-direction:column;gap:0;overflow-y:auto;max-height:0;opacity:0;padding-left:14px;margin-left:12px;border-left:1px solid rgba(255,90,60,.18);pointer-events:none;transition:max-height .32s cubic-bezier(.2,.7,.2,1),opacity .22s ease 60ms}.submenu.open{max-height:60vh;opacity:1;pointer-events:auto}.submenu::-webkit-scrollbar{width:0}.submenu-item{appearance:none;background:transparent;border:0;border-left:2px solid transparent;color:#b4bcc88c;font-family:inherit;font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;padding:6px 10px 6px 12px;cursor:pointer;text-align:left;white-space:nowrap;max-width:240px;overflow:hidden;text-overflow:ellipsis;transition:color .2s ease,border-color .2s ease,transform .24s cubic-bezier(.2,.7,.2,1)}.submenu-item:hover{color:#cfd5e0}.submenu-item.active{color:#fff;border-left-color:var(--accent);transform:translate(4px)}.submenu-item:focus-visible{outline:1px dashed var(--accent);outline-offset:2px}#gallery-nav{position:absolute;bottom:24px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:14px;z-index:25;pointer-events:auto;user-select:none;background:var(--backdrop-bg-strong);backdrop-filter:var(--backdrop-blur);-webkit-backdrop-filter:var(--backdrop-blur);border:1px solid rgba(255,90,60,.32);border-radius:999px;padding:6px 10px;font-family:var(--mono);font-size:12px;letter-spacing:.18em;transition:opacity .22s ease}#gallery-nav.hidden{opacity:0;pointer-events:none}#gallery-nav button{appearance:none;background:transparent;border:0;color:#ffffffd9;font-size:14px;width:32px;height:32px;border-radius:999px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:background-color .16s ease,color .16s ease,transform .2s ease}#gallery-nav button:hover{background:#ff5a3c2e;color:#fff}#gallery-nav button:active{transform:scale(.94)}#gallery-nav button:focus-visible{outline:1px dashed var(--accent);outline-offset:2px}#gallery-counter{color:#ffffffeb;font-variant-numeric:tabular-nums;min-width:64px;text-align:center}#loading{position:absolute;inset:auto 0 0;height:1px;background:#ff5a3c1a;z-index:30;pointer-events:none}#loading span{display:block;height:100%;width:0%;background:var(--accent);transition:width .7s cubic-bezier(.2,.7,.2,1)}#loading.done{opacity:0;transition:opacity .6s ease .2s}#debug-hud{position:absolute;top:22px;right:22px;z-index:25;background:var(--backdrop-bg-strong);backdrop-filter:var(--backdrop-blur);-webkit-backdrop-filter:var(--backdrop-blur);border:1px solid rgba(255,90,60,.4);border-radius:4px;color:#cfd5e0;font-size:11px;letter-spacing:.04em;font-family:var(--mono);min-width:220px;max-width:280px;padding:0;pointer-events:none;user-select:none;transition:opacity .2s ease}#debug-hud.hidden{opacity:0;pointer-events:none}#debug-hud header{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);padding:8px 12px;border-bottom:1px solid rgba(255,90,60,.25);display:flex;align-items:center;gap:8px}#debug-hud .dot{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 6px var(--accent);animation:pulse 1.4s ease-in-out infinite}#debug-hud dl{margin:0;padding:8px 12px 10px;display:grid;grid-template-columns:90px 1fr;gap:4px 12px;font-variant-numeric:tabular-nums}#debug-hud dt{color:var(--dim);text-transform:uppercase;font-size:10px;letter-spacing:.14em}#debug-hud dd{margin:0;color:#fff}@keyframes pulse{0%,to{opacity:1}50%{opacity:.35}}@media (min-aspect-ratio: 21/9){#brand{top:28px;left:40px}#back-button{top:72px;left:40px}#hud{bottom:28px;left:40px}#menu{padding:22px 56px 22px 40px}#debug-hud{top:28px;right:40px}}@media (min-width: 768px) and (any-hover: hover) and (any-pointer: fine){#menu{pointer-events:none;transform:translate(-100%) translateY(-50%)}#menu:after{opacity:1}#menu.edge-open,#menu:focus-within{pointer-events:auto;transform:translate(0) translateY(-50%)}#menu.edge-open:after,#menu:focus-within:after{background:linear-gradient(to right,var(--backdrop-bg-strong),var(--backdrop-bg));backdrop-filter:var(--backdrop-blur);-webkit-backdrop-filter:var(--backdrop-blur);right:-26px;width:26px;height:152px;font-size:12px;opacity:1;transform:translateY(-50%)}}@media (min-aspect-ratio: 4/5) and (max-aspect-ratio: 16/9){#menu{padding:14px 28px 14px 18px}#hud{min-width:0;padding:6px 10px}#brand{padding:6px 10px}#back-button{top:58px;left:18px}}@media (max-aspect-ratio: 4/5){#menu{inset:auto 0 0;opacity:1;pointer-events:auto;transform:none;flex-direction:row;flex-wrap:nowrap;gap:0;justify-content:flex-start;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;background:linear-gradient(to top,var(--backdrop-bg-strong) 0%,var(--backdrop-bg) 75%,rgba(5,7,10,0) 100%);border-right:none;border-top:var(--backdrop-border);border-radius:16px 16px 0 0;padding:18px 16px 22px}#menu:after{display:none}#menu::-webkit-scrollbar{display:none}.menu-item{border-left:0;border-bottom:2px solid transparent;font-size:13px;padding:12px 18px;flex:0 0 auto}.submenu-item{font-size:11px;padding:8px 12px 8px 14px}.submenu{display:none}.menu-item.active{transform:none;border-bottom-color:var(--accent);letter-spacing:.22em}.menu-item:before{display:none}#brand{top:max(14px,env(safe-area-inset-top,0px));left:max(14px,env(safe-area-inset-left,0px));font-size:9px;padding:6px 10px}.brand-meta{display:none}#back-button{top:auto;bottom:calc(140px + env(safe-area-inset-bottom,0px));left:auto;right:max(14px,env(safe-area-inset-right,0px));font-size:10px;padding:10px 14px}#hud{top:max(14px,env(safe-area-inset-top,0px));right:max(14px,env(safe-area-inset-right,0px));bottom:auto;left:auto;text-align:right;align-items:flex-end;min-width:0;padding:6px 10px}#debug-hud{top:60px;right:max(14px,env(safe-area-inset-right,0px));min-width:180px;max-width:220px;font-size:10px}#debug-hud dl{grid-template-columns:70px 1fr}#gallery-nav{bottom:calc(140px + env(safe-area-inset-bottom,0px));font-size:11px;padding:4px 8px;gap:10px}#gallery-nav button{width:28px;height:28px;font-size:13px}#gallery-counter{min-width:56px}}@media (max-width: 480px),(max-height: 480px){.menu-item{font-size:12px;padding:11px 16px}.submenu-item{font-size:10px;padding:7px 10px 7px 12px}#brand,#hud{font-size:9px}#hud-title{font-size:10px}#hud-sub{font-size:8px}}@media (prefers-reduced-motion: reduce){#menu,#menu:after,.menu-item,#loading span{transition:none}#debug-hud .dot{animation:none}}@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))){.hud,#menu,#debug-hud{background-color:#05070ae0}}
