/* The illustrated collection: shared presentation for lessons, upgrades and rewards. */
:root{--paper:#fff9ef;--line:#e5dccb;--muted:#697669;--ink:#285b58}
body{background:radial-gradient(ellipse at 12% 0,#e4f2e4 0,transparent 36%),radial-gradient(ellipse at 100% 36%,#f8e5d6 0,transparent 45%),#fff9ef}
.site-header{border-bottom-color:#dddfce}.game-heading h1 em{color:#589aaa}.game-heading>p{color:#967d60}.arena{border-color:#d8d9c4;box-shadow:0 9px 35px #715e3112}.hud{background:linear-gradient(110deg,#fffaf1,#f0f6e9)}
.chapter{background:#fffdf5;border-color:#dacfb9;box-shadow:0 3px 0 #d6c7ae55}.chapter.active{border-color:#6ba89b;box-shadow:0 3px 0 #6ba89b}.chapter.active .chapter-copy{background:#dcefe4}.chapter .map-thumb{height:84px}.chapter.locked .map-thumb{filter:saturate(.7)}
.art-loading{font-size:13px;border-radius:12px;padding:12px 16px;background:#f1e5fc;color:#685582}.shop button{background:linear-gradient(145deg,#fffdf7,#f7eddb);border-color:#d9d7c5;box-shadow:0 2px 0 #dacfb455}.shop button.selected{background:linear-gradient(145deg,#f4ffe9,#daecdf);border-color:#629989}.shop img{width:57px;height:57px}.shop button{min-height:102px}.selection-head img{width:66px;height:66px;object-fit:contain}.upgrade{background:linear-gradient(120deg,#f5f6df,#e7f3e7);border-color:#bbceac;display:flow-root;min-height:67px}.upgrade-art{float:left;width:43px;height:47px;object-fit:contain;margin:0 8px 0 0}.upgrade small{overflow:hidden}.mastery{background:linear-gradient(120deg,#f4e9fc,#fff2d2);border-color:#d5b5cc}.hero-button{background:linear-gradient(120deg,#fff0cc,#fce4c9);border-color:#e4c181}.hero-button>img{width:54px;height:57px;object-fit:contain}.coach img{width:55px;height:60px;object-fit:contain}.coach-name{color:#aa7839}.wave-strip{background:linear-gradient(110deg,#f2f3e3,#fcf0dd);border-color:#e1d5bd}.primary{background:#34746c;box-shadow:0 3px 0 #21564e}.primary:hover{background:#40877c}.speed button[aria-pressed=true]{background:#367c77;box-shadow:0 2px 0 #255c55}.boss-banner{min-height:68px;padding-left:77px;text-align:left;background:#f7e8fbf5}.boss-banner img{position:absolute;left:10px;top:6px;width:55px;height:55px;object-fit:contain}.paused-overlay{background:radial-gradient(ellipse,#fffaf3fa,#e6f1e5f5)}.paused-overlay>img{object-fit:contain;width:85px;height:95px}
dialog{background:linear-gradient(140deg,#fffcf6,#faf1e3);border:2px solid #e0d4bc;box-shadow:0 22px 100px #30463b55}dialog::backdrop{background:#243f416b}.guide-welcome{display:flex;align-items:center;gap:18px;margin-bottom:12px}.guide-welcome img{object-fit:contain}.guide-welcome h2{margin:0}.enemy-card{background:#fffdf7;box-shadow:0 3px 0 #e8decb55}.enemy-card img{object-fit:contain}.progress-card{background:linear-gradient(130deg,#f4f6e6,#fff0d9);border-color:#d9d4bc}.progress-card.collected{border-color:#d2b877}.progress-card .postcard{height:92px;width:148px}.progress-card .stars{color:#ba8a24}.result-scene{display:block;width:calc(100% + 68px);max-width:none;height:155px;object-fit:cover;margin:-34px -34px 0;border-radius:20px 20px 0 0}.result-toddy{position:relative;margin:-51px auto 5px;background:#fffaf1;border:4px solid #fffaf1;border-radius:50%;width:108px;height:115px;object-fit:contain;padding:6px}#result>.close{z-index:2;background:#fff9eddb;border-radius:50%}.award-note{background:linear-gradient(110deg,#fbe6b3,#f0e6fa)}
#lesson{max-width:660px;padding:0 28px 25px;border-color:#c6d6bd;--lesson-accent:#619fa7}#lesson[data-guardian=floss]{--lesson-accent:#79a986}#lesson[data-guardian=fluoride]{--lesson-accent:#aa89bd}#lesson[data-guardian=water]{--lesson-accent:#4fa8ba}#lesson[data-guardian=saliva]{--lesson-accent:#c1a268}.lesson-landscape{position:relative;height:155px;margin:0 -28px 23px;background:#e7eddd;overflow:hidden}.lesson-landscape>img{width:100%;height:100%;object-fit:cover;object-position:center top}.lesson-landscape:after{content:'';position:absolute;inset:50% 0 0;background:linear-gradient(transparent,#254c46d9)}.lesson-landscape>span{position:absolute;bottom:15px;left:28px;right:24px;color:white;font-size:12px;font-weight:bold;z-index:1;text-shadow:0 1px 3px #20483d}#lesson>.eyebrow{color:var(--lesson-accent);font-size:10px}#lesson .lesson-hero{gap:20px;align-items:center}#lesson .lesson-hero>img{width:122px;height:136px;object-fit:contain;background:radial-gradient(ellipse,#eff2dc,transparent 69%)}#lesson h2{font-size:28px;line-height:1.12;letter-spacing:-.7px;margin-bottom:15px}.care-label{font-size:9px;letter-spacing:1.3px;color:var(--lesson-accent);font-weight:bold;display:block;margin:6px 0}#lesson .lesson-hero p{font-size:13px;line-height:1.55}.lesson-evolution{display:flex;justify-content:center;gap:12px;padding:12px;margin:18px 0 0;border:1px solid #e4dccb;border-radius:16px;background:#fffdf5}.lesson-evolution>div{flex:1;max-width:110px;min-width:0;text-align:center}.lesson-evolution img{display:block;width:100%;height:69px;object-fit:contain}.lesson-evolution span{font-size:9px;display:block;color:#7b7966;margin-top:5px}#lesson .lesson-tip{border-left-color:var(--lesson-accent);background:#eaf0e0;padding:13px 16px;margin:16px 0 10px}#lesson .lesson-tip strong{font-size:9px;letter-spacing:1.3px;color:#537e6e}#lesson .lesson-tip p{font-size:12px;line-height:1.5;margin:6px 0 0}#lesson>.small{font-size:10px;margin-bottom:0}#lesson>.primary{font-size:13px;margin-top:15px}
@media(max-width:780px){.progress-card .postcard{width:110px}}
@media(max-width:520px){.chapter .map-thumb{height:66px}.shop img{width:43px;height:46px}.quick-shop .shop img{width:42px;height:45px}.shop button{min-height:87px}.quick-shop .shop button{min-height:85px}.selection-head img{width:56px;height:59px}.selection.mobile-open .selection-head img{width:54px;height:58px}.selection.mobile-open .upgrade{min-height:64px}.upgrade-art{width:39px;height:43px}.coach img{width:45px;height:50px}.boss-banner{padding-left:60px;min-height:60px}.boss-banner img{width:44px;height:48px}.paused-overlay>img{width:50px;height:55px}.progress-card .postcard{width:83px}.result-scene{width:calc(100% + 40px);margin:-34px -20px 0;height:127px}#lesson{padding:0 18px 18px;max-height:94dvh}.lesson-landscape{height:112px;margin:0 -18px 17px}.lesson-landscape>span{left:18px;bottom:12px;font-size:10px}#lesson .lesson-hero{gap:10px;align-items:flex-start}#lesson .lesson-hero>img{width:76px;height:98px}#lesson h2{font-size:23px;margin-bottom:10px}#lesson .lesson-hero p{font-size:12px}#lesson>.eyebrow{font-size:9px}.lesson-evolution{gap:5px;padding:9px;margin-top:13px}.lesson-evolution img{height:52px}.lesson-evolution span{font-size:8px}.care-label{font-size:8px}#lesson .lesson-tip{margin-top:12px;padding:10px 12px}#lesson .lesson-tip p{font-size:11px}#lesson>.primary{position:sticky;bottom:0;box-shadow:0 3px 0 #21564e,0 -5px 15px #fff8ee}}
@media(orientation:landscape) and (max-height:550px){.lesson-landscape{height:90px}.lesson-evolution img{height:45px}.shop img{width:37px;height:38px}.shop button{min-height:78px}}
@media(orientation:landscape) and (max-height:550px) and (min-width:650px){.site-header{display:flex;position:fixed;bottom:8px;right:12px;z-index:30;padding:0;border:0;max-width:145px}.site-header>img,.site-header .header-actions{display:none}.site-header .back{background:#fff9ee;border:1px solid #b6c8b4;border-radius:12px;padding:8px 12px;min-height:44px;box-shadow:0 3px 14px #244d4333;font-size:11px}}