/* Direção visual da capa: livro infantil, creme, verde-floresta e laranja. */
:root{background:#fbefcf;color:#234b31;font-family:'Arial Rounded MT Bold','Trebuchet MS',sans-serif}
body,body[data-theme=peppa],body[data-theme=patrulha],body[data-theme=bob]{--accent:#46754a;--dark:#204c31;--back:#386841;--edge:#e8d8a9;--sky:#fbefcf;--floor:#d4db9e;background:#fbefcf;color:#24482c}
body[data-theme=peppa]{--accent:#9a5b68;--back:#5a7447;--edge:#efcaaf}body[data-theme=patrulha]{--accent:#426a78;--back:#345f54;--edge:#eacb89}body[data-theme=bob]{--accent:#3e8177;--back:#2f7060;--edge:#e8d294}
.scenery,[data-theme=bob] .scenery{background:#fbefcf url('jardim-capa.png') center/cover no-repeat}.scenery .decor,.scenery .ground{display:none}
body header{max-width:1120px;padding:25px 28px 20px;min-height:148px;gap:24px;align-items:center}body header h1{color:#fff4d0;background:#17472d;border-radius:44% 37% 27% 31%/31% 40% 24% 31%;padding:15px 35px 19px;transform:rotate(-2deg);font-size:clamp(28px,4vw,45px);line-height:.95;letter-spacing:-1.7px;text-shadow:0 3px 0 #082d1e;box-shadow:0 5px 0 #0c3420,0 7px 15px #26422524;position:relative}body header h1:before,body header h1:after{content:'';position:absolute;width:24px;height:38px;background:#92b943;top:16px;border-radius:100% 0 100% 0;transform:rotate(-40deg);left:-10px;box-shadow:inset -5px -1px 0 #749a34}body header h1:after{left:auto;right:-9px;top:auto;bottom:17px;transform:rotate(35deg)}body header h1 small{display:block;color:#ff941c;font-size:.64em;line-height:1.2;letter-spacing:-1px;margin-top:3px}body header .quintal-home{font-size:0;min-width:58px;min-height:58px;display:grid;place-items:center;padding:9px;background:#fff5d9;border:2px solid #e7d5a6;border-radius:20px;box-shadow:0 5px 0 #b69c69;color:#365c34;text-decoration:none}body header .quintal-home span{font-size:37px;line-height:1}
.icon-button{background:#fff5dc;border:2px solid #ddc79b;border-radius:20px;box-shadow:0 5px 0 #ba9c65;color:#315b38;min-width:58px;min-height:58px;font-size:27px}#restart{color:#38663c}.header-actions{gap:13px}
main{display:grid;grid-template-columns:216px minmax(0,1fr);grid-template-rows:auto auto auto;gap:15px 28px;max-width:1080px;padding:8px 28px 30px;align-items:start}.storybook{grid-row:1/3;border:2px solid #e4cda0;background:#fff6dfdb;border-radius:26px;box-shadow:0 7px 0 #c4ad7c55;padding:10px 12px 17px}.cover-reference{display:block;width:100%;height:auto;border-radius:17px;margin-bottom:18px;border:2px solid #f7e9c9}.themes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 10px;margin:0;max-width:none}.themes button{height:106px;border:2px solid #dccb9f;border-radius:17px;box-shadow:0 4px 0 #c8b488;background:#fff9e9;position:relative}.themes button[aria-pressed=true]{border:3px solid var(--accent);box-shadow:0 4px 0 var(--dark);background:#f8e8ba}.themes button>.portrait{width:62px;height:62px}.theme-mix{height:62px}.theme-mix .portrait{max-width:39px}.theme-name{font-size:9px;line-height:1.2;margin-top:7px;color:#3e5735}.portrait{background-color:#fff;border-radius:10px}.selected{background:#ef8d25;border-color:#fff1c8}.brand-signature{display:block;margin:22px auto 0;max-width:145px}.brand-signature img{display:block;width:100%;height:auto;max-height:85px;object-fit:contain}
.controls{grid-column:2;width:100%;margin:0;min-height:58px}.levels button{background:#fff5db;border:2px solid #dac492;box-shadow:0 4px 0 #c3a572;border-radius:16px;min-height:54px}.levels button[aria-pressed=true]{background:#f4c779;border-color:#ad742e}.mini-cards i{background:#437046;border-color:#fff2ce;border-radius:4px}.play-area{grid-column:2;width:100%;padding:18px 22px 10px;background:repeating-linear-gradient(0deg,#ffffff05 0 5px,#8953230b 6px 7px),linear-gradient(100deg,#d5a16b,#edc18a 45%,#d1a06c);border:5px solid #f4d9a3;border-radius:29px;box-shadow:0 7px 0 #ae7541,0 15px 22px #5a4a2526;backdrop-filter:none;max-width:none}.board{max-width:570px;gap:14px}.progress{background:#fff3d4;border:1px solid #d9ba80;border-radius:30px;padding:8px 17px;width:fit-content;margin:0 auto 18px;box-shadow:0 2px 0 #af7b4555}.star.empty{color:#a78d5d}.star{font-size:22px;color:#e78c18}.face{border-radius:14px}.back{background:radial-gradient(ellipse at 40% 25%,#ffffff0b,transparent 60%),repeating-linear-gradient(40deg,#ffffff05 0 2px,transparent 2px 6px),var(--back);border:4px solid #fff0c9;box-shadow:0 4px 0 #9b713e,0 7px 10px #61482435;outline:1px solid #a38c4f}.back span{background:none;border-radius:0;padding:14px;display:grid;place-items:center;width:100%;height:100%}.leaf-mark{width:73%;height:73%;filter:drop-shadow(0 2px 0 #173d2640)}.front{border:4px solid #fff0c9;box-shadow:0 4px 0 #9b713e,0 7px 10px #61482435;background:#fffdf6}.front .portrait{width:91%;height:91%}.card.matched .front{border-color:#96ba54}.card.matched:after{background:#ea931f;border-color:#fff1c8}.feedback{background:#ffedc78c;border-radius:30px;width:fit-content;min-width:100px;margin:16px auto 0;padding:0 12px;line-height:34px;min-height:34px;font-size:22px}footer{grid-column:1/-1;color:#50613d;margin:10px 0 0;font-size:9px}dialog{border-color:#dcc08b;background:#fff3d7;color:#234a30;box-shadow:0 10px 0 #a77c46,0 20px 70px #17351e55}dialog::backdrop{background:#183b2999}.big-play{background:#477648;border-color:#fff4d4;box-shadow:0 5px 0 #234a30}.demo-card{background:#3b6941;border-color:#e8ce98}
@media(max-width:760px){body header{padding:18px 16px;min-height:115px;gap:13px}body header h1{font-size:31px;max-width:none;padding:11px 20px 14px}body header .quintal-home,.icon-button{min-width:48px;min-height:48px;border-radius:16px}body header .quintal-home span{font-size:30px}.header-actions{gap:8px}main{grid-template-columns:1fr;padding:4px 16px 25px;gap:16px}.storybook{grid-row:auto;padding:12px 12px 14px;display:block;border-radius:22px}.cover-reference,.brand-signature{display:none}.themes{grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.themes button{height:99px}.theme-name{font-size:8px}.controls,.play-area{grid-column:1}.controls{min-height:50px}.play-area{padding:15px 15px 10px;border-width:4px}.board{gap:12px;max-width:540px}.progress{margin-bottom:15px}.back span{padding:8px}.back{border-width:3px}.scenery{background-position:center top;background-attachment:scroll}.theme-mix .portrait{max-width:34px}}
@media(max-width:400px){body header{padding:16px 12px;gap:10px}body header h1{font-size:26px;padding:11px 14px 12px;letter-spacing:-1px}.header-actions{gap:7px}.icon-button,body header .quintal-home{min-width:44px;min-height:48px;padding:5px;font-size:24px}.themes button>.portrait{width:54px;height:54px}.theme-mix{height:54px}.themes button{height:90px}.theme-name{font-size:7px}main{padding-inline:10px}.play-area{padding-inline:10px}.board{gap:10px}}

body header .icon-button{width:58px;height:58px;min-width:58px;min-height:58px;padding:8px;font-size:27px;border-radius:20px;line-height:1;background:#fff5dc;border:2px solid #ddc79b;box-shadow:0 5px 0 #ba9c65}body header{flex-wrap:nowrap}@media(max-width:760px){body header .icon-button{width:48px;height:48px;min-width:48px;min-height:48px;font-size:25px;padding:6px}}@media(max-width:400px){body header .icon-button{width:44px;min-width:44px}}