:root{--color-bg:#121212;--color-surface:#1e1e1e;--color-surface-raised:#2a2a2a;--color-text:#f2f2f2;--color-text-muted:#9a9a9a;--color-accent:#00ffc8;--color-danger:#ff5c5c;--radius:12px;--tap-min:44px;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*,:before,:after{box-sizing:border-box}html,body{height:100%;margin:0}body{overscroll-behavior:none;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;background:var(--color-bg);width:100%;color:var(--color-text);font-family:-apple-system,BlinkMacSystemFont,PingFang TC,Noto Sans TC,sans-serif;font-size:16px;line-height:1.5;position:fixed;overflow:hidden}input,textarea,select{font-size:16px}.app{height:100vh;height:100dvh;padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}.view{flex-direction:column;height:100%;display:flex}.view__body{flex:1;min-height:0;padding:16px}.scroll-area{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;overflow-y:auto}.top-bar{min-height:calc(var(--tap-min) + 12px + env(safe-area-inset-top));padding:calc(env(safe-area-inset-top) + 12px) 16px 0;background:var(--color-bg);align-items:center;gap:8px;display:flex}.top-bar__title{margin:0;font-size:20px;font-weight:600}.bottom-bar{padding-bottom:env(safe-area-inset-bottom)}.empty-state{text-align:center;color:var(--color-text-muted);margin:48px 0 0}button,.btn{min-width:var(--tap-min);min-height:var(--tap-min);border-radius:var(--radius);background:var(--color-surface-raised);color:var(--color-text);font:inherit;cursor:pointer;border:0;padding:0 16px}.btn--primary{background:var(--color-accent);color:#000;font-weight:600}button:active,.btn:active,.card:active{opacity:.7;transform:scale(.98)}.global-error{left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));z-index:1000;border:1px solid var(--color-danger);border-radius:var(--radius);background:var(--color-surface);flex-direction:column;gap:12px;padding:16px;display:flex;position:fixed}.global-error[hidden]{display:none}.global-error p{margin:0}.landscape-mask{display:none}@media (orientation:landscape) and (max-height:500px){.landscape-mask{z-index:2000;background:var(--color-bg);color:var(--color-text);justify-content:center;align-items:center;font-size:18px;display:flex;position:fixed;inset:0}}