:root{--navy-900: #070d1a;--navy-850: #0b1526;--navy-800: #0f1c33;--navy-700: #16263f;--navy-600: #1e3350;--teal-500: #2fb6ab;--teal-400: #45c7bc;--teal-300: #6fd8ce;--teal-glow: rgba(69, 199, 188, .28);--gold-500: #c9a75a;--gold-400: #d9bd76;--text-strong: #f3f7fb;--text: #dbe4ef;--text-muted: #9fb0c4;--text-faint: #6f8199;--ok: #46c78a;--warn: #e0b74e;--danger: #e5715f;--glass-bg: rgba(22, 38, 63, .55);--glass-bg-strong: rgba(22, 38, 63, .72);--glass-border: rgba(146, 178, 214, .18);--glass-highlight: rgba(255, 255, 255, .06);--glass-shadow: 0 12px 32px rgba(2, 8, 20, .45);--glass-blur: 18px;--radius-lg: 22px;--radius-md: 16px;--radius-sm: 11px;--tap-min: 44px;--space-1: 6px;--space-2: 10px;--space-3: 16px;--space-4: 22px;--space-5: 30px;--font-sans: -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Noto Sans JP", "Segoe UI", Roboto, sans-serif;--header-h: 60px;--tabbar-h: 66px;--content-max: 560px;--dur-fast: .14s;--dur: .22s;--ease: cubic-bezier(.22, .61, .36, 1)}@media (prefers-reduced-motion: reduce){:root{--dur-fast: 0ms;--dur: 0ms}*{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:var(--font-sans);color:var(--text);background:radial-gradient(1200px 600px at 12% -8%,rgba(69,199,188,.12),transparent 60%),radial-gradient(1000px 700px at 110% 10%,rgba(201,167,90,.08),transparent 55%),linear-gradient(180deg,var(--navy-850),var(--navy-900));background-attachment:fixed;-webkit-font-smoothing:antialiased;line-height:1.5}.app-shell{min-height:100dvh;display:flex;flex-direction:column;max-width:var(--content-max);margin:0 auto;position:relative}.app-header{position:sticky;top:0;z-index:20;height:var(--header-h);display:flex;align-items:center;gap:var(--space-2);padding:0 var(--space-3);padding-top:env(safe-area-inset-top);background:linear-gradient(180deg,#0b1526e6,#0b15268c);backdrop-filter:blur(var(--glass-blur)) saturate(1.2);-webkit-backdrop-filter:blur(var(--glass-blur)) saturate(1.2);border-bottom:1px solid var(--glass-border)}.brand{display:flex;align-items:center;gap:var(--space-2);font-weight:700;color:var(--text-strong);letter-spacing:.02em}.brand .brand-mark{width:26px;height:26px;display:grid;place-items:center;border-radius:8px;background:linear-gradient(135deg,var(--teal-400),var(--teal-500));color:#04211f;font-weight:800}.header-spacer{flex:1}.app-main{flex:1;padding:var(--space-3) var(--space-3) calc(var(--tabbar-h) + var(--space-5));overflow-x:hidden}.tabbar{position:fixed;left:50%;transform:translate(-50%);bottom:0;width:100%;max-width:var(--content-max);height:calc(var(--tabbar-h) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);display:grid;grid-template-columns:repeat(5,1fr);z-index:30;background:linear-gradient(0deg,#0b1526f0,#0b152699);backdrop-filter:blur(var(--glass-blur)) saturate(1.2);-webkit-backdrop-filter:blur(var(--glass-blur)) saturate(1.2);border-top:1px solid var(--glass-border)}.tab-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;background:transparent;color:var(--text-faint);min-height:var(--tap-min);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:11px;cursor:pointer;transition:color var(--dur) var(--ease)}.tab-btn[aria-current=page]{color:var(--teal-300)}.tab-btn:focus-visible{outline:2px solid var(--teal-400);outline-offset:-4px;border-radius:12px}.glass{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--glass-shadow),inset 0 1px 0 var(--glass-highlight);backdrop-filter:blur(var(--glass-blur)) saturate(1.15);-webkit-backdrop-filter:blur(var(--glass-blur)) saturate(1.15)}.glass-strong{background:var(--glass-bg-strong)}.card{padding:var(--space-3);margin-bottom:var(--space-3)}.card h2,.card h3{margin:0 0 var(--space-2);color:var(--text-strong)}.section-title{color:var(--text-muted);font-size:12px;text-transform:uppercase;letter-spacing:.08em;margin:var(--space-4) 0 var(--space-2)}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--glass-border);background:#ffffff0a;color:var(--text);min-height:var(--tap-min);padding:0 var(--space-3);border-radius:var(--radius-md);font-size:15px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);transition:transform var(--dur-fast) var(--ease),background var(--dur) var(--ease),border-color var(--dur) var(--ease)}.btn:active{transform:scale(.98)}.btn:focus-visible{outline:2px solid var(--teal-400);outline-offset:2px}.btn-primary{background:linear-gradient(135deg,var(--teal-400),var(--teal-500));border-color:transparent;color:#042420;box-shadow:0 6px 18px var(--teal-glow)}.btn-gold{background:linear-gradient(135deg,var(--gold-400),var(--gold-500));border-color:transparent;color:#241a06}.btn-ghost{background:transparent}.btn-block{width:100%}.btn:disabled{opacity:.45;cursor:not-allowed}.badge{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:600;border:1px solid var(--glass-border);color:var(--text-muted)}.badge-teal{color:var(--teal-300);border-color:#45c7bc66}.badge-gold{color:var(--gold-400);border-color:#c9a75a66}.badge-warn{color:var(--warn);border-color:#e0b74e66}.dot{width:8px;height:8px;border-radius:50%;display:inline-block}.dot-ok{background:var(--ok);box-shadow:0 0 8px #46c78ab3}.dot-warn{background:var(--warn)}.dot-danger{background:var(--danger)}.field{margin-bottom:var(--space-3)}.field label{display:block;font-size:13px;color:var(--text-muted);margin-bottom:6px}.input,.textarea,.select{width:100%;background:#070d1a80;border:1px solid var(--glass-border);border-radius:var(--radius-md);color:var(--text-strong);padding:var(--space-2) var(--space-3);font-size:15px;font-family:inherit;min-height:var(--tap-min)}.textarea{min-height:130px;resize:vertical;line-height:1.6}.input:focus,.textarea:focus,.select:focus{outline:2px solid var(--teal-400);outline-offset:1px;border-color:transparent}.row{display:flex;align-items:center;gap:var(--space-2)}.between{justify-content:space-between}.muted{color:var(--text-muted)}.faint{color:var(--text-faint)}.strong{color:var(--text-strong)}.small{font-size:12px}.stack>*+*{margin-top:var(--space-2)}.img-slot{border:1px dashed var(--glass-border);border-radius:var(--radius-md);min-height:96px;display:grid;place-items:center;color:var(--text-faint);background:#070d1a59;text-align:center;gap:4px;padding:var(--space-3)}.sheet-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#0409148c;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:flex;align-items:flex-end;justify-content:center}.sheet{width:100%;max-width:var(--content-max);margin:0 var(--space-2);border-radius:var(--radius-lg) var(--radius-lg) 0 0;padding:var(--space-3);padding-bottom:calc(var(--space-4) + env(safe-area-inset-bottom));animation:sheet-up var(--dur) var(--ease)}@keyframes sheet-up{0%{transform:translateY(16px);opacity:.5}to{transform:translateY(0);opacity:1}}.acct-row{display:flex;align-items:center;gap:var(--space-3);width:100%;text-align:left;padding:var(--space-2);border-radius:var(--radius-md);border:1px solid transparent;background:transparent;color:var(--text);cursor:pointer;min-height:var(--tap-min)}.acct-row[aria-current=true]{border-color:#45c7bc66;background:#45c7bc14}.avatar{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;font-weight:700;color:#04211f;background:linear-gradient(135deg,var(--teal-300),var(--teal-500));flex:none}.list-item{display:flex;gap:var(--space-2);padding:var(--space-2) 0;border-bottom:1px solid var(--glass-border)}.list-item:last-child{border-bottom:0}.notice{font-size:12px;color:var(--text-faint);border-left:2px solid var(--glass-border);padding-left:var(--space-2);margin-top:var(--space-2)}.demo-switch{display:flex;gap:6px}.demo-switch button{font-size:11px;padding:4px 8px;min-height:30px}