:root{--ink:#284c46;--green:#387967;--cream:#fffaf0;--gold:#edb65c}*{box-sizing:border-box}body{margin:0;background:#f4f2e8;color:var(--ink);font-family:system-ui,'Yu Gothic',sans-serif}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}button:disabled{cursor:default;opacity:.42}button:focus-visible{outline:4px solid #d77737;outline-offset:3px}main{max-width:1120px;margin:auto;padding:26px 20px 40px}header{display:flex;align-items:center;justify-content:space-between;gap:15px}h1{font-size:clamp(25px,4vw,40px);margin:8px 0}h2{margin:5px 0 10px;font-size:clamp(20px,3vw,28px)}p{line-height:1.65}.eyebrow{font-size:10px;letter-spacing:3px}.quiet,.pill{border:1px solid #cfdace;background:#fffaf1;padding:11px 16px;border-radius:24px;min-height:44px}.choices{display:flex;gap:8px;flex-wrap:wrap;margin:15px 0}.pill[aria-pressed=true]{background:var(--ink);color:white}.steps{display:flex;gap:8px;margin:18px 0}.steps span{background:#e4e8db;border-radius:15px;padding:9px 15px;font-weight:700}.steps .active{background:#f7d999}.status{min-height:32px;font-weight:650;margin:8px 0}.layout{display:grid;grid-template-columns:minmax(0,1fr) 265px;gap:20px}.scene{border-radius:30px;background:#e0ebd9;overflow:hidden;border:6px solid #fff8e6;box-shadow:0 10px 28px #45655212;position:relative}.map{aspect-ratio:1.45;position:relative;background:radial-gradient(ellipse at 5% 85%,#b2d9dc 0 13%,transparent 13.5%),radial-gradient(ellipse at 80% 10%,#a8c89b 0 17%,transparent 17.5%),#dfead0}.map.town1{background:radial-gradient(ellipse at 90% 80%,#efd4da 0 22%,transparent 22.5%),#e8eacb}.map.town2{background:radial-gradient(ellipse at 10% 80%,#d1d7ed 0 20%,transparent 20.5%),#f2dfbe}.roads{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.road-dot{position:absolute;width:9%;height:13%;transform:translate(-50%,-50%);border:0;background:transparent;border-radius:50%;z-index:3}.road-dot.near{background:#fffaf070;border:2px dashed #92aa87}.road-dot.hinted{background:#f8d879;border:3px solid #b17625}.building{position:absolute;width:24%;transform:translate(-50%,-82%);pointer-events:none;z-index:2}.building img{display:block;width:100%}.building .address{display:block;margin:auto;background:#fffdf2;border-radius:20px;text-align:center;font-size:12px;font-weight:750;width:max-content;max-width:100%;padding:3px 9px}.building.delivered{filter:saturate(.65)}.truck{position:absolute;width:16%;transform:translate(-50%,-70%);z-index:5;pointer-events:none;transition:left .2s ease,top .2s ease}.truck img{width:100%;display:block}.truck.left img{transform:scaleX(-1)}.map-caption{position:absolute;bottom:3%;left:4%;font-size:12px;letter-spacing:2px;background:#ffffff80;border-radius:20px;padding:5px 12px}.sidebar,.depot{padding:20px;background:#fffdf5;border-radius:24px}.sidebar h2{font-size:19px}.manifest{display:flex;flex-direction:column;gap:8px}.order{display:flex;gap:8px;align-items:center;padding:9px;background:#f1f1e6;border-radius:16px;min-height:62px}.order img{width:55px;height:45px;object-fit:contain}.order.complete{background:#dcecd8}.order.target{outline:2px solid var(--gold)}.order b{font-size:14px}.order small{display:block;font-size:12px;margin-top:4px}.pad{display:grid;grid-template-columns:repeat(3,54px);gap:7px;justify-content:center;margin:18px 0}.pad button{border:0;border-bottom:4px solid #bbcbbd;border-radius:16px;background:#e7eee1;font-size:24px;min-height:54px}.primary{border:0;border-bottom:5px solid #255446;background:var(--green);color:white;padding:14px 25px;border-radius:18px;font-weight:800;min-height:55px}.depot-top{display:flex;align-items:center;gap:15px}.depot-top img{width:150px;max-width:35%}.cargo-drop{min-height:165px;position:relative;border:3px dashed #a9bd9e;border-radius:24px;background:#eef3e5;padding:14px;text-align:center;margin:15px 0}.cargo-drop>img{width:190px;max-width:65%;height:105px;object-fit:contain}.cargo-badges{display:flex;justify-content:center;gap:6px}.cargo-badges span{padding:5px 10px;background:#fff7df;border-radius:14px;font-size:12px}.parcels{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:16px 0}.parcel{position:relative;width:125px;min-height:105px;border:2px solid #be9463;border-bottom:7px solid #b88d5d;border-radius:14px;background:linear-gradient(90deg,transparent 42%,#f9e7c3 42% 55%,transparent 55%),#d9b581;padding:8px;touch-action:none;box-shadow:0 5px 12px #70523513}.parcel.selected{outline:4px solid #dc863a;outline-offset:3px}.parcel svg{display:block;width:50px;height:48px;margin:auto;pointer-events:none}.parcel b{display:block;background:#fff6df;border-radius:9px;padding:4px;font-size:13px}.float-parcel{position:fixed;pointer-events:none;z-index:100;opacity:.9;transform:translate(-50%,-50%) rotate(-6deg);margin:0}.doorstage{text-align:center;background:#f3edda;border-radius:25px;padding:18px}.doorstage>img{width:240px;max-width:65%;height:235px;object-fit:contain}.handoff-drop{display:block;margin:0 auto;max-width:320px;width:100%;padding:18px;border:3px dashed #a4b791;border-radius:20px;background:#fffbea;min-height:85px}.handoff-drop svg{width:45px;height:45px;vertical-align:middle}.win{text-align:center;background:#fff8de;padding:30px;border-radius:26px}.win img{width:200px}.stamp{display:inline-flex;align-items:center;justify-content:center;width:85px;height:85px;border:3px double #557d68;border-radius:50%;background:#e3eddc;font-weight:700;text-align:center;font-size:13px;transform:rotate(-7deg);margin:10px}.stamp.locked{background:#f0ede5;color:#a7ada0;border-color:#cdd0c4;transform:none}details{margin-top:22px}summary{cursor:pointer;padding:15px;background:#e9eade;border-radius:15px;font-weight:700}.album-grid{display:flex;flex-wrap:wrap;justify-content:center}.confirm{position:fixed;inset:0;background:#173d3aa8;z-index:90;display:grid;place-items:center;padding:20px}.confirm[hidden],[hidden]{display:none!important}.confirm section{background:#fffaf0;border-radius:25px;padding:28px;max-width:440px}.footer-note{font-size:12px;color:#667e6a}.save-warning{color:#945628}.decor-flower{position:absolute;color:#c99198;font-size:26px;pointer-events:none}.art-error{background:#ffe0bd;padding:12px;border-radius:12px}.family-guide{max-width:1080px;margin:auto}.asset-images{display:none}@media(max-width:700px){main{padding:20px 10px}header{align-items:flex-start}header .quiet{font-size:12px;padding:9px}.layout{grid-template-columns:1fr}.sidebar{padding:12px}.manifest{flex-direction:row;flex-wrap:wrap}.order{flex:1;min-width:95px;padding:6px;gap:3px}.order img{width:37px}.order b{font-size:12px}.order small{font-size:10px}.steps span{padding:8px 10px;font-size:12px}.pad{margin:12px auto}.building .address{font-size:9px;padding:2px 5px}.map{aspect-ratio:1.12}.parcel{width:95px;min-height:99px}.parcel b{font-size:11px}.depot{padding:14px}.map-caption{font-size:10px}.depot-top img{width:115px}.quiet{font-size:13px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
html[lang=ja] .copy-en,html[lang=en] .copy-ja{display:none}


.cargo-drop{display:block;width:100%;background:radial-gradient(ellipse at 50% 70%,#d8e4c9 0 28%,transparent 29%),#eef3e5}.cargo-drop>img{width:270px;height:170px;max-width:80%}.sidebar{align-self:start}.map-decoration{position:absolute;inset:0;pointer-events:none}.map-decoration img{position:absolute;opacity:.8}.win .stamp{animation:stamp-in .5s ease-out}.doorstage>img{animation:hello .4s ease-out}@keyframes stamp-in{from{transform:scale(1.4) rotate(-20deg);opacity:0}to{transform:scale(1) rotate(-7deg);opacity:1}}@keyframes hello{from{transform:translateY(12px);opacity:.5}to{transform:translateY(0);opacity:1}}#play{scroll-margin-top:12px}@media(max-width:700px){.depot .parcels{gap:7px}.depot-top p{font-size:13px}.depot-top h2{font-size:20px}.cargo-drop>img{height:135px}.map+.sidebar{margin:0}.layout:has(.depot) .sidebar{grid-row:1}.layout:has(.scene){gap:10px}.sidebar:has(.pad){display:grid;grid-template-columns:1fr auto;gap:8px}.sidebar:has(.pad)>h2{display:none}.sidebar:has(.pad) .manifest{align-content:start}.sidebar:has(.pad) .pad{margin:0}.sidebar:has(.pad) #hint{grid-column:1/-1}.order{flex-basis:90px}}

/* Houses have reserved rows; labels and driving targets never share a box. */
.map{aspect-ratio:1.12}.building{width:22%;height:25%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:2px}
.building img{width:100%;height:calc(100% - 23px);object-fit:contain;min-height:0}.building .address{line-height:16px;font-size:11px;padding:2px 7px;flex:none;white-space:nowrap}
.truck{width:14%;transform:translate(-50%,-55%)}.map-caption{top:30%;bottom:auto;left:36%;max-width:28%;font-size:10px;letter-spacing:0;text-align:center;padding:4px;pointer-events:none}
.map-decoration{display:none}.map.town3{background:radial-gradient(ellipse at 50% 5%,#e4b9a0,transparent 55%),#dfebcf}.map.town4{background:radial-gradient(ellipse at 50% 5%,#edcfe0,transparent 55%),#e6ecd8}.map.town5{background:radial-gradient(ellipse at 50% 5%,#b6d8e2,transparent 55%),#e9e2c6}
.parcel .goods-art{display:block;width:78px;height:78px;object-fit:contain;margin:auto;pointer-events:none;filter:drop-shadow(0 3px 2px #70523520)}.parcel{width:140px;min-height:130px;background:#fbf4e2;border-color:#d3b788;border-bottom-color:#bea071}.handoff-drop .goods-art{width:75px;height:75px;object-fit:contain;vertical-align:middle}.order .goods-art{width:55px;height:55px;flex:none;object-fit:contain}.cargo-badges{flex-wrap:wrap}
@media(max-width:700px){.building .address{font-size:10px;padding:1px 5px;line-height:16px}.building img{height:calc(100% - 20px)}.map{min-height:320px}.parcel{width:95px;min-height:116px}.parcel .goods-art{width:67px;height:67px}.order .goods-art{width:38px;height:43px}.map-caption{font-size:9px}}

/* Keep road decoration beneath every interactive target. */
.village-art{z-index:0}.road-dot.near{border:0;background:transparent}.road-dot.near:after{content:'';display:block;margin:auto;width:12px;height:12px;border-radius:50%;background:#fffcf0;border:2px solid #739778;box-shadow:0 1px 3px #526b4c30}.road-dot.hinted{border:0;background:transparent}.road-dot.hinted:after{background:#f6c867;border:3px solid #ad792c;width:18px;height:18px}.building .address{border:1px solid #d5ddbf;box-shadow:0 2px 4px #57724712}.scene{box-shadow:0 8px 25px #5375441a}.map-caption{background:#fffaf0e6;border:1px solid #d6d4b6;padding:4px 8px;border-radius:7px}
