:root{--bg:#f7f4ee;--paper:#fffefb;--ink:#302b2b;--muted:#655f63;--green:#3d6b5c;--green-dark:#285344;--soft:#e8eee7;--line:#e2ded5;--accent:#3d6b5c;--accent-ink:#fff;color-scheme:light}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 system-ui,-apple-system,"Segoe UI",sans-serif}
button,input{font:inherit;color:inherit}
a{color:var(--green-dark);text-underline-offset:3px}
:focus-visible{outline:2px solid var(--green);outline-offset:3px}
.hub{width:min(1060px,calc(100% - 40px));margin:0 auto;padding:42px 0 75px}
.eyebrow{font-size:.82rem;letter-spacing:.09em;text-transform:uppercase;font-weight:700;color:var(--green-dark);margin:0 0 12px}
h1,h2,h3,p{margin-top:0}
h1{font:400 clamp(2.8rem,6vw,4.7rem)/1.06 Georgia,serif;letter-spacing:-.025em;max-width:15ch;margin-bottom:18px}
.lead{max-width:65ch;color:var(--muted);font-size:1.06rem;margin-bottom:32px}
.backup-tip{border:1px solid var(--line);border-left:4px solid var(--green);border-radius:14px;background:var(--soft);padding:18px 21px;max-width:76ch}
.backup-tip strong{font:500 1.3rem/1.2 Georgia,serif}
.backup-tip p{color:var(--muted);margin:8px 0}
.backup-tip a{font-weight:700}
.group-title{font:400 clamp(1.8rem,3.5vw,2.35rem)/1.15 Georgia,serif;margin:40px 0 17px}
.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.card{background:var(--paper);border:1px solid var(--line);border-radius:17px;padding:23px;min-width:0}
.card h2{font:500 1.45rem/1.2 Georgia,serif;margin:0 0 8px}
.card p{color:var(--muted);font-size:.94rem;margin:0 0 15px}
.card a{font-weight:700}
.meter{height:7px;background:var(--line);border-radius:999px;overflow:hidden;margin:0 0 11px}
.meter span{display:block;height:100%;background:var(--green);width:0}
.count{font-size:.88rem;color:var(--muted);margin:0 0 13px}
.actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:20px}
.action{border:1px solid var(--line);border-radius:17px;padding:24px;background:var(--soft)}
.action:target{outline:2px solid var(--green);outline-offset:4px}
.action h2{font:500 1.4rem Georgia,serif;margin:0 0 8px}
.action p{color:var(--muted);margin:0 0 16px}
.action a,.btn{display:inline-block;border:1px solid var(--green);background:var(--green);border-radius:999px;color:var(--accent-ink);font-weight:700;text-decoration:none;padding:11px 17px;cursor:pointer}
.btn.secondary{background:transparent;color:var(--green)}
.file-actions{display:flex;flex-wrap:wrap;gap:10px}
.notice{color:var(--muted);font-size:.89rem;margin-top:14px}
.message{min-height:1.5em;color:var(--green-dark);font-weight:600;font-size:.9rem;margin:12px 0 0}
@media(max-width:700px){.hub{width:calc(100% - 32px);padding-top:32px}.cards,.actions{grid-template-columns:1fr}.card,.action{padding:20px}}