/* Day 3 purple; artwork replaces illustrations, original game controls stay live. */
:root{--ink:#302340;--muted:#695979;--pur:#9451D4;--pur-deep:#7841AE;--pur-dark:#502577;--pur-soft:#F1E7FA}
html{background:#DED0EF}body{font-family:"Segoe UI",system-ui,sans-serif;background:linear-gradient(150deg,#F8F3FE,#DECFEE) fixed;font-size:18px}
.wrap{max-width:1120px;padding:16px 20px 26px}
.panel,.mcard,.stage,.jarside{border:2px solid #D6C2E8;box-shadow:0 6px 0 #C3ABD8,0 15px 24px #4927690A}
.btn{font-size:19px;min-height:48px;padding:10px 22px}.btn:hover:not(:disabled){filter:brightness(1.06)}
button:focus-visible{outline:4px solid #E7A800;outline-offset:3px}.btn[disabled]{opacity:.55}
.cover{max-width:780px;width:100%;margin:auto;text-align:center;padding:24px 30px}
.day-label{font-size:15px;font-weight:850;color:var(--pur-deep);letter-spacing:.05em;margin:0 0 8px}
.cover h1{font-size:clamp(38px,5vw,55px);font-weight:900;letter-spacing:-.03em;line-height:1.12;color:var(--pur-dark)}
.cover-art{height:220px;display:flex;align-items:center;justify-content:center;gap:24px;margin:10px auto}
.polly-art{display:block;background-image:url('/play/word-jar/assets/polly-poses-clay.webp');background-size:307.6923% 200%;background-position:12.963% 0;background-repeat:no-repeat;aspect-ratio:.65;animation:polly-idle 4.5s step-end infinite}
.cover-art>.polly-art{width:143px;height:220px;flex:none}
@keyframes polly-idle{0%,20%,40%,60%,80%,90%,96%,100%{background-position:12.963% 0}10%,30%,50%,70%,85%{background-position:87.037% 100%}92%,94%{background-position:12.963% 100%}}
@keyframes polly-speak{from{background-position:12.963% 0}to{background-position:87.037% 0}}
.mini-jar{display:flex;align-items:center;justify-content:center;position:relative;width:240px;height:150px;background:url('/play/word-jar/assets/word-jar-clay.webp') center/100% 100% no-repeat;padding:36px 22px 20px;flex:none}
.mini-cards{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px}
.mini-cards b,.example-word{display:inline-block;font-size:20px;font-weight:850;background:#FFC940;color:var(--ink);border:1px solid #C69C4C;border-radius:7px;padding:3px 10px;box-shadow:0 3px 0 #D1B260}
.mini-cards b:last-child{background:#C8A8EA;border-color:#A987CA;box-shadow:0 3px 0 #AC8CCA}
.example-word.green{background:#8DDDAB;border-color:#69AE81;box-shadow:0 3px 0 #7EB98F}
.lede{font-size:21px;line-height:1.4;color:var(--ink);margin:8px auto 20px}.tiny,footer{font-size:14px;color:var(--muted)}.tiny{margin:18px 0 0}
#s-howto .panel{max-width:980px;margin:auto}.slide-pic{max-width:440px;max-height:170px;width:auto;object-fit:contain;margin:6px auto}
.cap{max-width:830px;background:transparent;font-size:18px;line-height:1.4;margin:8px auto 16px;padding:0}
.steps{gap:12px;margin:4px 0 18px}.step{border:2px solid #E3D2F0;box-shadow:0 4px 0 #E0CFED;padding:12px;background:#FAF6FE}
.step p{font-size:17px;line-height:1.4}.step .n{margin-bottom:0}
.step-art{display:flex;align-items:center;justify-content:center;gap:8px;height:86px;margin:3px auto 8px}
.step-art .polly-art{width:54px;height:83px}.step-art .mini-jar{width:128px;height:80px;padding:24px 10px 10px}.step-art .mini-cards{gap:3px}.step-art .mini-cards b{font-size:12px;padding:2px 5px;box-shadow:0 2px 0 #C7AD75}
.step-art .mini-jar.small{width:80px;height:58px;padding:0}.step-art .example-word{font-size:17px;padding:3px 7px}
.hud{margin-bottom:10px}.pill{font-size:16px;background:#fff;color:var(--pur-dark);box-shadow:0 3px 0 #C9B2DD}.pill.score{color:#3A2A00}
.icon-btn{color:var(--pur-dark);background:white;box-shadow:0 3px 0 #C9B2DD}
.mcard{border-left:7px solid #FFC940;padding:11px 16px;margin-bottom:12px}.mcard h2{font-size:25px;line-height:1.2}.mcard p{font-size:18px;line-height:1.35}
.facts{padding:7px 10px;margin-top:8px;font-size:17px;border:1px solid #E9CB7C}.facts .lab{display:inline;font-size:12px;margin-right:5px;letter-spacing:.05em}
.game{grid-template-columns:.8fr 1.15fr;gap:16px}
.stage{padding:14px;background:linear-gradient(160deg,#EFFAF3,#FFF 70%);position:sticky;top:12px}
.leaf{width:110px;opacity:.28}.leaf.l1{left:-22px;top:20px;transform:rotate(8deg)}.leaf.l2{right:-25px;bottom:70px;transform:rotate(185deg)}
.bubble{font-size:22px;padding:10px 13px;min-height:74px;max-width:none}.bubble .who{font-size:12px;letter-spacing:.055em}
#polly{width:150px;height:230px;margin:10px auto 0;animation:bob 2.6s ease-in-out infinite}#polly>.polly-art{width:100%;height:100%}
#polly.talk>.polly-art{animation:polly-speak .14s steps(1,end) 6 alternate,polly-idle 4.5s step-end .84s infinite}
.said{margin-top:8px;padding:9px 10px;min-height:74px;background:#FFFFFFE8}.said .lab{font-size:13px;letter-spacing:.045em}
.tile{font-size:15px;padding:3px 8px}.stally{font-size:15px;line-height:1.3}.tiles:empty:before{font-size:15px}
.jarside{padding:14px 16px 16px}
.jar-data{display:grid;grid-template-columns:minmax(0,1fr) 150px;gap:12px;align-items:center}
.jarwrap{position:relative;max-width:370px;width:100%;min-height:180px;margin:0 auto;background:url('/play/word-jar/assets/word-jar-clay.webp') center/100% 100% no-repeat;padding:43px 25px 24px}
.lid{position:absolute;top:7px;left:12%;right:12%;margin:0;height:22px;border-radius:0;background:none;color:#fff;font-size:13px;letter-spacing:.08em;text-shadow:0 1px 2px #513078}
.jar{background:none;border:0;border-radius:0;min-height:110px;padding:0;gap:5px;align-content:center}
.card{font-size:15px;padding:3px 7px;line-height:1.2;border:1px solid #63507055;border-radius:7px;box-shadow:0 2px 0 #63507045;white-space:nowrap}
.bars{margin:0;max-width:none;width:100%}.bars .lab{font-size:11px;letter-spacing:.02em;line-height:1.25;margin-bottom:8px}
.bar{grid-template-columns:70px minmax(15px,1fr) 20px;gap:5px;font-size:14px;margin:6px 0}.bar .t{height:13px}.bar b{font-size:15px}
.ask{font-size:17px;line-height:1.35;margin:12px 0 10px}.try{font-size:14px;vertical-align:1px}
.chip{font-size:17px;padding:8px 14px;min-height:52px}.chip small{font-size:13px}.chips{gap:9px;margin-bottom:10px}
.tray{gap:9px;margin-bottom:10px}.tcard{font-size:19px;padding:9px 16px}.tcard small{font-size:13px}.btn.small{font-size:15px;padding:8px 12px;min-height:40px}
.status{font-size:17px;line-height:1.35;min-height:0;margin:7px 0 12px}.status:empty{display:none}
.shows{padding:10px 12px;border:1px solid #E9CB7C;margin:9px 0 13px}.shows .lab{font-size:12px;letter-spacing:.045em}.shows p{font-size:16px;line-height:1.35}
.verdict{gap:7px;margin-top:8px}.vfor{font-size:16px}.vp{font-size:15px;padding:3px 10px}
.rating-star{font-size:57px;line-height:1.1;color:#DCD0E8;text-shadow:0 3px 0 #BDA9CC}.rating-star.on{color:#FFC940;text-shadow:0 3px 0 #B68511;animation:starpop .5s cubic-bezier(.2,1.6,.4,1) both}.rating-star:nth-child(2){animation-delay:.18s}.rating-star:nth-child(3){animation-delay:.36s}
.word span{font-size:14px;line-height:1.3;display:block;margin-top:3px}.word b{font-size:16px}.note,.bigline{font-size:17px;line-height:1.35}
@media(min-width:761px) and (max-height:800px){
 .wrap{padding-top:12px;padding-bottom:18px}.panel{padding:16px 20px}.cover{padding:22px}.cover-art{height:190px}.cover-art>.polly-art{width:124px;height:190px}.cover-art .mini-jar{width:220px;height:140px}
 .mcard{padding:9px 14px;margin-bottom:10px}.mcard h2{font-size:23px}.mcard p{font-size:17px}.facts{font-size:16px;margin-top:6px;padding:6px 9px}
 .stage,.jarside{padding:12px}.bubble{font-size:21px;min-height:68px}#polly{width:130px;height:200px;margin-top:8px}.said{margin-top:6px}
 .jarwrap{min-height:165px;padding:39px 22px 22px}.jar{min-height:100px;gap:4px}.card{font-size:14px;padding:3px 6px}.lid{top:6px;font-size:12px}
 .jar-data{grid-template-columns:minmax(0,1fr) 145px;gap:10px}.ask{font-size:16px;margin:10px 0 8px}.chip{font-size:16px;padding:7px 12px;min-height:48px}
 .tcard{font-size:18px;padding:7px 14px}.tray{margin-bottom:8px}.status{font-size:16px;margin:6px 0 10px}.shows{padding:9px 11px;margin:8px 0 11px}.shows p{font-size:15px}.vp,.vfor{font-size:15px}
 .btn{font-size:18px;padding:9px 22px;min-height:46px}.tbox{padding:9px}.tbox b{font-size:28px}.final{font-size:40px}.rating-star{font-size:48px}.words{margin:9px 0}.note{padding:8px 12px;margin:6px 0}
}
@media(min-width:761px) and (max-width:1000px){.wrap{padding-left:14px;padding-right:14px}.game{grid-template-columns:.75fr 1.2fr}.jar-data{grid-template-columns:minmax(0,1fr) 125px}.bar{grid-template-columns:65px minmax(12px,1fr) 17px;gap:4px;font-size:13px}.jarwrap{padding-left:17px;padding-right:17px}.card{font-size:13px;padding:3px 5px}.bubble{font-size:19px}}
@media(max-width:760px){
 .wrap{padding:12px 12px 22px}.panel{padding:18px 14px}.cover{padding:24px 16px}.cover h1{font-size:38px}.day-label{font-size:13px}.lede{font-size:19px}
 .cover-art{height:175px;gap:8px}.cover-art>.polly-art{width:105px;height:162px}.cover-art .mini-jar{width:185px;height:125px;padding:35px 15px 19px}.cover-art .mini-cards b{font-size:16px;padding:3px 7px}
 .slide-pic{width:100%;max-height:155px}.cap{font-size:17px}.steps{grid-template-columns:1fr;gap:10px}.step{display:grid;grid-template-columns:28px 95px 1fr;align-items:center;gap:8px;text-align:left;padding:10px}
 .step-art{width:95px;height:66px;margin:0;gap:4px}.step-art .polly-art{width:39px;height:60px}.step-art .mini-jar{width:95px;height:62px;padding:18px 9px 8px}.step-art .mini-cards b{font-size:10px;padding:1px 3px}.step-art .example-word{font-size:13px;padding:3px 5px}.step-art .mini-jar.small{width:46px;height:40px}.step p{font-size:16px;line-height:1.3}
 .hud{position:sticky;top:0;z-index:5;background:#F4ECFB;padding:6px 0 9px;margin-top:-6px;gap:7px}.pill{font-size:14px;padding:6px 10px}.mcard{padding:11px 12px}.mcard h2{font-size:23px}.mcard p{font-size:17px}.facts{font-size:16px;line-height:1.3}
 .game{grid-template-columns:1fr;gap:12px}.stage{position:relative;top:auto;padding:12px;scroll-margin-top:65px}.pstage{gap:8px;flex-direction:row-reverse}.bubble{font-size:19px;min-height:74px;padding:9px 11px}#polly{width:72px;height:111px;margin:0;flex:none}.leaf{width:85px}.leaf.l1{top:-15px}.leaf.l2{bottom:-10px}.said{min-height:64px;margin-top:8px;padding:8px}
 .jarside{padding:14px 12px}.jar-data{grid-template-columns:1fr;gap:8px}.jarwrap{max-width:340px;padding:39px 23px 23px;min-height:174px}.jar{min-height:108px;gap:5px}.card{font-size:15px;padding:3px 6px}.lid{font-size:12px}
 .bars{max-width:300px;margin:auto}.bars .lab{font-size:12px}.bar{font-size:15px;grid-template-columns:85px 1fr 24px;margin:4px 0}.bar .t{height:14px}
 .ask{font-size:17px}.chips{gap:7px}.chip{font-size:16px;padding:8px 10px}.chip small{font-size:13px}.status{font-size:16px}.shows p{font-size:16px}.tcard{font-size:18px;padding:8px 14px}
 .tally{grid-template-columns:repeat(3,1fr);gap:6px}.tbox{padding:10px 4px}.tbox b{font-size:26px}.tbox span{font-size:12px;line-height:1.25;display:block;margin-top:4px}
}
@media(max-width:370px){.step{grid-template-columns:25px 80px 1fr;gap:6px;padding:9px 6px}.step-art{width:80px}.step-art .mini-jar{width:80px}.step p{font-size:15px}.cover-art .mini-jar{width:155px;height:110px}.cover-art>.polly-art{width:92px;height:142px}.cover-art .mini-cards b{font-size:14px}.pill{font-size:13px}.chip{font-size:15px;padding:7px 8px}.tcard{padding:8px 12px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.polly-art{background-position:12.963% 0!important}}