/* assets/css/base.css */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }

/* Theme Tokens */
:root {
  --max-w: 1200px;
  --space-0: 0; --space-1: .25rem; --space-2: .5rem; --space-3: .75rem; --space-4: 1rem; --space-6: 1.5rem; --space-8: 2rem; --space-12: 3rem;
  --radius: 12px;
  --shadow-1: 0 4px 16px rgba(0,0,0,.08);

  --fg: #111; --bg: #fff; --muted: #666; --border: #e8e8e8;
  --brand: #0b6cff; --brand-weak: rgba(11,108,255,.1);
}
html[data-theme='dark'] { --fg:#eaeaea; --bg:#0e0f12; --muted:#a5a5a5; --border:#2a2c34; --brand:#5ea1ff; --brand-weak:rgba(94,161,255,.12); }

body { font-family: Pretendard, system-ui, -apple-system, Segoe UI, Roboto, sans-serif; color: var(--fg); background: var(--bg); line-height: 1.6; }
.container { width: min(100% - 2rem, var(--max-w)); margin-inline: auto; }
.stack > * + * { margin-top: var(--space-6); }
.section { padding: var(--space-12) 0; }
.card { background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-1); }

/* Header */
.site-header { position: sticky; top: 0; z-index: 10; background: var(--bg); border-bottom: 1px solid var(--border); }
.site-header .row { display:flex; align-items:center; gap: var(--space-4); padding: var(--space-3) 0; }
.brand { display:flex; align-items:center; gap: .6rem; font-weight: 700; }
.brand img { height: 28px; width: auto; }
.site-nav { margin-left: auto; display:flex; gap: 1rem; }
.site-nav a { padding: .5rem .75rem; border-radius: 8px; color: var(--muted); }
.site-nav a.is-active { color: var(--fg); background: var(--brand-weak); }

.nav-toggle { display:none; }
@media (max-width: 960px) {
  .nav-toggle { display:inline-flex; margin-left:auto; padding:.4rem .6rem; border:1px solid var(--border); border-radius:10px; background:transparent; }
  .site-nav { position:absolute; left:0; right:0; top:56px; background:var(--bg); border-bottom:1px solid var(--border); flex-direction:column; padding: .5rem; display:none; }
  .site-nav.open { display:flex; }
}

/* Footer */
.site-footer { margin-top: var(--space-12); border-top: 1px solid var(--border); background: var(--bg); }
.site-footer .grid { display:grid; gap: var(--space-4); grid-template-columns: 1fr; padding: var(--space-8) 0; }
.site-footer small { color: var(--muted); }
@media (min-width: 720px) { .site-footer .grid { grid-template-columns: 2fr 1fr; } }

/* Helpers */
.btn { display:inline-flex; align-items:center; gap:.5rem; padding:.6rem 1rem; border-radius:10px; border:1px solid var(--border); background:var(--bg); }
.btn.primary { background: var(--brand); color: #fff; border-color: var(--brand); }
.skip { position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }
.skip:focus { position:static; width:auto; height:auto; padding:.5rem; background:var(--brand); color:#fff; }
