@import "https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;700&family=Noto+Serif+JP:wght@600;700&family=JetBrains+Mono:wght@400;500&display=swap";
:root{--bg:#f5f3ee;--white:#fff;--surface:#faf9f6;--border:#e0ddd6;--border2:#ccc9c0;--text:#1a1a18;--text-sub:#5a5850;--text-muted:#9a9890;--primary:#1a3a5c;--primary-light:#2a5a8c;--primary-pale:#e8f0f8;--accent:#c8392b;--accent-pale:#fdf0ee;--green:#2d7a4a;--green-pale:#edf7f1;--amber:#b85c00;--amber-pale:#fef5e8;--shadow:0 2px 12px #00000014;--shadow-lg:0 8px 32px #0000001f}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);margin:0;font-family:Noto Sans JP,sans-serif;font-weight:300}.app-container{background:var(--surface);flex-direction:column;max-width:430px;height:100dvh;margin:0 auto;display:flex;position:relative;overflow:hidden}.status-bar{background:var(--white);color:var(--text);z-index:50;justify-content:space-between;align-items:center;padding:6px 20px;font-family:JetBrains Mono,monospace;font-size:11px;font-weight:500;display:flex;position:sticky;top:0}.top-nav{background:var(--white);border-bottom:1px solid var(--border);z-index:40;justify-content:space-between;align-items:center;padding:12px 20px;display:flex;position:sticky;top:0}.top-nav-title{color:var(--primary);font-family:Noto Serif JP,serif;font-size:16px;font-weight:600}.bottom-nav{background:var(--white);border-top:1px solid var(--border);padding-top:8px;padding-left:0;padding-right:0;padding-bottom:calc(8px + env(safe-area-inset-bottom));z-index:50;display:flex;position:sticky;bottom:0}.bottom-nav-item{cursor:pointer;flex-direction:column;flex:1;align-items:center;gap:3px;padding:4px 0;text-decoration:none;display:flex}.bottom-nav-item .icon{font-size:18px}.bottom-nav-item .label{color:var(--text-muted);font-size:9px;font-weight:400}.bottom-nav-item.active .label{color:var(--primary);font-weight:500}.btn{cursor:pointer;text-align:center;border:none;border-radius:10px;width:100%;padding:14px;font-family:inherit;font-size:14px;font-weight:500;display:block}.btn-primary{background:var(--primary);color:#fff}.btn-outline{color:var(--primary);border:1.5px solid var(--primary);background:0 0}.btn-accent{background:var(--accent);color:#fff}.btn-ghost{color:var(--text-sub);background:#f0ede8}.input-group{margin-bottom:16px}.input-label{color:var(--text-sub);margin-bottom:6px;font-size:11px;font-weight:500}.input-field{border:1.5px solid var(--border2);width:100%;color:var(--text);background:var(--white);border-radius:10px;padding:12px 14px;font-family:inherit;font-size:14px}.card{background:var(--white);border:1px solid var(--border);border-radius:12px;margin-bottom:10px;padding:16px}.badge{border-radius:20px;align-items:center;padding:3px 8px;font-size:10px;font-weight:500;display:inline-flex}.badge-blue{background:var(--primary-pale);color:var(--primary)}.badge-amber{background:var(--amber-pale);color:var(--amber)}.badge-green{background:var(--green-pale);color:var(--green)}.divider{color:var(--text-muted);align-items:center;gap:12px;margin:20px 0;font-size:11px;display:flex}.divider:before,.divider:after{content:"";background:var(--border);flex:1;height:1px}