*{box-sizing:border-box}body{margin:0;background:#fff9ee!important;color:var(--dm-ink,#083579);font-family:var(--dm-font,sans-serif)}[hidden]{display:none!important}button,input{font:inherit}button,a{touch-action:manipulation}button{min-height:46px;padding:10px 18px;border:1px solid #b6cfe3;border-radius:16px;background:#fffefa;color:inherit;font-weight:700;cursor:pointer}button:disabled{cursor:default;opacity:.46}button:focus-visible,a:focus-visible,input:focus-visible,[data-slice]:focus-visible{outline:3px solid #9c5700;outline-offset:3px}button:hover:not(:disabled){background:#eff8ff}.primary{background:linear-gradient(170deg,#009dff,#0075e5)!important;color:white!important;box-shadow:inset 0 2px 2px #7fddff,0 3px 0 #0063ae2b;border:0;border-radius:999px;min-height:50px}.quiet{background:#fff8df}.subject{display:inline-block;padding:5px 14px;background:#def1ff;color:#0069bc;border-radius:999px;font-weight:800}.eyebrow{font-weight:700;color:#256787;font-size:.88rem;margin:10px 0}.muted{font-size:.83rem;line-height:1.7;color:#4f677d}h1{font-size:clamp(1.9rem,4vw,2.65rem);line-height:1.4;margin:8px 0 15px}h2{font-size:clamp(1.23rem,2.7vw,1.65rem);line-height:1.7}h3{font-size:1.15rem}rt{font-size:.46em;letter-spacing:.04em}main{max-width:1080px;margin:auto;padding:24px 22px 0}p{line-height:1.7}.welcome{display:grid;grid-template-columns:1fr 320px;align-items:center;gap:20px;padding:26px 34px;background:linear-gradient(115deg,#e9f8ff,#ffefd0);border-radius:28px}.welcome p{margin:10px 0 20px}.welcome .pizza{max-width:285px;margin:auto;transform:rotate(-8deg)}.course-list{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:24px 0 14px}.course{display:grid;gap:8px;text-align:left;padding:22px 20px;border-radius:24px;box-shadow:var(--dm-shadow-card);background:#fff8d9}.course:last-child{background:#e0f6ed}.course small{font-size:.8rem}.course strong{font-size:1.12rem}.course span{font-size:.86rem;font-weight:400}.home-links{display:flex;gap:12px}.home-links button{flex:1;background:#fff}.home-links small{display:block;font-weight:400}.setting{display:flex;align-items:center;gap:8px;margin:22px 0}.setting input{width:22px;height:22px}.play-head{display:flex;align-items:center;gap:12px;font-size:.9rem}.play-head strong{margin-left:auto;white-space:nowrap}.tickets{display:flex;list-style:none;gap:7px;margin:15px 0;padding:0}.tickets li{flex:1;text-align:center;border:1px solid #d9cfb6;border-radius:8px;background:#fffdf5;padding:5px 2px;font-size:.83rem}.tickets .done{background:#d8f1e6;border-color:#82b8a5}.tickets .current{border:2px solid #0078d6;background:#eaf7ff}.order-card,.panel{border:1px solid #d4e2e5;border-radius:24px;background:#fffef9;padding:22px;box-shadow:var(--dm-shadow-card)}.order-card>h2{text-align:center;margin:5px 0 12px}.order-card>#instruction{text-align:center;font-size:.88rem;margin:0 0 14px}.construction{display:grid;grid-template-columns:minmax(260px,1.05fr) minmax(220px,1fr);gap:24px;align-items:center}.worktop{border-radius:24px;padding:6px 12px 8px;background:repeating-linear-gradient(4deg,#f9ecd1 0 16px,#fff4df 18px 20px,#faefd8 23px 36px)}.worktop>p{text-align:center;font-size:.76rem;margin:0 0 3px}.pizza{width:100%;line-height:0}.pizza svg{width:100%;height:auto;display:block;overflow:visible}.pizza [data-slice]{cursor:pointer;transition:fill-opacity .12s}.pizza [data-slice]:hover{stroke:#006b95;stroke-width:3}.slice-check{pointer-events:none}.worktop .pizza{max-width:345px;margin:auto}.counter{display:flex;align-items:center;gap:12px;margin:8px 0}.counter button{width:52px;min-height:50px;font-size:1.4rem}.counter output{min-width:86px;text-align:center;font-size:1.3rem;font-weight:800}.amount{display:flex;align-items:center;gap:18px;margin:16px 0 22px}.fraction{display:inline-flex;vertical-align:middle;flex-direction:column;align-items:stretch;min-width:1.5em;text-align:center;font-size:1.4rem;font-weight:700;line-height:1.05;margin:0 5px}.fraction b{font-weight:inherit;padding:0 .2em .16em;border-bottom:2px solid currentColor}.fraction i{font-style:normal;padding:.14em .2em 0}.amount .fraction{font-size:1.9rem}.tools .delivery-actions>.primary{width:100%}.notice{background:#e2f3ed;border-radius:14px;padding:12px 16px;font-size:.9rem;border-left:4px solid #297969;min-height:46px;margin:16px 0 10px}.notice:empty{display:none}.notice[data-kind=wrong]{background:#fff1cf;border-color:#bb7200}.assist-actions{display:flex;gap:9px;margin-top:14px;flex-wrap:wrap}.assist-actions button{font-size:.85rem}.division-buttons{display:flex;gap:8px;margin:6px 0 16px}.division-buttons button[aria-pressed=true]{background:#d9efff;border:2px solid #0079cf}.feedback{background:#e0f4eb;border-radius:18px;padding:16px 20px;margin-top:16px}.feedback h3{font-size:1.55rem;margin:0 0 10px}.feedback p{margin:8px 0}.next-bar{position:sticky;bottom:0;padding:12px 0 max(12px,env(safe-area-inset-bottom));background:#fff9eef2;z-index:5}.next-bar button{width:100%;font-size:1.1rem}.comparison{--compare-size:150px;display:grid;grid-template-columns:1fr 2fr;align-items:start;gap:14px}.reference{display:grid;justify-items:center;gap:8px;padding:15px 4px;background:#fff2d4;border-radius:18px}.comparison-pizza{width:var(--compare-size);max-width:none}.pizza-options{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.pizza-options button{display:grid;justify-items:center;gap:3px;padding:9px 5px;border:2px solid #d4e4e6;background:#fff;border-radius:18px}.option-label{font-size:.83rem}.pizza-options button[aria-pressed=true]{border:3px solid #007bc9;padding:8px 4px;background:#e8f5ff}.pizza-options .solution{box-shadow:0 0 0 3px #62ac87 inset}.comparison .delivery-actions>.primary{grid-column:1/-1;width:100%}.balance{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:500px;margin:12px 0}.balance>div{padding:10px;border:1px solid #64a48c;border-radius:12px;background:#fffdf5;text-align:center}.balance .measure{height:10px;background:#eee9d7;border-radius:8px;overflow:hidden;margin-top:12px}.balance .measure>span{display:block;background:#197cab;height:100%}.result-counts,.stamps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.result-counts>div,.stamp{background:#fff8dd;border:1px solid #e5d18d;border-radius:24px;padding:16px;text-align:center}.result-counts strong{display:block;font-size:1.5rem}.result-counts span{font-size:.87rem}.result-actions{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0}.result-list{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.result-card{display:flex;align-items:center;gap:12px;padding:14px;border:1px solid #d5dedc;border-radius:18px}.result-card .pizza{flex:0 0 96px}.result-card p{margin:4px 0;font-size:.84rem}.result-card strong{font-size:.86rem}.stamp .stamp-icon{font-size:2.3rem;display:block}.stamp:not(.earned){background:#f6f5ee;border-style:dashed;color:#586a78}.stamp.earned{background:#e1f4eb}.stamp h3{margin:8px 0}.stamp p{font-size:.85rem}#course-records p{padding:9px;border-bottom:1px solid #ddd}.save-area{padding:14px 0;font-size:.85rem}.save-area p:empty{display:none}.save-area button{margin-right:8px}.footer{display:flex;justify-content:center;gap:26px;font-size:.8rem;padding:25px 0}.serving .pizza-food{animation:serve .38s ease-out}@keyframes serve{0%{transform:translateY(-14px)}65%{transform:translateY(2px)}100%{transform:translateY(0)}}[data-reduce-motion=true] *{animation:none!important;transition:none!important}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media(max-width:700px){main{padding:16px 14px 0}.welcome{grid-template-columns:1fr 160px;padding:22px}.welcome h1{font-size:1.9rem}.welcome>div:nth-child(2){align-self:center}.course-list{grid-template-columns:1fr}.course{padding:16px 20px;gap:4px}.construction{grid-template-columns:1fr;gap:10px}.worktop .pizza{max-width:270px}.tools{display:grid;grid-template-columns:1fr auto;column-gap:15px;align-items:center}.tools #cut-label{grid-column:1/-1;margin:2px 0;font-size:.88rem}.tools #count-label{font-size:.9rem}.counter{gap:6px}.counter button{min-height:46px;width:46px}.counter output{min-width:64px;font-size:1.05rem}.amount{margin:9px 0;font-size:.85rem}.amount .fraction{font-size:1.5rem}.tools .delivery-actions>.primary{grid-column:2;grid-row:3;padding:10px 12px;font-size:.9rem}.tools>.muted{grid-column:1/-1;margin:4px 0}.order-card{padding:16px}.comparison{--compare-size:125px;grid-template-columns:1fr;gap:10px}.reference{padding:7px 4px;grid-template-columns:1fr auto 1fr;align-items:center}.reference .comparison-pizza{grid-column:2;grid-row:1/3}.reference strong{font-size:.84rem}.reference #reference-fraction{grid-column:3;grid-row:1/3}.comparison-pizza{width:var(--compare-size)}.pizza-options{gap:8px}.pizza-options button{padding:6px 4px}.pizza-options button[aria-pressed=true]{padding:5px 3px}.pizza-options .fraction{font-size:1.15rem}.feedback{padding:14px}.feedback h3{font-size:1.4rem}.feedback p{font-size:.9rem}.result-counts{gap:7px}.result-counts>div{padding:12px 7px}.result-counts span{font-size:.78rem}.result-list{grid-template-columns:1fr}.stamps{grid-template-columns:1fr}.play-head{gap:7px;font-size:.8rem}.play-head button{padding:9px 10px}.next-bar{position:fixed;left:0;right:0;padding:10px 14px max(10px,env(safe-area-inset-bottom));border-top:1px solid #dbe3d6}body[data-screen=play]{padding-bottom:80px}.panel{padding:20px 15px}.footer{padding-bottom:24px}}
@media(max-width:390px){main{padding:12px 10px 0}.welcome{grid-template-columns:1fr;padding:20px;position:relative}.welcome>div:first-child{position:relative;z-index:1}.welcome>div:nth-child(2){position:absolute;right:5px;bottom:62px;width:130px;opacity:.22}.welcome p{font-size:.92rem}.welcome h1{font-size:1.8rem}.home-links{gap:8px}.home-links button{padding:10px 8px;font-size:.88rem}.order-card{padding:12px}.worktop .pizza{max-width:240px}.comparison{--compare-size:110px}.order-card>#instruction{font-size:.82rem}.assist-actions{gap:7px}.assist-actions button{padding:8px 10px;font-size:.8rem}.tools{gap:8px}.counter output{min-width:52px}.result-actions button{flex:1 1 130px}.tickets li{font-size:.76rem}.comparison .reference strong{font-size:.76rem}}
@media(min-width:1100px){.comparison{grid-template-columns:180px 1fr;align-items:stretch}.pizza-options{grid-template-columns:repeat(4,minmax(0,1fr))}.reference{align-content:start;gap:10px}.pizza-options button{align-content:start;gap:10px}}

.delivery-actions{display:contents}
/* Keep delivery reachable while the pizza and its controls stay in document flow. */
@media(max-width:700px){
 body[data-screen=play]{padding-bottom:calc(88px + env(safe-area-inset-bottom))}
 #play{scroll-padding-bottom:88px}
 #play .play-head{gap:6px}
 #play .tickets{margin:8px 0;gap:5px}
 #play .tickets li{line-height:1.3;padding:5px 2px}
 #play .order-card{padding:12px}
 #play #order-label{display:block;margin:0;line-height:1.4}
 #play #order{margin:4px 0 8px;line-height:1.35}
 #play #instruction{margin:0 0 8px;line-height:1.5}
 #play .construction{gap:8px}
 #play .worktop{padding:4px 8px 6px}
 #play .worktop .pizza{max-width:clamp(160px,calc(100svh - 470px),270px)}
 #play .worktop>p{margin:0;line-height:1.4}
 #play .tools{gap:4px 10px}
 #play .tools #cut-label{margin:0;line-height:1.4;font-size:.82rem}
 #play .counter{margin:0;justify-self:end}
 #play .counter button{width:46px;min-height:46px;padding:0;line-height:1.2}
 #play .tools>.muted{display:none}
 #play .delivery-actions{position:fixed;left:0;right:0;bottom:0;z-index:5;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:12px;padding:8px 14px max(8px,env(safe-area-inset-bottom));border-top:1px solid #dbe3d6;background:#fff9ee}
 #play .delivery-actions .amount{margin:0;gap:8px;line-height:1.3;white-space:nowrap}
 #play .delivery-actions .fraction{font-size:1.3rem}
 #play .delivery-actions>.primary{grid-row:auto;grid-column:auto;width:100%;min-height:50px;padding:10px 12px;font-size:.95rem}
 #play .comparison-delivery{grid-template-columns:1fr}
 #play[data-phase=feedback] .delivery-actions{display:none}
 #play :is(.notice,.feedback){scroll-margin-bottom:calc(88px + env(safe-area-inset-bottom))}
}
@media(max-width:700px) and (max-height:650px){
 body[data-screen=play] main{padding-top:8px}
 #play .play-head button{min-height:44px;padding:8px 10px}
 #play .tickets{margin:6px 0}
 #play .order-card{padding:10px}
 #play #order-label{display:none}
 #play #order{margin:0 0 6px}
 #play #order .fraction{font-size:1.2rem}
}
@media(max-width:700px) and (max-height:600px){
 #play .worktop>p{display:none}
}