:root{box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);--bg:#faf8f4;--card:#fff;--tx:#1f2a2e;--mu:#5d6b70;--ac:#1f6f5c;--ac2:#e8f2ee;--bd:#e3ded4;--on:#fff}
html{scroll-padding-top:70px;scroll-behavior:smooth;height:100%}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#121719;--card:#1a2124;--tx:#e8eeee;--mu:#9bacb0;--ac:#58c4a8;--ac2:#1d2b28;--bd:#2a3437;--on:#0b1a16}}
:root[data-theme="dark"]{--bg:#121719;--card:#1a2124;--tx:#e8eeee;--mu:#9bacb0;--ac:#58c4a8;--ac2:#1d2b28;--bd:#2a3437;--on:#0b1a16}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--tx);font:17px/1.65 Georgia,"Times New Roman",serif}
h1,h2,h3,nav,.btn,.tag{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:9;background:var(--bg);border-bottom:1px solid var(--bd);display:flex;gap:4px 16px;padding:10px 20px;overflow-x:auto;white-space:nowrap;font-size:14px}
nav a{color:var(--mu);text-decoration:none;padding:4px 2px}nav a:hover{color:var(--ac)}nav b{color:var(--tx);margin-right:auto}
.page{max-width:960px;margin:0 auto;padding:56px 20px}section.x{max-width:960px;margin:0 auto;padding:64px 20px}
h2{font-size:30px;margin:0 0 8px}h2+p.sub{color:var(--mu);margin:0 0 28px}
.hero{display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:center;min-height:80vh}
.hero h1{font-size:clamp(34px,6vw,56px);line-height:1.1;margin:0 0 16px}
.hero p.lead{font-size:20px;color:var(--mu)}
.hero img{width:100%;border-radius:20px;aspect-ratio:4/5;object-fit:cover;box-shadow:0 14px 40px #0003}
.btn{display:inline-block;background:var(--ac);color:var(--on);padding:12px 22px;border-radius:999px;text-decoration:none;font-weight:600;margin:8px 8px 0 0;font-size:15px}
.btn.o{background:none;color:var(--ac);border:2px solid var(--ac)}
.tag{display:inline-block;background:var(--ac2);color:var(--ac);padding:3px 12px;border-radius:999px;font-size:13px;margin:0 6px 6px 0}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}
.card{background:var(--card);border:1px solid var(--bd);border-radius:16px;padding:22px}
.card h3{margin:0 0 6px;font-size:18px}.card p{margin:0;color:var(--mu);font-size:16px}
.about{display:grid;grid-template-columns:.7fr 1.3fr;gap:36px;align-items:start}.about img{width:100%;border-radius:16px}
.band{background:var(--ac2)}
.tl{border-left:3px solid var(--ac);padding-left:20px;margin-left:6px}.tl div{margin-bottom:22px}.tl small{color:var(--ac);font-family:system-ui,sans-serif;font-weight:600}
.book{border:2px dashed var(--ac);border-radius:16px;padding:22px;margin-top:24px;background:var(--card)}
.todo{color:var(--mu);font-style:italic}
footer{color:var(--mu);font-size:14px}
@media(max-width:720px){.hero,.about{grid-template-columns:1fr}.hero{min-height:0}}
.page[hidden]{display:none}nav a.on{color:var(--ac);font-weight:700}.sec{padding:0}.back{font-family:system-ui,sans-serif;font-size:14px;color:var(--mu);text-decoration:none}.cards a.card{text-decoration:none;color:inherit;display:block}.cards a.card:hover{border-color:var(--ac)}.cards .card h3{color:var(--ac)}ul{padding-left:20px;color:var(--mu)}.page a:not(.btn):not(.card):not(.back){color:var(--ac)}.hd{border-radius:16px;overflow:hidden;margin:0 0 28px}.hd svg{display:block;width:100%;height:150px}
footer{text-align:left;max-width:960px;margin:0 auto;padding:32px 20px 48px}.ft{display:flex;gap:24px;align-items:center;flex-wrap:wrap}.ft svg{height:88px;width:auto;flex:none}.ft p{margin:0;line-height:1.7}.ft a{color:var(--ac)}.fb{border-top:1px solid var(--bd)}nav svg{height:30px;width:32px;vertical-align:middle;margin-right:6px}