/* base.css — reset, tokens, typography (tech gradient refresh) */
:root{
  /* ==== グラデーション ==== */
  --grad-sidebar: linear-gradient(180deg, #1a2332 0%, #2a3a52 50%, #2e4463 100%);
  --grad-sidebar-active: linear-gradient(90deg, rgba(61,220,151,.18) 0%, rgba(61,220,151,0) 100%);
  --grad-primary: linear-gradient(135deg, #3ddc97 0%, #17c0a0 100%);
  --grad-primary-hover: linear-gradient(135deg, #2ecc71 0%, #10a88c 100%);
  --grad-accent-soft: linear-gradient(135deg, rgba(61,220,151,.14) 0%, rgba(23,192,160,.10) 100%);
  --grad-topbar: linear-gradient(180deg, #ffffff 0%, #fafbfd 100%);
  --grad-app-bg: linear-gradient(180deg, #f7f9fc 0%, #eef2f7 100%);
  --grad-icon-box: linear-gradient(135deg, #3ddc97 0%, #17c0a0 100%);
  --grad-logo: linear-gradient(135deg, #3ddc97 0%, #17c0a0 100%);

  /* ==== 背景 ==== */
  --bg-sidebar:#1a2332;
  --bg-sidebar-hover:rgba(255,255,255,.06);
  --bg-app:#f5f7fb;
  --bg-card:#ffffff;
  --bg-card-hover:#fdfefe;
  --bg-topbar:#ffffff;

  /* ==== テキスト ==== */
  --text-on-dark:#ffffff;
  --text-on-dark-sub:rgba(255,255,255,.58);
  --text-primary:#1a2332;
  --text-secondary:#6b7a8f;
  --text-muted:#a7b2c2;

  /* ==== アクセント ==== */
  --accent-good:#3ddc97;
  --accent-good-dark:#17c0a0;
  --accent-warn:#f5b942;
  --accent-bad:#ef5b5b;
  --accent-info:#4a9eff;

  /* ==== 罫線・影 ==== */
  --border-light:#eef1f6;
  --border-mid:#dde3ec;
  --shadow-card:0 1px 2px rgba(30,45,70,.04), 0 4px 20px rgba(30,45,70,.05);
  --shadow-card-hover:0 8px 30px rgba(30,45,70,.12);
  --shadow-lg:0 20px 50px rgba(30,45,70,.15);
  --shadow-modal:0 30px 80px rgba(30,45,70,.25);
  --shadow-sidebar:4px 0 24px rgba(26,35,50,.08);

  /* ==== サイズ・角丸 ==== */
  --radius-sm:6px;
  --radius-md:12px;
  --radius-lg:16px;
  --radius-pill:999px;
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px;
  --space-5:24px; --space-6:32px; --space-7:48px;
}

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:'Inter','Noto Sans JP',-apple-system,'Yu Gothic UI',sans-serif;
  font-size:14px;
  line-height:1.6;
  color:var(--text-primary);
  background:var(--grad-app-bg);
  background-attachment:fixed;
  font-feature-settings:"tnum" 1, "cv11" 1;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
a{color:var(--accent-info);text-decoration:none;transition:color .15s}
a:hover{color:#2a82e0}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
input,select,textarea{font:inherit;color:inherit}
table{border-collapse:collapse;width:100%}
ul{list-style:none;margin:0;padding:0}

h1{font-size:22px;font-weight:600;margin:0;letter-spacing:-0.3px}
h2{font-size:15px;font-weight:700;margin:0 0 var(--space-4);letter-spacing:-0.2px;color:var(--text-primary)}
h3{font-size:13px;font-weight:600;margin:0 0 var(--space-2)}

.stat-value{
  font-size:30px;font-weight:300;
  letter-spacing:-0.8px;
  color:var(--text-primary);
  line-height:1.1;
}
.stat-value.sm{font-size:20px;font-weight:400;letter-spacing:-0.3px}
.stat-value.lg{font-size:38px;font-weight:200}
.stat-label{
  font-size:10px;
  font-weight:700;
  color:var(--text-secondary);
  text-transform:uppercase;
  letter-spacing:1.2px;
  display:block;
  margin-bottom:6px;
}

.text-secondary{color:var(--text-secondary)}
.text-muted{color:var(--text-muted)}
.mono{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}
.hidden{display:none !important}

/* Scrollbar (WebKit) */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#d5dce6;border-radius:10px;border:2px solid transparent;background-clip:padding-box}
::-webkit-scrollbar-thumb:hover{background:#b5bfce;background-clip:padding-box;border:2px solid transparent}

/* Selection */
::selection{background:rgba(61,220,151,.25);color:var(--text-primary)}
