:root {
  --cream: #fff8ea; --paper: #fffdf7; --ink: #34283a; --muted: #726879;
  --coral: #ef6f65; --coral-dark: #c74f4b; --teal: #2f9d94; --teal-dark: #20776f;
  --yellow: #f8c85c; --lavender: #8d72c7; --green: #6ca96f; --blue: #5b91c9;
  --shadow: 0 14px 40px rgba(76, 49, 44, .14); --radius: 24px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--cream); font-family: ui-rounded, "Avenir Next Rounded", "Nunito", system-ui, sans-serif; min-height: 100vh; }
button, input { font: inherit; }
button { color: inherit; }
button:focus-visible, input:focus-visible, label:focus-within { outline: 4px solid rgba(47,157,148,.35); outline-offset: 3px; }
.skip-link { position: fixed; left: 12px; top: -60px; padding: 12px 18px; border-radius: 12px; background: white; z-index: 100; }
.skip-link:focus { top: 12px; }
.topbar { position: sticky; top: 0; z-index: 20; min-height: 74px; display: flex; align-items: center; gap: 12px; padding: 10px max(18px, calc((100vw - 1240px)/2)); background: rgba(255,248,234,.92); backdrop-filter: blur(14px); border-bottom: 1px solid rgba(52,40,58,.08); }
.brand { display: flex; align-items: center; gap: 10px; border: 0; background: none; cursor: pointer; text-align: left; margin-right: auto; }
.brand-paw { width: 44px; height: 44px; display: grid; place-items: center; background: var(--coral); border-radius: 15px; transform: rotate(-5deg); font-size: 23px; box-shadow: 0 5px 0 var(--coral-dark); }
.brand strong, .brand small { display: block; line-height: 1.05; }
.brand strong { font-size: 18px; } .brand small { color: var(--coral-dark); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; font-size: 11px; }
.stats { display: flex; gap: 8px; }
.stat-chip { display: flex; align-items: center; gap: 5px; background: white; padding: 9px 12px; border-radius: 999px; box-shadow: 0 4px 14px rgba(70,43,41,.08); }
.round-button { width: 44px; height: 44px; border: 0; background: white; border-radius: 50%; cursor: pointer; box-shadow: 0 4px 14px rgba(70,43,41,.1); }
.screen { display: none; min-height: calc(100vh - 74px); }
.screen.active { display: block; animation: screen-in .25s ease-out; }
@keyframes screen-in { from { opacity: 0; transform: translateY(5px); } }
.village-hero { min-height: 620px; position: relative; display: grid; align-items: center; background-image: linear-gradient(90deg, rgba(255,248,234,.18), rgba(255,248,234,0)), url('/static/assets/cat-village.jpg'); background-size: cover; background-position: center; overflow: hidden; }
.village-hero::after { content: ""; position: absolute; inset: auto 0 0; height: 120px; background: linear-gradient(transparent, var(--cream)); pointer-events: none; }
.glass-card { width: min(540px, calc(100% - 36px)); margin-left: max(18px, calc((100vw - 1180px)/2)); padding: clamp(26px, 4vw, 46px); background: rgba(255,253,247,.91); border: 2px solid rgba(255,255,255,.75); border-radius: 34px; box-shadow: var(--shadow); backdrop-filter: blur(12px); z-index: 2; }
.eyebrow { margin: 0 0 8px; color: var(--teal-dark); font-size: 13px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
h1, h2, p { text-wrap: pretty; }
h1 { font-size: clamp(34px, 5vw, 58px); line-height: 1.03; margin: 0 0 16px; letter-spacing: -.035em; }
h2 { line-height: 1.1; }
.hero-copy > p:not(.eyebrow,.mission-note) { color: var(--muted); font-size: 18px; line-height: 1.55; }
.mission-note { margin: 12px 0 0; color: var(--muted); font-size: 13px; font-weight: 700; text-align: center; }
.primary-button, .secondary-button, .danger-button, .text-button, .back-button, .hint-button { min-height: 46px; border: 0; border-radius: 14px; padding: 11px 18px; font-weight: 850; cursor: pointer; transition: transform .15s, box-shadow .15s, background .15s; }
.primary-button { color: white; background: var(--coral); box-shadow: 0 6px 0 var(--coral-dark); }
.primary-button:hover { transform: translateY(-2px); box-shadow: 0 8px 0 var(--coral-dark); }
.primary-button:active { transform: translateY(4px); box-shadow: 0 2px 0 var(--coral-dark); }
.primary-button.big { width: 100%; font-size: 18px; padding: 15px 22px; }
.secondary-button, .back-button, .hint-button { background: white; border: 2px solid rgba(52,40,58,.12); }
.danger-button { background: #fff0ee; color: #a53c38; border: 2px solid #efaaa5; }
.text-button { background: none; color: var(--teal-dark); }
.guide-bubble { position: absolute; right: max(18px, calc((100vw - 1180px)/2)); bottom: 82px; z-index: 3; display: flex; align-items: center; gap: 12px; width: min(360px, calc(100% - 36px)); padding: 14px 18px; background: white; border-radius: 22px 22px 5px 22px; box-shadow: var(--shadow); }
.guide-bubble p { margin: 0; line-height: 1.4; font-weight: 700; }
.guide-cat { font-size: 38px; }
.content-wrap, .page-wrap { width: min(1180px, calc(100% - 36px)); margin: 0 auto; padding: 44px 0 70px; }
.page-wrap.narrow { width: min(900px, calc(100% - 36px)); }
.section-heading, .page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 24px; }
.section-heading h2, .page-heading h1 { margin: 0; font-size: clamp(28px,4vw,42px); }
.location-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.location-card { position: relative; min-height: 260px; display: flex; flex-direction: column; align-items: flex-start; padding: 22px; border: 0; border-radius: var(--radius); overflow: hidden; text-align: left; cursor: pointer; background: var(--paper); box-shadow: var(--shadow); transition: transform .2s, box-shadow .2s; }
.location-card:hover { transform: translateY(-5px) rotate(-.3deg); box-shadow: 0 20px 45px rgba(76,49,44,.18); }
.location-card::after { content: ""; position: absolute; width: 160px; height: 160px; right: -55px; top: -60px; border-radius: 50%; background: var(--card-color); opacity: .18; }
.location-icon { width: 70px; height: 70px; display: grid; place-items: center; margin-bottom: auto; border-radius: 22px; background: var(--card-color); font-size: 38px; transform: rotate(-3deg); }
.location-card h3 { margin: 20px 0 5px; font-size: 22px; }
.location-card p { margin: 0 0 14px; color: var(--muted); line-height: 1.35; }
.mastery-mini { width: 100%; height: 8px; background: #eee8dd; border-radius: 99px; overflow: hidden; }
.mastery-mini span { display: block; height: 100%; border-radius: inherit; background: var(--card-color); }
.mastery-caption { margin-top: 7px; font-size: 12px; color: var(--muted); font-weight: 750; }
.locked { filter: grayscale(.75); opacity: .68; cursor: not-allowed; }
.locked::before { content: "🔒"; position: absolute; right: 16px; bottom: 16px; font-size: 22px; }

.game-screen { background: radial-gradient(circle at 50% 15%, #fff 0, #fff8ea 35%, #f9e8ca 100%); }
.game-shell { width: min(920px, calc(100% - 28px)); margin: 0 auto; padding: 22px 0 50px; }
.game-head { display: flex; align-items: center; gap: 18px; margin-bottom: 18px; }
.mission-progress-wrap { flex: 1; }.mission-label { display: flex; justify-content: space-between; margin-bottom: 8px; }.mission-label span { color: var(--muted); font-size: 14px; font-weight: 750; }
.progress-track { height: 12px; background: #eadfca; border-radius: 99px; overflow: hidden; }.progress-track span { display: block; width: 0; height: 100%; background: linear-gradient(90deg,var(--teal),#7bc7ae); border-radius: inherit; transition: width .35s; }
.score-pill { padding: 10px 14px; background: white; border-radius: 14px; box-shadow: 0 4px 14px rgba(70,43,41,.08); }
.play-card { position: relative; min-height: 600px; padding: clamp(26px,5vw,52px); display: flex; flex-direction: column; align-items: center; background: var(--paper); border-radius: 34px; box-shadow: var(--shadow); text-align: center; }
.activity-icon { position: absolute; left: 28px; top: 25px; font-size: 34px; }.activity-instruction { margin: 0 50px 20px; color: var(--teal-dark); font-weight: 850; }
.visual-stage { min-height: 175px; width: 100%; display: flex; align-items: center; justify-content: center; gap: 18px; margin-bottom: 5px; }
.question { margin: 8px 0 24px; font-size: clamp(35px,7vw,62px); letter-spacing: .01em; }
.answers { width: min(600px,100%); display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }
.answer-button { min-height: 76px; border: 3px solid #e9dfce; border-radius: 18px; background: white; font-size: 28px; font-weight: 900; cursor: pointer; box-shadow: 0 5px 0 #dfd2bd; transition: transform .12s; }
.answer-button:hover { transform: translateY(-3px); }.answer-button.long-answer { padding:10px; font-size:19px; }.answer-button.correct { color: #246d3b; background: #ddf6df; border-color: #78bd83; box-shadow: 0 5px 0 #78bd83; }.answer-button.wrong { animation: shake .3s; color: #9d3d39; background: #fff0ee; border-color: #e99c96; }
@keyframes shake { 25% { transform: translateX(-6px); } 75% { transform: translateX(6px); } }
.feedback { min-height: 38px; margin-top: 18px; font-size: 18px; font-weight: 850; }.feedback.good { color: #28723f; }.feedback.try { color: #a34b45; }
.hint-button { margin-top: 8px; color: var(--teal-dark); }
.frame-stack { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:14px; }.ten-frame { display: grid; grid-template-columns: repeat(5,42px); gap: 6px; padding: 8px; background: #fff; border: 4px solid var(--ink); border-radius: 12px; }
.ten-cell { position:relative; width: 42px; height: 42px; display: grid; place-items: center; border: 2px solid #cdbfa9; border-radius: 7px; }.counter { width: 30px; height: 30px; border-radius: 50%; background: var(--coral); box-shadow: inset 0 -4px rgba(0,0,0,.1); }.counter.alt { background: var(--teal); }.counter.removed { opacity:.24; }.remove-mark { position:absolute; color:#a4433e; font-size:34px; line-height:1; }
.number-bond { width:220px; display:flex; flex-direction:column; align-items:center; color:var(--lavender); }.bond-circle { width:78px; height:78px; display:grid; place-items:center; align-content:center; border:4px solid currentColor; background:white; border-radius:50%; box-shadow:0 4px 0 #ddd1f4; }.bond-circle small { margin-bottom:-2px; color:var(--muted); font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }.bond-circle strong { color:var(--ink); font-size:28px; line-height:1; }.bond-whole { width:86px; height:86px; }.bond-connector { position:relative; width:170px; height:48px; }.bond-connector::before { content:""; position:absolute; left:50%; top:0; width:4px; height:17px; transform:translateX(-50%); background:currentColor; border-radius:3px; }.bond-connector span { position:absolute; top:28px; width:86px; height:4px; background:currentColor; border-radius:3px; }.bond-connector span:first-child { left:7px; transform:rotate(-22deg); }.bond-connector span:last-child { right:7px; transform:rotate(22deg); }.bond-parts { width:100%; display:flex; justify-content:space-between; }
.place-model { display:flex; align-items:center; justify-content:center; gap:28px; max-width:100%; }.place-chart { display:grid; grid-template-columns:1fr 1fr; border:4px solid var(--teal-dark); border-radius:14px; overflow:hidden; background:white; box-shadow:0 5px 0 #a8d4cd; }.place-column { min-width:76px; padding:9px 12px; display:grid; place-items:center; border-right:2px solid #b8dcd7; }.place-column:last-child { border-right:0; }.place-column.focus { background:#d8f3ed; box-shadow:inset 0 0 0 4px var(--yellow); }.place-column small { color:var(--teal-dark); font-size:10px; font-weight:950; letter-spacing:.12em; }.place-column strong { font-size:38px; }.blocks { display: flex; align-items: flex-end; justify-content:center; gap: 20px; max-width:100%; }.tens-group { max-width:330px; display: flex; flex-wrap:wrap; gap: 6px; }.ten-rod { width: 24px; height: 130px; border-radius: 6px; background: repeating-linear-gradient(to bottom,#5bb4aa 0,#5bb4aa 11px,#277b73 12px,#277b73 13px); }.ones-group { max-width: 180px; display: flex; flex-wrap: wrap-reverse; gap: 6px; }.one-cube { width: 30px; height: 30px; background: var(--yellow); border: 2px solid #d39e32; border-radius: 5px; }
.clock { position: relative; width: 170px; height: 170px; border: 9px solid var(--lavender); border-radius: 50%; background: #fffef8; box-shadow: inset 0 0 0 4px #e7dcfb; }.clock-number { position: absolute; font-weight: 900; font-size: 15px; transform: translate(-50%,-50%); }.hand { position: absolute; left: 50%; bottom: 50%; width: 5px; border-radius: 5px; background: var(--ink); transform-origin: 50% 100%; }.hour-hand { height: 48px; }.minute-hand { height: 65px; width: 4px; background: var(--coral); }.clock::after { content:""; position:absolute; left:50%; top:50%; width:13px; height:13px; background:var(--ink); border-radius:50%; transform:translate(-50%,-50%); }
.balance-model { width:min(510px,100%); }.balance-beam { min-height:145px; display:grid; grid-template-columns:1fr 60px 1fr; align-items:end; border-bottom:7px solid #b9823f; }.balance-pan { min-height:88px; display:grid; place-items:center; padding:12px; border:5px solid var(--yellow); border-radius:12px 12px 48px 48px; background:#fff8d8; box-shadow:0 5px 0 #d8a83d; font-size:26px; font-weight:900; }.balance-post { align-self:end; color:#9d6a3e; font-size:58px; line-height:.7; }.equal-caption { margin-top:12px; color:var(--muted); font-size:13px; font-weight:800; }.addition-model { display:flex; align-items:center; justify-content:center; gap:14px; }.addition-model > b { font-size:34px; color:var(--green); }.add-number { width:125px; min-height:125px; display:grid; place-items:center; align-content:center; padding:10px; border:4px solid var(--green); border-radius:20px; background:#edf8e8; box-shadow:0 5px 0 #b8d8ac; }.add-number strong { font-size:36px; }.add-number span { color:var(--muted); font-size:13px; font-weight:800; }.shape-model { display:grid; grid-template-columns:100px 1fr; align-items:center; gap:18px; width:min(500px,100%); padding:18px; border-radius:22px; background:#fff0f7; }.shape-result { font-size:72px; }.shape-pieces { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:14px; }.shape-piece { display:grid; place-items:center; width:48px; height:48px; color:#b95c8e; font-size:45px; line-height:1; transition:transform .2s,filter .2s; }.shape-piece.shape-circle { color:#e97870; }.shape-piece.shape-triangle { color:#8d72c7; }.shape-piece.shape-square { color:#2f9d94; }.shape-piece.shape-rectangle { width:65px; color:#e0a43d; }.shape-piece.target { transform:scale(1.15); filter:drop-shadow(0 0 6px #ffc929); }.shape-model > small { grid-column:1/-1; color:var(--muted); font-weight:800; }.coin-purse { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:15px; padding:20px 28px; border:5px dashed #c2933e; border-radius:70px 70px 25px 25px; background:#fff5d9; }.coin { width:74px; height:74px; display:grid; place-items:center; align-content:center; border:5px double #a9a6a1; border-radius:50%; background:linear-gradient(135deg,#f2f2ef,#aca9a2); box-shadow:0 5px 0 #89857d; }.coin.copper { border-color:#a96742; background:linear-gradient(135deg,#e7a57b,#a85e39); box-shadow:0 5px 0 #82472e; }.coin.small { width:62px;height:62px }.coin.large { width:82px;height:82px }.coin strong { font-size:24px; }.coin small { font-size:11px;font-weight:900 }.picture-graph { width:min(520px,100%); display:grid; gap:8px; padding:14px; border-left:5px solid var(--ink); border-bottom:5px solid var(--ink); background:#fffdf8; }.graph-row { min-height:38px; display:grid; grid-template-columns:65px 1fr 25px; align-items:center; gap:8px; padding:5px 8px; border-radius:8px; }.graph-row.highlight { background:#fff0b7; }.graph-row > strong { text-align:right; }.paw-votes { letter-spacing:.12em; text-align:left; white-space:nowrap; }.graph-key { color:var(--muted); font-size:12px; font-weight:800; text-align:right; }

.results-wrap { min-height: calc(100vh - 74px); display: grid; place-items: center; padding: 30px 18px; background: radial-gradient(circle,#fff8c9,#f9dfc5); }.celebration-card { width: min(660px,100%); padding: 42px; background: white; border-radius: 36px; box-shadow: var(--shadow); text-align: center; }.confetti { color: var(--coral); letter-spacing: .25em; }.result-cat { font-size: 86px; animation: bounce 1s infinite alternate; }.celebration-card h1 { font-size: clamp(34px,6vw,52px); }.reward-row { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin: 28px 0; }.reward-row div { padding: 16px 8px; background: var(--cream); border-radius: 18px; }.reward-row span,.reward-row strong,.reward-row small { display:block; }.reward-row span { font-size:26px; }.reward-row strong { font-size:28px; }.reward-row small { color:var(--muted); }.unlock-banner { padding: 14px; margin: -10px 0 20px; color: #65511f; background: #fff1ae; border-radius: 14px; font-weight: 850; }.result-actions { display:flex; gap:12px; justify-content:center; }
@keyframes bounce { to { transform: translateY(-8px) rotate(3deg); } }

.page-heading { align-items:center; }.page-heading h1 { font-size: clamp(30px,5vw,48px); }.cafe-layout { display:grid; grid-template-columns: 2fr 1fr; gap:22px; }.cafe-room { min-height:560px; position:relative; overflow:hidden; border:12px solid #d99b65; border-top-width:26px; border-radius:26px; background: linear-gradient(#ffeccf 0 65%,#c98e61 65%); box-shadow:var(--shadow); }.cafe-room::before { content:""; position:absolute; left:0; right:0; top:65%; height:8px; background:#a46c49; }.window { position:absolute; left:50%; top:45px; transform:translateX(-50%); width:150px; height:130px; display:grid; place-items:center; border:10px solid #9b633f; border-radius:70px 70px 8px 8px; background:#bce3e7; font-size:50px; }.shelf { position:absolute; right:30px; top:100px; padding:14px 18px; border-bottom:10px solid #8c5739; font-size:32px; }.rug { position:absolute; left:50%; bottom:28px; transform:translateX(-50%); width:55%; height:120px; display:grid; place-items:center; border-radius:50%; background:#8bc3b1; font-size:50px; }.cafe-kittens { position:absolute; left:50%; bottom:90px; transform:translateX(-50%); display:flex; gap:3px; font-size:58px; z-index:2; }.cafe-item { position:absolute; display:none; font-size:58px; z-index:3; }.cafe-item.owned { display:block; }.item-bed { left:32px; bottom:35px; }.item-plant { right:35px; bottom:38px; }.item-tree { left:42px; top:92px; }.shop-card,.parent-card { padding:24px; background:var(--paper); border-radius:var(--radius); box-shadow:var(--shadow); }.shop-card h2,.parent-card h2 { margin-top:0; }.shop-list { display:grid; gap:10px; }.shop-item { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:10px; padding:12px; background:var(--cream); border-radius:14px; }.shop-item .emoji { font-size:30px; }.shop-item strong,.shop-item small { display:block; }.shop-item small { color:var(--muted); }.buy-button { border:0; border-radius:11px; padding:9px; background:var(--yellow); font-weight:900; cursor:pointer; }.buy-button:disabled { opacity:.55; cursor:default; }.parent-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin:18px 0; }.mastery-list { display:grid; gap:16px; }.mastery-row { display:grid; grid-template-columns:180px 1fr 54px; align-items:center; gap:12px; }.mastery-track { height:13px; background:#eee6d8; border-radius:20px; overflow:hidden; }.mastery-track span { display:block; height:100%; background:linear-gradient(90deg,var(--coral),var(--yellow)); border-radius:inherit; }.muted { color:var(--muted); line-height:1.5; }.totals { display:grid; grid-template-columns:1fr 1fr; gap:10px; }.total { padding:14px; background:var(--cream); border-radius:14px; }.total strong,.total small { display:block; }.total strong { font-size:27px; }.toggle-row { min-height:52px; display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid #eee2d1; font-weight:800; }.toggle-row input { width:24px; height:24px; accent-color:var(--teal); }.tool-row { display:flex; flex-wrap:wrap; gap:10px; }.file-button { display:inline-grid; place-items:center; }.file-button input { position:absolute; width:1px; height:1px; opacity:0; }.toast { position:fixed; left:50%; bottom:24px; transform:translate(-50%,120px); z-index:100; padding:13px 20px; color:white; background:var(--ink); border-radius:14px; box-shadow:var(--shadow); transition:transform .25s; font-weight:800; }.toast.show { transform:translate(-50%,0); } dialog { border:0; border-radius:24px; padding:0; box-shadow:var(--shadow); } dialog::backdrop { background:rgba(39,28,43,.55); } dialog form { max-width:440px; padding:28px; }.dialog-actions { display:flex; justify-content:flex-end; gap:10px; }

@media (max-width: 900px) { .location-grid { grid-template-columns:repeat(2,1fr); }.cafe-layout { grid-template-columns:1fr; }.guide-bubble { bottom:28px; }.village-hero { min-height:680px; align-items:start; padding-top:45px; }.glass-card { margin:auto; }.parent-grid { grid-template-columns:1fr; } }
@media (max-width: 620px) { .topbar { min-height:66px; padding:9px 12px; }.brand strong { font-size:15px; }.brand-paw { width:38px;height:38px }.brand small { display:none; }.stats { gap:4px; }.stat-chip { padding:8px; }.stat-chip:nth-child(3) { display:none; }.round-button { width:40px;height:40px }.village-hero { min-height:690px; background-position:62% center; }.glass-card { padding:26px 22px; }.guide-bubble { left:18px; right:auto; }.location-grid { grid-template-columns:1fr; }.location-card { min-height:210px; }.game-shell { width:min(100% - 18px,920px); padding-top:10px; }.game-head { gap:8px; }.game-head .back-button { padding:8px; min-height:42px; }.score-pill { padding:8px; }.play-card { min-height:580px; border-radius:25px; padding:25px 14px; }.activity-icon { left:18px; top:18px; }.answers { grid-template-columns:repeat(2,1fr); }.answer-button { min-height:68px; }.answer-button.long-answer { font-size:15px; }.visual-stage { min-height:185px; transform:scale(.9); }.frame-stack { gap:7px; }.ten-frame { grid-template-columns:repeat(5,30px); gap:4px; padding:6px; }.ten-cell { width:30px;height:30px }.counter { width:22px;height:22px }.place-model { flex-direction:column; gap:12px; }.place-chart { order:0; }.place-model .blocks { order:1; }.place-column { min-width:64px;padding:5px 10px }.place-column strong { font-size:30px }.place-model .ten-rod { height:95px;width:20px;background:repeating-linear-gradient(to bottom,#5bb4aa 0,#5bb4aa 8px,#277b73 9px,#277b73 10px) }.addition-model { gap:7px; }.add-number { width:94px; min-height:112px; }.add-number strong { font-size:30px; }.balance-beam { grid-template-columns:1fr 42px 1fr; }.balance-pan { font-size:20px; }.shape-model { grid-template-columns:72px 1fr; padding:12px; gap:8px; }.shape-result { font-size:58px; }.shape-piece { width:38px;height:38px;font-size:36px }.shape-piece.shape-rectangle { width:52px; }.coin-purse { padding:15px; gap:9px; }.coin { width:62px;height:62px }.coin.small { width:54px;height:54px }.coin.large { width:69px;height:69px }.paw-votes { font-size:14px;letter-spacing:0 }.reward-row { gap:6px; }.celebration-card { padding:30px 16px; }.result-actions { flex-direction:column; }.mastery-row { grid-template-columns:1fr 48px; }.mastery-row .mastery-track { grid-column:1 / -1; grid-row:2; }.cafe-room { min-height:440px; }.shelf { display:none; }.tool-row { flex-direction:column; }.tool-row > * { width:100%; }.page-heading { align-items:flex-start; }.page-heading h1 { font-size:28px; } }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { scroll-behavior:auto!important; animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; } }
body.reduce-motion *, body.reduce-motion *::before, body.reduce-motion *::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; scroll-behavior:auto!important; }