@font-face{font-family:Thai;src:url('/fonts/NotoSerifThai.ttf');font-display:swap}:root{--red:#b8322d;--ink:#252a24;--muted:#60685f;--paper:#f8f5ed;--line:#dedfd3}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.8 system-ui,sans-serif}header,main,footer{max-width:1200px;margin:auto;padding:22px}header{display:flex;align-items:center;justify-content:space-between;gap:15px;border-bottom:1px solid var(--line)}a{color:var(--red)}.brand{display:flex;gap:12px;align-items:center;font-weight:800;text-decoration:none;font-size:14px}.brand small{display:block;font-weight:400}.seal{border:2px solid var(--red);border-radius:12px;padding:0 9px;font:40px/1.4 serif}.hero{padding:38px 0}.hero h1{font-family:Thai,serif;font-size:clamp(30px,5vw,52px);line-height:1.5;margin:10px 0}.eyebrow,.muted{color:var(--muted);font-size:13px}.books,.words,.options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.book,.word,.box,.question{background:white;border:1px solid var(--line);border-radius:18px;padding:22px}.book{display:flex;gap:18px;align-items:center;text-align:left;color:var(--ink)}.book img{width:70px;max-height:100px;object-fit:contain}.book strong{display:block}.book small{display:block;color:var(--muted)}button,select{font:inherit;touch-action:manipulation}button{cursor:pointer}button:disabled{opacity:.55;cursor:default}button,.button{border:1px solid var(--line);background:white;padding:10px 16px;border-radius:10px;min-height:44px}.primary,.active{background:var(--red);color:white;border-color:var(--red)}.button{text-decoration:none;display:inline-block}.toolbar,.tabs{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:18px 0}.tabs button[aria-pressed=true]{background:var(--red);color:white}.word{text-align:center;display:flex;flex-direction:column;gap:7px}.word .han{font:48px/1.5 serif;color:var(--red);overflow-wrap:anywhere}.pin{color:var(--red)}.picture{height:100px;font-size:65px;display:flex;align-items:center;justify-content:center;background:#edf1e6;border-radius:12px}.picture img{width:100%;height:100%;object-fit:contain}.word figure{margin:0}.word figcaption{font-size:11px;color:var(--muted)}.example{margin-top:12px;background:#f7f5ed;padding:10px;border-radius:10px}.example span{display:block;font-size:13px}.original{max-width:700px;margin:20px auto}.original img{width:100%;border-radius:12px}h2,h3,h4{line-height:1.5}.question{max-width:760px;margin:20px auto}.question .han,.speaking-target{font:36px/1.8 serif;overflow-wrap:anywhere}.options{grid-template-columns:repeat(2,minmax(0,1fr));margin:20px 0}.options button{min-width:0;overflow-wrap:anywhere}.correct{border-color:#287449;background:#e5f4e7}.incorrect{border-color:var(--red);background:#fce3df}.feedback{white-space:pre-line}.score{font-size:42px;color:var(--red)}label{display:inline-block}.sr-status{min-height:28px}audio{max-width:100%;width:100%}.matching{display:grid;grid-template-columns:1fr 1fr;gap:15px}.matching .column{display:flex;flex-direction:column;gap:12px}.matching button.selected{outline:3px solid #cd944c}footer{border-top:1px solid var(--line);margin-top:35px;font-size:13px}.warning{background:#fff0dd;padding:15px;border-radius:10px}.box{margin:18px 0}.box details{margin-top:14px}select{max-width:100%;padding:8px;border-radius:8px}[hidden]{display:none!important}:focus-visible{outline:3px solid #cc893c;outline-offset:3px}@media(max-width:800px){.books,.words{grid-template-columns:repeat(2,minmax(0,1fr))}.book{padding:14px;gap:10px}.book img{width:50px}}@media(max-width:500px){header,main,footer{padding:16px}.books,.words{grid-template-columns:1fr}.word .han{font-size:44px}.brand{font-size:11px}.seal{font-size:30px}.question{padding:16px}.toolbar>*{max-width:100%}}
.vocab-art{display:block;width:100%;max-width:240px;margin:auto;aspect-ratio:1;background-repeat:no-repeat;background-color:#fffaf0;border-radius:16px;flex-shrink:0}.word figure{width:100%;overflow:hidden}.word{padding:18px;box-shadow:0 7px 25px #34342508}.art-context{margin:8px 0 0;color:#626959;font-size:13px;line-height:1.6}.matching .vocab-art{width:100%;max-width:160px;margin:auto}.matching [data-match-picture]{padding:8px}.words{align-items:start}.example{padding:14px}.example strong{display:block;font-size:20px;line-height:1.6}.example .pin{line-height:1.6}.art-unavailable{padding:25px;color:#60685f}.word .han{font-size:52px}@media(max-width:500px){.word{padding:18px}.vocab-art{max-height:240px;max-width:240px;margin:auto}.word .han{font-size:50px}}

.weekday-art{position:relative;width:100%;aspect-ratio:1;background-size:100% 100%;background-repeat:no-repeat;border-radius:16px}.weekday-art>strong{position:absolute;top:31%;left:18%;width:64%;font-size:clamp(17px,2vw,25px);text-align:center;color:#533e2b}.weekday-strip{position:absolute;top:47%;left:18%;width:64%;display:grid;grid-template-columns:repeat(7,1fr);gap:2px}.weekday-strip span{font-size:12px;padding:4px 1px;border-radius:4px;background:#f0ede3;color:#655d50;text-align:center}.weekday-strip .day-active{background:#b8322d;color:white;font-weight:800}.matching .weekday-art{max-width:160px;margin:auto}

.month-strip{grid-template-columns:repeat(4,1fr);top:43%}.month-strip span{padding:.25rem;font-size:.85rem}

/* Never enlarge a small atlas crop beyond its actual pixel dimensions. */
.vocab-art{max-width:min(240px,var(--art-native,240px));height:auto}
.matching .vocab-art{max-width:min(160px,var(--art-native,160px))}

.speech-illustration{width:100%;max-width:240px;margin:18px 0}.speech-illustration .vocab-art{margin:0}

.box>label{display:block;max-width:100%}#target{display:block;width:100%;min-width:0;max-width:100%;margin-top:8px}