/* Shared EveryWay shell; this lesson adds only the budget and grocery workspace. */
.shop-page{min-width:0}
.shop-layout .workspace{width:100%;max-width:none;margin:0}
.shop-layout .guide-portrait{width:100%;object-fit:contain;height:350px}
.shop-layout .topic-picker{padding:12px;font-size:18px;font-weight:850;text-decoration:none;color:var(--blue);background:#e5f2ff;border-color:var(--blue)}
.shop-layout .guide-bubble{width:100%;margin:0;padding:18px 14px;border:1.5px solid #82b6ff;border-radius:22px;background:white;text-align:center;font-size:22px;line-height:1.35;font-weight:900}
.shop-page [hidden]{display:none!important}
.shop-page .lesson-heading{margin-bottom:18px;gap:12px}
.shop-page h1{font-size:clamp(28px,2.8vw,40px)}
.shop-page #intro{font-size:22px;margin:8px 0 0}
.shop-page .mode-tabs{min-width:290px;max-width:330px;flex-shrink:0}
.shop-page .mode-tabs button{flex:1;min-width:0;border:0;background:transparent;color:var(--blue);font-size:17px;font-weight:900;white-space:nowrap;padding:8px 12px;border-radius:999px;min-height:48px}
.shop-page .mode-tabs #learn-mode{flex:1.5}
.shop-page .mode-tabs button[aria-pressed=true]{background:var(--blue);color:white}
.budget-plan{display:grid;grid-template-columns:minmax(190px,28%) minmax(0,1fr);gap:20px;padding:18px 20px;border:1.5px solid var(--line);border-radius:18px;background:white;margin-bottom:16px}
.budget-plan h2{margin:0;font-size:27px;line-height:1.25;font-weight:900}
.wallet{padding-right:20px;border-right:1px solid var(--line);min-width:0}
.wallet #cash{display:flex;align-items:center;gap:4px;justify-content:center;min-height:85px;margin-top:12px;flex-wrap:wrap}
.wallet #cash img{width:100%;max-width:230px;max-height:96px;object-fit:contain}
.wallet #cash.change-notes img{width:calc(50% - 4px);max-height:60px}
.empty-wallet{font-size:19px;margin:0;color:#496183}
.value-plan{align-self:center;min-width:0}
.plan-heading{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.plan-heading h2{font-size:26px}.plan-heading p{font-size:17px;margin:0}
.value-strip{--square-gap:5px;display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:var(--square-gap);padding:10px 8px 8px;border:1px solid var(--line);border-radius:12px;min-height:100px}
.value-group{display:flex;flex-direction:column;min-width:0;gap:8px;color:var(--item-color);font-weight:900;text-align:center}
.value-squares{display:flex;gap:var(--square-gap)}.value-square{height:46px;flex:1;min-width:0;background:var(--item-color);border-radius:4px;border:1.5px solid var(--item-color);display:grid;place-items:center;color:#ffe08a;font-size:clamp(16px,1.6vw,24px);line-height:1;font-weight:900}
.value-group.left .value-square{background:white;border-color:#5c92cb;color:#946300}
.value-group.left{color:var(--navy)}
.value-legend{display:none}.value-legend span{color:var(--item-color);border-bottom:2px solid var(--item-color);font-size:16px;font-weight:900;padding:4px 0}
.value-group .value-label{font-size:17px;line-height:1.15;overflow-wrap:anywhere;border-top:2px solid var(--item-color);padding-top:6px}
.shopping-list{border:1.5px solid var(--line);border-radius:16px;background:white;padding:14px 16px;margin-bottom:14px}
.list-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.list-heading h2{font-size:24px;margin:0}
.shopping-list ul{display:flex;flex-wrap:wrap;gap:10px;list-style:none;padding:0;margin:0}.listed-good{display:flex;align-items:center;flex:1 1 160px;gap:10px;border:1px solid var(--line);border-radius:12px;padding:8px 10px;flex-wrap:wrap}.listed-good>img{width:42px;height:48px;object-fit:contain}.listed-good>strong{font-size:20px}.list-check{display:flex;align-items:center;gap:4px;font-size:16px;color:#496183;margin-left:auto}.list-check .icon{width:20px;height:20px}.listed-good.selected{background:#e6f8f6;border-color:#087e80}.listed-good.selected .list-check{color:#087b64;font-weight:900}
.goods-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:14px}
.good-card{display:grid;grid-template-columns:minmax(76px,46%) minmax(0,1fr);gap:10px;align-items:center;min-width:0;padding:12px;border:1.5px solid var(--line);border-radius:16px;background:white}
.good-card.selected{border-color:var(--item-color);background:var(--item-tint)}
.good-card>img{width:100%;height:145px;object-fit:contain}
.good-details{min-width:0;display:grid;grid-template-rows:minmax(53px,auto) 41px minmax(48px,auto) 48px;gap:4px}.good-card h2{font-size:22px;line-height:1.2;margin:0;font-weight:900;overflow-wrap:anywhere}
.good-price{display:block;font-size:34px;line-height:1.2;margin:0;font-weight:950}
.good-card button{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;height:48px;min-height:48px;border-radius:999px;padding:5px 8px;font-size:17px;font-weight:850;color:var(--blue);background:white;white-space:normal;line-height:1.2}
.good-card button .icon{width:20px;height:20px}
.good-card.selected button{background:var(--item-color);border-color:var(--item-color);color:white}.good-card.selected button .icon{filter:invert(1)}
.good-warning{display:flex;gap:5px;align-items:center;font-size:15px;font-weight:850;color:#805000;background:#fff1cd;border-radius:10px;padding:6px;margin:0;line-height:1.15}.good-warning img{width:19px;height:19px;flex-shrink:0}
.good-warning.empty{visibility:hidden}
.basket-summary{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1.5px solid var(--line);border-radius:14px;background:white;padding:12px 16px;margin:14px 0 12px;flex-wrap:wrap}
.basket-summary>div:first-child{display:flex;align-items:baseline;gap:20px;flex-wrap:wrap}
.basket-summary strong,.basket-summary #remaining{font-size:24px;font-weight:900}.basket-summary #remaining{border-left:1px solid var(--line);padding-left:20px;color:#087b64}
.shop-actions{display:flex;gap:12px;align-items:stretch}.shop-actions button{display:flex;gap:8px;align-items:center;justify-content:center;padding:11px 14px;font-size:19px;font-weight:900;color:var(--blue);background:white;flex:1;line-height:1.25}
.shop-actions #checkout{flex:1.4;background:var(--blue);color:white;border-color:var(--blue)}
.shop-layout .lesson-footer{margin-top:20px}.shop-layout .action-rail{padding-top:32px}.shop-layout .action-rail button{padding:26px 0;font-size:24px}.shop-layout .action-rail button>span{width:90px;height:90px}
.shop-page button:disabled{opacity:.48;cursor:default}.shop-page button:disabled:hover{filter:none}
.swap-panel{border:2px solid #b18626;border-radius:14px;background:#fff9e9;padding:16px;margin:14px 0}.swap-panel h2{font-size:22px;margin:0 0 6px}.swap-panel p{font-size:18px;margin:0 0 10px}.swap-panel button{font-weight:850;padding:8px 15px;margin-right:8px}
.transaction{border:1.5px solid var(--line);border-radius:18px;background:white;padding:22px}.transaction h2{font-size:32px;margin:0 0 10px}.transaction>p{font-size:22px;margin:0 0 18px}.checkout-items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.checkout-item{text-align:center;padding:12px;background:var(--item-tint);border-radius:12px}.checkout-item img{width:100%;height:115px;object-fit:contain}.checkout-item strong{display:block;font-size:22px}.payment-summary{font-size:27px;font-weight:900;text-align:center;margin-top:18px}.change-cash{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:18px 0}.change-cash img{width:min(160px,38%);object-fit:contain}
.shop-page .is-explained{outline:3px solid #76590b;outline-offset:4px}.shop-page #break-dialog button{width:100%}
@media(max-width:640px){html:has(>body.shop-page){scroll-padding-bottom:140px}}
@media(max-width:360px){.shop-page .site-header{flex-wrap:nowrap;padding-inline:10px;gap:4px}.shop-page .brand>img{width:74px}.shop-page .utility-nav{gap:6px}.shop-page .site-header button{font-size:14px;gap:4px}.shop-page .site-header .icon{width:24px;height:24px}}
@media(max-width:1199px){.shop-page .lesson-heading{flex-wrap:wrap}.shop-page .mode-tabs{min-width:0}.budget-plan{grid-template-columns:1fr;padding:16px;gap:12px}.wallet{display:flex;gap:14px;align-items:center;border-right:0;padding:0;border-bottom:1px solid var(--line);padding-bottom:12px}.wallet h2{font-size:24px}.wallet #cash{min-height:0;margin:0;max-width:190px}.value-strip{min-height:86px}.value-square{height:40px}.value-group .value-label{font-size:16px}.good-card{grid-template-columns:1fr;text-align:center;padding:10px;gap:5px}.good-card>img{height:105px}.good-card h2{font-size:20px}.good-price{font-size:30px}.good-warning{justify-content:center}.shop-layout .guide-portrait{height:260px}.shop-actions button{font-size:17px;padding:10px}.shop-actions .icon{width:22px;height:22px}}
@media(max-width:900px){.shop-layout .guide-portrait{height:210px}.shop-layout .guide-bubble{font-size:18px;padding:12px}.shop-layout .action-rail{padding:12px 8px;gap:4px}.shop-layout .action-rail button{font-size:17px;padding:6px;flex-direction:column;gap:4px}.shop-layout .action-rail button>span{height:48px;width:48px}.shop-layout .topic-picker{font-size:15px;min-height:54px}.goods-grid{gap:9px}.basket-summary strong,.basket-summary #remaining{font-size:21px}}
@media(max-width:640px){.shop-layout{padding-bottom:140px}.shop-layout .guide-portrait{width:72px;height:92px}.shop-layout .guide{flex-wrap:wrap}.shop-layout .guide-bubble{flex:1;width:auto;font-size:17px}.shop-layout .topic-picker{display:none}.shop-page .lesson-heading{gap:14px}.shop-page .lesson-heading>div{width:100%}.shop-page .mode-tabs{max-width:none;width:100%}.shop-page .mode-tabs button{flex:1}.shop-page #intro{font-size:19px}.goods-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.good-card>img{height:116px}.good-card h2{font-size:20px}.good-warning{font-size:14px}.good-card button{font-size:16px;min-height:44px}.value-strip{--square-gap:3px;padding:8px 5px;min-height:0}.value-strip .value-label{display:none}.value-legend{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:6px}.value-square{height:32px}.plan-heading h2{font-size:23px}.plan-heading p{font-size:15px}.basket-summary{padding:12px}.basket-summary>div:first-child{gap:8px}.basket-summary #remaining{border-left:0;padding-left:0}.basket-summary strong,.basket-summary #remaining{font-size:21px}.shop-actions{flex-wrap:wrap;gap:8px}.shop-actions #checkout{flex:1 1 100%}.shop-actions button{flex:1 1 40%;font-size:17px}.shop-layout .action-rail button{font-size:14px;flex:1}.shop-layout .action-rail button>span{width:42px;height:42px}.checkout-items{grid-template-columns:repeat(2,minmax(0,1fr))}.checkout-item strong{font-size:19px}.transaction{padding:16px}.transaction h2{font-size:28px}.transaction>p{font-size:20px}.shop-layout .lesson-footer{margin-top:16px}}
.shop-layout .topic-art{width:52px;height:44px;object-fit:contain;flex-shrink:0}
.shop-setup{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:12px 18px;border:1.5px solid var(--line);border-radius:16px;background:white;padding:16px 20px;margin-bottom:16px}
.shop-setup label{display:flex;flex-direction:column;gap:6px;font-size:17px;font-weight:850}
.shop-setup select{width:100%;min-width:0;min-height:48px;padding:8px;border:1px solid var(--line);border-radius:10px;background:#f7fbff;color:var(--navy);font:inherit}
.shop-setup p{grid-column:1/-1;margin:0;font-size:14px;line-height:1.4;color:#496183}
.compact-plan{gap:0;min-height:0}.compact-plan .value-label{display:none}.compact-plan .value-square{height:38px;border-radius:0}.compact-plan .value-group{gap:0}
.value-legend.expanded-legend{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:6px}
.value-legend .left{margin-left:auto;white-space:nowrap;color:var(--navy)}
.list-heading{flex-wrap:wrap;align-items:center}
.challenge-picker{display:flex;flex-direction:column;gap:4px;min-width:0;max-width:100%;font-size:16px;font-weight:850;color:var(--navy)}
.challenge-picker select{width:100%;max-width:380px;min-width:0;min-height:48px;padding:8px;border:1px solid var(--line);border-radius:10px;background:#f7fbff;color:var(--navy);font:inherit}
.basket-items{display:flex;flex-wrap:wrap;gap:8px;flex-basis:100%}
.basket-item{display:flex;align-items:center;gap:6px;padding:5px 10px;font-size:16px;min-height:44px;background:#f3faff}
.basket-item img{width:28px;height:30px;object-fit:contain}
@media(max-width:640px){.shop-layout .activity-link{display:flex;flex:0 0 100%;min-height:52px;font-size:16px}}
@media(max-width:640px){.shop-setup{grid-template-columns:minmax(0,1fr);padding:14px}.good-card h2{font-size:18px}.good-details{grid-template-rows:minmax(44px,auto) 36px minmax(42px,auto) 48px}}