/* Shared tokens and components for the personal life tools. */
:root, :root.light {
  color-scheme: light;
  --bg:#f6f7f5; --surface:#fff; --card:#fff; --subtle:#eef1ec;
  --text:#202720; --muted:#687166; --line:#dce2d8; --accent:#536c4f;
  --accent-ink:#fff; --accent-soft:#edf2e9; --soft:#edf2e9;
  --shadow:0 4px 18px #20272006; --good:#2f8f5b; --warn:#b4690e; --danger:#b3322f;
}
:root.dark {
  color-scheme:dark;
  --bg:#09090b; --surface:#18181b; --card:#18181b; --subtle:#222225;
  --text:#f4f4f5; --muted:#a1a1aa; --line:#303034; --accent:#e4e4e7;
  --accent-ink:#18181b; --accent-soft:#27272a; --soft:#27272a;
  --shadow:0 4px 18px #0002; --good:#6bd39a; --warn:#f0b357; --danger:#ff8f8a;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:14px/1.6 -apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Microsoft YaHei',sans-serif;-webkit-font-smoothing:antialiased}
[hidden]{display:none!important}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
button,.btn{border:1px solid var(--line);border-radius:9px;background:var(--surface);padding:8px 12px;cursor:pointer}
button:hover,.btn:hover{border-color:var(--muted)}
:root .primary,:root.dark .primary,:root .btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
input:not([type=checkbox]):not([type=file]),select,textarea{min-width:0;border:1px solid var(--line);border-radius:8px;background:var(--bg);padding:9px 11px}
.site-nav{max-width:1200px;margin:auto;padding:16px 24px;display:flex;align-items:center;gap:28px;border-bottom:1px solid var(--line)}
.site-brand{text-decoration:none;font-size:15px;font-weight:700;white-space:nowrap;letter-spacing:-.3px}
.site-brand span{color:var(--muted);font-size:11px;font-weight:400;margin-left:8px}
.site-links{display:flex;gap:4px;flex:1;flex-wrap:wrap}
.site-links a{padding:6px 11px;border-radius:7px;text-decoration:none;font-size:13px;color:var(--muted);white-space:nowrap}
.site-links a:hover,.site-links a[aria-current=page]{background:var(--subtle);color:var(--text)}
.site-nav button{font-size:12px;white-space:nowrap}
.home,.app,.download-page{max-width:1200px;margin:auto;padding:28px 24px 72px}
.app-head{align-items:center;margin-bottom:20px;gap:16px}
.app-head h1,.masthead h1,.download-page h1{font-size:28px;letter-spacing:-.8px;line-height:1.3}
.head-actions{gap:6px;flex-wrap:wrap}
.head-actions button{font-size:12px;padding:7px 10px;min-height:34px}
.app-head .home-link{display:none}
.eyebrow{color:var(--muted);letter-spacing:.14em;font-size:10px;margin:0 0 8px}
.hint,.sub{color:var(--muted)}
dialog{max-height:calc(100dvh - 32px);overflow:auto;border-radius:14px;border:1px solid var(--line);background:var(--surface);color:var(--text);box-shadow:0 20px 80px #0004}
dialog::backdrop{background:#0009;backdrop-filter:blur(3px)}
code{background:var(--subtle)}
@media(max-width:700px){
 .site-nav{padding:12px 16px;gap:10px;flex-wrap:wrap}
 .site-brand{flex:1}.site-links{order:3;flex-basis:100%;justify-content:space-between}
 .site-links a{font-size:12px;padding:6px 10px}.site-nav button{min-height:34px}
 .home,.app,.download-page{padding:22px 16px 88px}
 .app-head h1,.masthead h1,.download-page h1{font-size:24px}
 .head-actions{width:100%;gap:6px}.head-actions button{min-height:40px}
 input,select,textarea{font-size:16px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
