:root{--bg:#0a0a0f;--bg2:#0d0d18;--bg3:#1a1a26;--surface:#12121a;--surface2:#1a1a26;--border:#2a2a3e;--accent:#00d4aa;--red:#ff4d6a;--green:#00d4aa;--accent2:#896cfc;--accent2-bg:#7350f4;--up:#00d4aa;--down:#ff4d6a;--text:#e8e8f0;--text2:#88a;--text3:#83839b;--info:#4fc3f7;--warn:#f5a623;--shadow-1:0 1px 3px #0000000d, 0 1px 2px #00000008;--shadow-2:0 4px 12px #00000014, 0 2px 4px #0000000a;--shadow-glow:0 8px 32px #00d4aa2e;--ease:cubic-bezier(.4,0,.2,1);--accent-grad:linear-gradient(135deg, #00b899, var(--accent));--accent-fg:#071c17;--demo-banner-grad:linear-gradient(90deg, #fbbf24 0%, #f59e0b 100%);--demo-banner-fg:#1a1a2e;--demo-banner-shadow:0 4px 16px #f59e0b59;--demo-badge-bg:#f59e0b;--demo-badge-fg:#1a1a2e;--demo-banner-btn-bg:#1a1a2e;--demo-banner-btn-fg:#fbbf24;--modal-backdrop:#0009;--modal-backdrop-strong:#000000b3;--sp-xs:4px;--sp-sm:8px;--sp-md:12px;--sp-lg:16px;--sp-xl:20px;--sp-2xl:24px;--radius-sm:6px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px}body.light{--modal-backdrop:#14142873;--modal-backdrop-strong:#1414288c;--bg:#f0f0f7;--bg2:#f8f8fd;--bg3:#eaeaf2;--surface:#fff;--surface2:#eaeaf2;--border:#d4d4e8;--accent:#00775b;--accent-grad:linear-gradient(135deg, #006b53, var(--accent));--accent-fg:#fff;--accent2:#6040d8;--accent2-bg:#6040d8;--up:#00775c;--down:#cb1e3e;--red:#cb1e3e;--green:#00775c;--text:#1a1a2e;--text2:#557;--text3:#67677c;--shadow-1:0 1px 3px #1414280f, 0 1px 2px #1414280a;--shadow-2:0 4px 14px #14142814, 0 2px 6px #1414280d;--shadow-glow:0 8px 32px #00a88229}*{box-sizing:border-box;margin:0;padding:0}html{scrollbar-gutter:stable;font-family:Noto Sans KR,sans-serif;overflow-x:clip}body{background:var(--bg);color:var(--text);min-height:100dvh;font-family:Noto Sans KR,sans-serif;transition:background .2s,color .2s}body:before{content:"";background-image:linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px);opacity:.12;pointer-events:none;z-index:0;background-size:40px 40px;position:fixed;inset:0;-webkit-mask-image:radial-gradient(80% 60% at 50% 30%,#000c,#0000 70%);mask-image:radial-gradient(80% 60% at 50% 30%,#000c,#0000 70%)}body:after{content:"";background:radial-gradient(ellipse 60% 40% at 20% 0%,color-mix(in srgb, var(--accent) 4%, transparent),transparent 60%),radial-gradient(ellipse 50% 40% at 80% 100%,color-mix(in srgb, var(--accent2) 4%, transparent),transparent 60%);pointer-events:none;z-index:0;position:fixed;inset:0}body.light:after{background:radial-gradient(60% 40% at 20% 0,#00a8820d,#0000 60%),radial-gradient(50% 40% at 80% 100%,#6040d80a,#0000 60%)}#offlineBanner{z-index:9999;color:#fff;text-align:center;letter-spacing:.3px;background:#b45309;padding:8px 16px;font-size:13px;font-weight:600;display:none;position:fixed;top:0;left:0;right:0}#offlineBanner.visible{display:block}header{border-bottom:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-bottom:28px;padding-bottom:20px;display:flex}body.light .btn{color:var(--accent-fg)}body.light .btn--accent{color:var(--accent-fg)!important}body.light input,body.light select,body.light textarea{border-color:var(--border);color:var(--text);background:#fff}body.light input::placeholder,body.light textarea::placeholder{color:#8888a0}body.light select option{color:var(--text);background:#fff}body.light:before{opacity:.08}label{color:var(--text3);text-transform:uppercase;letter-spacing:.8px;font-family:Space Mono,monospace;font-size:11px}input,select,textarea{background:var(--surface2);border:1px solid var(--border);color:var(--text);border-radius:8px;outline:none;width:100%;padding:7px 10px;font-family:Space Mono,monospace;font-size:11px;transition:all .15s}input:focus,select:focus,textarea:focus{border-color:var(--accent2);box-shadow:0 0 0 3px color-mix(in srgb, var(--accent2) 10%, transparent)}input::placeholder,textarea::placeholder{color:var(--text3)}textarea{resize:vertical;min-height:60px;line-height:1.6}select option{background:var(--surface2)}.btn{background:var(--accent-grad);color:var(--accent-fg);cursor:pointer;white-space:nowrap;border:none;border-radius:8px;padding:7px 16px;font-family:Space Mono,monospace;font-size:11px;font-weight:700;transition:all .15s}.landing .btn{transition-property:transform,box-shadow}.btn:hover:not(:disabled){opacity:1;box-shadow:var(--shadow-glow);transform:translateY(-1px)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}input[type=range]{width:100%;accent-color:var(--accent2);cursor:pointer}kbd{background:var(--surface2);border:1px solid var(--border);color:var(--text2);border-radius:3px;padding:0 5px;font-family:Space Mono,monospace;font-size:11px;line-height:1.7;display:inline-block}@media (width<=600px){header{margin-bottom:16px;padding-bottom:12px}input,select,textarea{padding:5px 8px!important;font-size:11px!important}label{font-size:11px}.btn{min-height:44px}}@media (width<=480px){header{margin-bottom:12px;padding-bottom:10px}label{font-size:11px}input,select,textarea{padding:4px 7px!important;font-size:11px!important}}.cookie-banner{z-index:15000;border-top:1px solid color-mix(in srgb, var(--accent) 25%, transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#12121af7;padding:12px 20px;position:fixed;bottom:0;left:0;right:0}@media (width<=768px){.cookie-banner{bottom:calc(58px + env(safe-area-inset-bottom,0px))}}.cookie-banner-inner{flex-wrap:wrap;align-items:center;gap:16px;max-width:900px;margin:0 auto;display:flex}.cookie-text{color:var(--text2);flex:1;min-width:200px;font-size:13px;line-height:1.6}.cookie-text a{color:var(--accent);text-decoration:none}.cookie-text a:hover{text-decoration:underline}.cookie-accept-btn{background:var(--accent);color:#000;cursor:pointer;white-space:nowrap;border:none;border-radius:8px;padding:7px 18px;font-family:Space Mono,monospace;font-size:12px;font-weight:700;transition:all .15s}.cookie-accept-btn:hover{opacity:.85}@media (width<=600px){.cookie-banner{bottom:calc(60px + env(safe-area-inset-bottom));padding:10px 14px}.cookie-text{font-size:12px}}.pwa-update-banner{left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:9999;background:var(--accent);color:#fff;border-radius:12px;align-items:center;gap:10px;max-width:calc(100vw - 24px);padding:10px 12px 10px 16px;font-size:13px;display:flex;position:fixed;transform:translate(-50%);box-shadow:0 6px 24px #00000047}.pwa-update-banner .pwa-update-refresh{color:var(--accent);cursor:pointer;white-space:nowrap;background:#fff;border:none;border-radius:8px;min-height:36px;padding:7px 12px;font-size:12px;font-weight:700}.pwa-update-banner .pwa-update-dismiss{color:#fff;cursor:pointer;white-space:nowrap;opacity:.9;background:0 0;border:1px solid #ffffff8c;border-radius:8px;min-height:36px;padding:7px 10px;font-size:12px}@media (width<=768px){.pwa-update-banner{left:12px;right:12px;bottom:calc(58px + env(safe-area-inset-bottom,0px) + 12px);max-width:none;transform:none}}.btn--accent{background:var(--accent-grad);color:var(--accent-fg);cursor:pointer;border:none;border-radius:8px;padding:7px 16px;font-family:Space Mono,monospace;font-size:11px;font-weight:700;transition:all .15s}.btn--accent:hover:not(:disabled){opacity:1;color:var(--accent-fg);box-shadow:var(--shadow-glow);transform:translateY(-1px)}.btn--accent:disabled{opacity:.5;cursor:not-allowed}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text3)}*{scrollbar-width:thin;scrollbar-color:var(--border) transparent}[class*=mono],code{font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}@media (width<=768px){.btn:not(.btn-add-inline):not(.btn--icon):not(.btn--sm){min-height:44px}}::-webkit-scrollbar-thumb{background-clip:padding-box;border:1px solid #0000;border-radius:4px}main{transition:opacity .15s var(--ease)}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}button:focus:not(:focus-visible){outline:none}body.light{background:linear-gradient(#f5f5fa 0%,#f0f0f7 100%)}button:not(:disabled):active{transform:translateY(1px)scale(.99)}.btn--accent{transition:all .15s}:focus-visible{outline-color:var(--accent2)}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}[role=dialog] :focus-visible{outline:2px solid var(--accent2);outline-offset:2px}:where(button,a,input,select,textarea,[role=button],[tabindex]):focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--radius-sm)}:where(button,a,input,select,textarea):focus:not(:focus-visible){outline:none}.btn:active:not(:disabled){transform:scale(.985)}.btn:disabled{opacity:.5;cursor:not-allowed}