:root{font-family:system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;color:#534235;background:#f7f1e5;font-synthesis:none;text-rendering:optimizeLegibility;--ink:#534235;--muted:#98836a;--paper:#fffdf7;--line:#eadfcd;--sage:#7c9167;--gold:#d9a944}
*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{min-height:100svh;padding:calc(12px + env(safe-area-inset-top)) 16px calc(22px + env(safe-area-inset-bottom));background:radial-gradient(ellipse at 50% 0,#fffaf0 0,transparent 60%),#f7f1e5;-webkit-tap-highlight-color:transparent}.hall-shell{width:min(100%,760px);margin:auto}.hall-header{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;min-height:66px}.hall-back{justify-self:start;display:inline-flex;align-items:center;gap:5px;min-height:44px;padding:0 12px;border:1px solid #e7dcc9;border-radius:14px;background:#fffaf0;color:#79664d;text-decoration:none;font-size:12px;font-weight:800}.hall-back:first-letter{font-size:20px}.hall-brand{text-align:center}.hall-brand span{font-size:9px;letter-spacing:.2em;color:#ad9472;font-weight:900}.hall-brand h1{margin:1px 0 0;font-family:Georgia,"Songti SC",serif;font-size:clamp(21px,5vw,29px)}.hall-stars{justify-self:end;display:flex;align-items:center;gap:6px;padding:8px 12px;border:1px solid #efdfb8;border-radius:15px;background:#fff9e9;color:#d19c32;font-size:19px}.hall-stars strong{font-size:16px;color:#735f3c}.hall-intro{margin:24px 0 18px;text-align:center;color:#88765f;font-size:15px;font-weight:800}.hall-games{display:grid;gap:18px}.hall-game{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.04fr);min-height:225px;overflow:hidden;border:1px solid #e9ddc9;border-radius:27px;background:#fffdf7e8;box-shadow:0 6px 0 #dfd2bd8c,0 14px 30px #6e594018}.hall-game--assemble{background:linear-gradient(120deg,#f0f2e2,#fffdf7 64%)}.hall-game--tone{background:linear-gradient(120deg,#f8eddb,#fffdf7 64%)}.hall-art{position:relative;display:grid;place-items:center;min-height:225px;overflow:hidden;background:radial-gradient(ellipse at 48% 60%,#fffdf1 0 31%,transparent 32%),linear-gradient(145deg,#e2eacd,#f4e9d0)}.hall-game--tone .hall-art{background:radial-gradient(ellipse at 48% 60%,#fffdf1 0 31%,transparent 32%),linear-gradient(145deg,#f4e5c9,#e6eddc)}.art-card,.tone-card{position:absolute;display:grid;place-items:center;width:66px;height:72px;border:1px solid #e4decf;border-bottom-width:4px;border-radius:18px;background:#fff9ed;box-shadow:0 7px 13px #70553220;font-size:33px;font-weight:900;color:#604832;transform:rotate(-8deg)}.art-card--one{left:18%;top:31%;background:#edf3e3;border-color:#dfe7d0;transform:rotate(-11deg)}.art-card--two{right:18%;top:36%;background:#fbefee;border-color:#f0dcdc;transform:rotate(9deg)}.art-plus{position:absolute;left:49%;top:48%;color:#c7aa76;font-size:28px;font-weight:800}.art-sun{position:absolute;right:16%;top:12%;color:#e9bd56;font-size:28px}.art-flower{position:absolute;left:19%;bottom:10%;color:#d09e80;font-size:32px}.tone-cloud{position:absolute;left:10%;top:15%;padding:9px 14px;border:1px solid #ede0c7;border-radius:18px;background:#fffaf0;color:#9a805d;font-size:13px;font-weight:900;line-height:1.4;text-align:center;transform:rotate(-6deg)}.tone-card{width:49px;height:52px;border-radius:14px;font-size:26px}.tone-card--one{left:19%;top:55%;background:#f9edbd;transform:rotate(-8deg)}.tone-card--two{left:42%;top:46%;background:#f5d6ca;transform:rotate(5deg)}.tone-card--three{right:17%;top:55%;background:#dce9d1;transform:rotate(8deg)}.tone-card--four{right:38%;bottom:8%;background:#dce5f0;transform:rotate(-4deg)}.hall-copy{align-self:center;padding:24px 25px 24px 12px}.game-kicker{color:#ae956d;font-size:10px;font-weight:900;letter-spacing:.12em}.hall-copy h2{margin:5px 0 7px;font-family:Georgia,"Songti SC",serif;font-size:clamp(24px,5.4vw,31px);color:#574330}.hall-copy p{margin:0 0 18px;color:#88765f;font-size:13px;line-height:1.6}.game-start{display:flex;align-items:center;justify-content:space-between;min-height:49px;padding:0 17px;border:1px solid #d8e2c9;border-bottom-width:4px;border-radius:15px;background:#eaf0df;color:#637853;text-decoration:none;font-size:14px;font-weight:900;touch-action:manipulation}.hall-game--tone .game-start{background:#f8edcf;border-color:#eedeb7;color:#8b7044}.game-start span{font-size:20px}.game-start:active{transform:translateY(2px);border-bottom-width:2px}.game-start:focus-visible,.hall-back:focus-visible{outline:3px solid #d6aa50;outline-offset:3px}.hall-shell footer{padding:22px 0;text-align:center;color:#ad9b83;font-size:11px}@media(max-width:560px){body{padding-inline:13px}.hall-header{grid-template-columns:1fr auto;grid-template-areas:"back stars" "brand brand";row-gap:8px}.hall-back{grid-area:back}.hall-brand{grid-area:brand;grid-row:2}.hall-stars{grid-area:stars}.hall-intro{margin:17px 0 12px}.hall-games{gap:13px}.hall-game{min-height:191px;grid-template-columns:43% 57%;border-radius:22px}.hall-art{min-height:191px}.hall-copy{padding:17px 14px 17px 6px}.hall-copy h2{font-size:25px}.hall-copy p{font-size:11px;margin-bottom:13px}.game-start{min-height:45px;font-size:13px;padding-inline:13px}.art-card{width:54px;height:59px;font-size:28px}.tone-card{width:41px;height:44px;font-size:23px}.tone-cloud{font-size:11px;padding:7px 10px}}
@media(max-width:360px){.hall-game{grid-template-columns:40% 60%}.hall-copy{padding-right:11px}.hall-copy h2{font-size:22px}.hall-copy p{font-size:10px}.art-card{width:47px;height:52px}.tone-card{width:36px;height:40px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition-duration:.01ms!important}}
.game-restart{margin-top:8px;background:#fffaf0;color:#876e4b;border-color:#eadbc0;border-bottom-width:2px;font-size:11px;min-height:38px}.game-restart[hidden]{display:none}

/* New storybook room backgrounds and the compact mascot titles for both learning paths. */
body{background-color:#f7f1e5;background-image:linear-gradient(180deg,#fffaf0a8 0%,#f7f1e57d 48%,#f7f1e5b5 100%),url('./assets-optimized/webp/assets/illustrations/home/study%20room.webp');background-position:center top;background-size:cover;background-repeat:no-repeat;background-attachment:scroll}
.hall-brand h1{font-size:clamp(30px,7vw,36px);line-height:1.1}
.hall-copy{align-self:start}
.hall-copy h2.hall-game-title{display:flex;align-items:center;gap:8px;width:max-content;max-width:100%;margin:0 0 7px;font-size:clamp(22px,5.2vw,28px);line-height:1.12}
.hall-copy .game-subtitle{margin:0 0 15px;color:#88765f;font-size:13px;line-height:1.5}
.hall-cat{display:block;width:43px;height:43px;object-fit:contain;flex:none;filter:drop-shadow(0 2px 2px #53422b20)}
@media(max-width:560px){.hall-brand h1{font-size:31px}.hall-copy h2.hall-game-title{font-size:24px}.hall-copy .game-subtitle{font-size:11px;margin-bottom:13px}.hall-cat{width:39px;height:39px}}
@media(max-width:360px){.hall-brand h1{font-size:29px}.hall-copy h2.hall-game-title{font-size:22px}.hall-copy .game-subtitle{font-size:10px}.hall-cat{width:35px;height:35px}}

/* Give the m + ǎ拼读 cards room to read clearly on narrow phones. */
.hall-game--assemble .art-card--one{left:7%;top:32%;}
.hall-game--assemble .art-card--two{right:7%;top:54%;}
.hall-game--assemble .art-plus{left:47%;top:47%;}
@media(max-width:560px){.hall-game--assemble .art-card--one{left:5%;top:30%;}.hall-game--assemble .art-card--two{right:5%;top:55%;}.hall-game--assemble .art-plus{left:46%;top:47%;}}