:root{ --ink:#10201F; --muted:#41514F; --paper:#F6EEDC; --felt:#E8F2EA; --teal:#0FBBC5; --amber:#EFB53B; --magenta:#F15BB5; --link:#356FDB; }
html{font-size:18.5px}body{margin:0;color:var(--ink);background:var(--paper) url('/assets/kraft.png') center/cover fixed;font-family:'Lexend Deca', system-ui, Arial, sans-serif; line-height:1.8}
a{color:var(--link);text-underline-offset:3px}.container{max-width:1140px;margin:0 auto;padding:24px}
header{position:sticky;top:0;background:rgba(246,238,220,.95);backdrop-filter:saturate(120%) blur(4px);border-bottom:3px solid #d9c8aa; z-index:20}
.nav{display:flex;align-items:center;gap:12px}.logo{width:56px;height:56px;border-radius:50%;border:3px solid #1b1b1b;box-shadow:0 3px 0 #1b1b1b}
.brand{display:flex;align-items:center;gap:12px}.spacer{flex:1}
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 16px;border-radius:14px;font-weight:800;border:3px solid #1b1b1b;background:var(--amber);color:#1b1b1b;box-shadow:0 3px 0 #1b1b1b;transition:transform .05s ease}
.btn.secondary{background:var(--teal);color:#04383D;border-color:#04383D;box-shadow:0 3px 0 #04383D}.btn.ghost{background:#fff;border-color:#bbb;color:#333;box-shadow:none}
.btn:active{transform:translateY(2px)}.btn:focus-visible{outline:3px solid var(--magenta);outline-offset:2px}
.hero{display:grid;grid-template-columns:1.05fr .95fr;gap:28px;align-items:center;padding:32px 0}
.kraft{background:#fff;border:3px solid #d9c8aa;border-radius:16px;padding:18px;box-shadow:0 3px 0 #bfae90}
.card{background:var(--felt) url('/assets/felt.png') center/cover;border:3px solid #b7d0c6;border-radius:16px;padding:16px;box-shadow:0 3px 0 #93b5a5}
.grid{display:grid;gap:14px}.grid.cols-3{grid-template-columns:repeat(3,1fr)}.grid.cols-2{grid-template-columns:repeat(2,1fr)}
footer{border-top:3px solid #d9c8aa;color:#445;background:rgba(246,238,220,.9)}.small{color:var(--muted);font-size:1rem}
@media(max-width:900px){.hero{grid-template-columns:1fr}.grid.cols-3{grid-template-columns:repeat(2,1fr)}.grid.cols-2{grid-template-columns:1fr}}
.icon4d{width:22px;height:22px;transition:transform .2s ease}.btn:hover .icon4d{transform:translateY(-1px) scale(1.03)}
.badge{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:#fff;border:2px solid #d9c8aa;box-shadow:0 2px 0 #c9b89a}
.switches{display:flex;gap:8px;align-items:center}.breadcrumbs{font-size:.95rem;margin:10px 0;color:#5a5a5a}.breadcrumbs a{color:#5a5a5a}
.mode-focus{--paper:#F7F2E8;--felt:#E9F5F0}.mode-flow{--paper:#E9F5F0;--felt:#F7F2E8}
.font-od{font-family:'OpenDyslexic','Atkinson Hyperlegible','Lexend Deca',system-ui,Arial,sans-serif}
.subline{font-family:'Lexend Deca',sans-serif;margin:.2em 0 1em;font-size:1.05rem;letter-spacing:.02em;color:#36524a}
.titleChip{display:inline-block;background:var(--amber);padding:.25em .6em;border-radius:18px;border:3px solid #1b1b1b;box-shadow:0 4px 0 #1b1b1b}