:root { color-scheme: light; --ink:#1c2430; --muted:#6a7280; --paper:#f4f2ec; --card:#fffefb; --navy:#14181f; --gold:#c9a24b; --line:#dcd8cc; --laws:#8a3b3b; --art:#2f5d6e; --habit:#4a6b3f; --all:#5b4a8a; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; color:var(--ink); background:radial-gradient(circle at 50% -20%,#e9e4d4 0,transparent 42%),var(--paper); font:17px/1.75 Georgia,"Times New Roman",serif; }
.site-header { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px 24px; padding:14px max(20px,calc((100% - 1060px)/2)); background:var(--navy); }
.brand { color:#fff; text-decoration:none; font-weight:700; letter-spacing:.04em; } .brand span { color:var(--gold); }
.site-header nav { display:flex; flex-wrap:wrap; gap:4px 18px; }
.site-header nav a { color:#aeb6c2; text-decoration:none; font:14px Arial,sans-serif; padding:4px 0; border-bottom:2px solid transparent; }
.site-header nav a:hover, .site-header nav a.active { color:#fff; border-color:var(--gold); }
.page { max-width:760px; margin:0 auto; padding:32px 20px 56px; }
.hero { text-align:center; padding:36px 20px 28px; margin-bottom:8px; border-bottom:3px solid var(--gold); }
.hero.laws { border-color:var(--laws); } .hero.art { border-color:var(--art); } .hero.habit { border-color:var(--habit); } .hero.all { border-color:var(--all); }
.mark { display:block; font-size:34px; color:var(--gold); line-height:1; }
.eyebrow { margin:10px 0 6px; font:700 12px Arial,sans-serif; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); }
h1 { margin:6px 0 10px; font-size:clamp(26px,5vw,38px); line-height:1.2; }
time { display:block; color:var(--muted); font-style:italic; }
.book-pill { display:inline-block; margin-top:14px; padding:3px 14px; border-radius:99px; font:700 12px Arial,sans-serif; letter-spacing:.06em; color:#fff; background:var(--navy); }
.hero.laws .book-pill { background:var(--laws); } .hero.art .book-pill { background:var(--art); } .hero.habit .book-pill { background:var(--habit); } .hero.all .book-pill { background:var(--all); }
.bar { height:10px; border-radius:99px; background:#e4e0d4; overflow:hidden; } .bar > div { height:100%; background:var(--gold); border-radius:99px; } .bar.slim { height:4px; margin-bottom:8px; }
.book-laws .bar > div { background:var(--laws); } .book-art .bar > div { background:var(--art); } .book-habit .bar > div { background:var(--habit); }
.study { background:var(--card); border:1px solid var(--line); border-radius:14px; padding:12px 32px 18px; margin:20px 0; box-shadow:0 1px 3px rgba(20,24,31,.05); }
.study p { margin:1.1em 0; } .study .lead { font-size:1.06em; font-style:italic; color:#394352; border-left:3px solid var(--gold); padding-left:16px; }
.label { font-weight:700; color:var(--navy); }
.notice { background:#fbf3dc; border:1px solid #e8d7a3; border-radius:10px; padding:10px 16px; font:15px Arial,sans-serif; }
.navigation { display:flex; justify-content:space-between; align-items:center; margin:24px 0; font:15px Arial,sans-serif; }
.navigation a { color:var(--navy); text-decoration:none; padding:8px 16px; border:1px solid var(--line); border-radius:8px; background:var(--card); } .navigation a.today { background:var(--navy); color:#fff; border-color:var(--navy); }
.section-head { margin-bottom:22px; } .section-head h1, .section-head h2 { margin:4px 0; } .section-head p { margin:4px 0; color:var(--muted); }
.section-switch { display:inline-block; margin-top:6px; font:14px Arial,sans-serif; color:var(--navy); }
.library-section { margin:28px 0; } .library-heading { display:flex; align-items:baseline; gap:14px; border-bottom:1px solid var(--line); } .library-heading h2 { margin:0 0 4px; } .library-heading p { margin:0; color:var(--muted); font:14px Arial,sans-serif; }
.library-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:12px; margin-top:14px; }
.lesson-card { display:flex; flex-direction:column; gap:2px; padding:12px 14px; text-decoration:none; color:var(--ink); background:var(--card); border:1px solid var(--line); border-left:4px solid var(--gold); border-radius:8px; font:14px/1.4 Arial,sans-serif; }
.lesson-card.laws { border-left-color:var(--laws); } .lesson-card.art { border-left-color:var(--art); } .lesson-card.habit { border-left-color:var(--habit); } .lesson-card.all { border-left-color:var(--all); }
.lesson-card span, .lesson-card em { color:var(--muted); font-size:12px; font-style:normal; } .lesson-card strong { font:700 15px/1.35 Georgia,serif; }
.settings-card, .month-summary { background:var(--card); border:1px solid var(--line); border-radius:14px; padding:20px 26px; margin:18px 0; }
.settings-card h2, .month-summary h2 { margin-top:0; }
label { display:block; margin:14px 0 4px; font:700 14px Arial,sans-serif; } input, textarea, select { width:100%; padding:10px 12px; border:1px solid #c9c5b8; border-radius:8px; font:16px Arial,sans-serif; background:#fff; }
button { margin-top:16px; padding:10px 22px; border:0; border-radius:8px; background:var(--navy); color:#fff; font:700 15px Arial,sans-serif; cursor:pointer; } button:hover { background:#232a36; }
.success { color:#2f6b3a; font:700 14px Arial,sans-serif; } .error { color:#a33a3a; font:700 14px Arial,sans-serif; }
.system-log { max-height:340px; overflow:auto; padding:12px; background:#f0eee6; border-radius:8px; font:12px/1.5 Consolas,monospace; white-space:pre-wrap; }
.summary-lead { font-size:1.05em; } .summary-block { margin:16px 0; padding:12px 18px; background:#f7f5ee; border-radius:10px; } .summary-block h3 { margin:0 0 6px; font-size:16px; } .summary-block ul { margin:0; padding-left:20px; }
.login-page { display:grid; place-items:center; padding:20px; background:var(--navy); }
.login-card { width:100%; max-width:380px; padding:36px 30px; text-align:center; background:var(--card); border-radius:16px; } .login-card input { text-align:center; } .login-card button { width:100%; }
footer { padding:26px 20px 40px; text-align:center; color:var(--muted); font:13px Arial,sans-serif; }
@media (max-width:560px) { .study { padding:6px 20px 12px; } .site-header nav a { font-size:13px; } }
.generated-audio { margin:16px 0; padding:12px 16px; background:var(--card); border:1px solid var(--line); border-radius:12px; } .generated-audio p { margin:0 0 6px; font:700 12px Arial,sans-serif; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); } .generated-audio audio { width:100%; }
.geo-blocks { margin:10px 0; } .geo-block-row { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:6px 0; font:14px Arial,sans-serif; } .geo-block-row button { margin:0; padding:4px 12px; }
.checkbox { display:flex; align-items:center; gap:10px; font-weight:400; } .checkbox input { width:auto; } .geo-subhead { margin-top:26px; font-size:18px; } .geo-checks { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); } .geo-note, small { color:var(--muted); font:13px Arial,sans-serif; } .geo-save { margin-top:22px; } code { background:#f0eee6; padding:1px 6px; border-radius:4px; font-size:.9em; }