*{box-sizing:border-box} :root{font-family:"Microsoft YaHei","PingFang SC",sans-serif;color:#f8edce;background:#071913;font-synthesis:none;-webkit-tap-highlight-color:transparent;--ink:#2c1609;--gold:#e8b94c;--dock-h:260px}body{margin:0;overflow:hidden;background:radial-gradient(ellipse at center,#244535,#071913);touch-action:none}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;border:0}button:focus-visible{outline:3px solid #fff2ae;outline-offset:2px}button:active:not(:disabled){filter:brightness(1.14);transform:translateY(1px)}[hidden]{display:none!important}#app{width:100%;max-width:480px;height:100dvh;height:100svh;margin:auto;position:relative;overflow:hidden;background:#10281d;box-shadow:0 0 100px #000a;isolation:isolate}#app:after{content:"";position:absolute;inset:0;pointer-events:none;border:1px solid #a77d3c77;z-index:30}.topbar,.statusbar,.hero-hud{position:relative;z-index:6;background:#08261eea}.topbar{height:43px;padding:4px 7px;display:flex;gap:4px;align-items:center;border-bottom:2px solid #c6953c}.brand{white-space:nowrap;display:flex;gap:4px;align-items:center;color:#ffe193;font:700 21px "KaiTi",serif;text-shadow:1px 2px #3a1d06,-1px -1px #7b4318}.brand-mark{font-size:29px;color:#ffcc5e;line-height:1}.wallet,.day-count{background:linear-gradient(#0b3125,#061a15);border:1px solid #b78c38;border-radius:3px;min-height:31px;display:flex;align-items:center;justify-content:center;gap:4px;padding:2px 6px}.wallet{margin-left:auto}.wallet b{font-size:19px}.coin-icon{display:inline-block;width:23px;height:25px;background-size:contain;background-repeat:no-repeat;background-position:center}.day-count{white-space:nowrap;font:700 16px "KaiTi",serif}.day-count>span{font-size:23px;color:#ffd94c}#phase-label{display:none}.top-actions{display:flex;gap:2px}.icon-btn{background:#173b2c;border:1px solid #b99148;width:26px;height:30px;border-radius:3px;font-weight:700;font-size:16px}.utility{position:absolute;top:128px;right:8px;width:25px;height:25px;opacity:.86;z-index:7}#sound{right:38px}.statusbar{height:31px;display:flex;align-items:center;gap:7px;padding:3px 9px;border-bottom:1px solid #b99148;font:700 13px "KaiTi",serif}.base-icon{font-size:23px;color:#ffd66d}#base-health{white-space:nowrap;font:12px "Microsoft YaHei",sans-serif}.health-track{height:12px;flex:1;background:#151f1b;border:1px solid #807449;border-radius:3px;overflow:hidden}.health-track i{height:100%;width:100%;display:block;background:linear-gradient(#69f42a,#27bb0a);box-shadow:inset 0 2px #c4ff6c44;transition:width .18s}.hero-hud{height:42px;display:flex;gap:4px;align-items:stretch;padding:2px 7px 3px;border-bottom:2px solid #ac7d2a}.hero-pill{width:52%;display:flex;align-items:center;gap:4px;border:1px solid #bd9445;padding:2px;background:#071e19}.hero-pill>img{height:34px;width:31px;object-fit:contain}.hero-pill>div{min-width:0;flex:1;position:relative}.hero-pill b{font:700 12px "KaiTi",serif;white-space:nowrap}.hero-pill b span{padding-left:3px;font:11px Georgia,serif}.hero-health{height:8px;background:#1c2520;border:1px solid #6b5c3a;border-radius:3px;overflow:hidden;margin-top:3px}.hero-health i{height:100%;width:100%;display:block;background:linear-gradient(#ff4f36,#c3150b)}.hero-pill small{position:absolute;bottom:0;left:0;right:0;text-align:center;font:8px/8px sans-serif;white-space:nowrap;text-shadow:0 1px #000}.materials{flex:1;border:1px solid #b68d3f;padding:3px 5px;display:flex;flex-direction:column;justify-content:center;gap:2px;min-width:0;background:#071e19}#resource-info{font-size:11px;white-space:nowrap;color:#fcefc6;display:flex;align-items:center;justify-content:space-between;gap:5px}#resource-info>span{display:flex;align-items:center;gap:3px}#resource-info img{width:19px;height:19px;object-fit:contain}#resource-info b{font-size:13px}#wave-count{font-size:9px;color:#d6c695;white-space:nowrap}#wave-track{height:4px;background:#162b24;display:none;border:1px solid #8a7750}#wave-track i{height:100%;display:block;background:#ffbd23;width:0}.night #wave-track{display:block}.night #wave-count{font-size:10px}#field{position:absolute;left:0;right:0;top:116px;bottom:0;overflow:hidden;background:#143d2a}#game{display:block;width:100%;height:100%;touch-action:none}#slots{position:absolute;inset:0;pointer-events:none}.resource-marker,.tower-target{position:absolute;transform:translate(-50%,-50%);pointer-events:auto}.resource-marker{background:#07322beb;border:1px solid #bca05a;border-radius:3px;padding:4px 7px;white-space:nowrap;font:10px "KaiTi",serif;box-shadow:0 2px 5px #0006}.resource-marker.selected{color:#ffda6c;border-color:#ffe286}.tower-target{width:47px;height:47px;border-radius:50%;background:transparent;box-shadow:none}.tower-target.selected{border:1px solid #ffdc75;box-shadow:0 0 5px #ffca4766}.tower-target:active,.resource-marker:active{transform:translate(-50%,-50%)}.field-top{position:absolute;left:8px;top:7px;font-size:9px;pointer-events:none;color:#ebdfba;text-shadow:0 1px 2px #000}#wave-tag{background:#173e2cc9;border:1px solid #9d874d88;padding:4px 7px;border-radius:2px}#map-chip{position:absolute;top:32px;left:8px;font-size:9px;padding:3px 6px;color:#eee1b4;background:#0a281dbc;pointer-events:none}#banner{position:absolute;top:32%;left:50%;transform:translate(-50%,-50%);width:90%;text-align:center;pointer-events:none;opacity:0;transition:opacity .2s;font:700 24px "KaiTi",serif;color:#ffe298;text-shadow:0 2px 4px #1a0e02;background:linear-gradient(90deg,transparent,#08301cdd,transparent);padding:15px 0}#banner.show{opacity:1}#field-tip{position:absolute;bottom:calc(var(--dock-h) + 5px);left:102px;right:102px;text-align:center;font-size:9px;background:#0e311eb8;padding:3px;color:#fff0bd;pointer-events:none}#joystick{position:absolute;left:10px;bottom:calc(var(--dock-h) + 11px);width:85px;height:85px;background:url("assets/topdown-v4/ui-joystick.png") center/contain no-repeat;touch-action:none;z-index:4;display:none}#stick{position:absolute;width:30px;height:30px;top:27px;left:27px;border-radius:50%;background:radial-gradient(circle at 40% 30%,#ffd865,#b8801b 75%);border:1px solid #fbd87a;box-shadow:0 2px 5px #0008}#joystick>span{position:absolute;left:20px;right:20px;bottom:-5px;text-align:center;background:#173728ef;border:1px solid #ae914f;padding:2px;font:10px "KaiTi",serif}#skill{position:absolute;right:9px;bottom:calc(var(--dock-h) + 9px);width:85px;height:85px;z-index:4;display:none;background:url("assets/topdown-v4/ui-skill.png") center/contain no-repeat;padding:0}#skill b{position:absolute;bottom:-5px;left:6px;right:6px;background:#2a2b16ec;border:1px solid #b3974f;padding:2px;font:11px "KaiTi",serif}#skill small{position:absolute;right:0;top:0;min-width:23px;background:#132d1df2;border:1px solid #cfb16c;border-radius:50%;padding:5px;font-size:10px}#skill:disabled{filter:saturate(.25) brightness(.8);cursor:default}.playing #joystick,.playing #skill{display:block}#dock{position:absolute;bottom:0;left:0;right:0;padding:0 10px max(6px,env(safe-area-inset-bottom));z-index:5;background:#0c3428f7;border-top:2px solid #ac8436;box-shadow:0 -3px 8px #10201388}.dock-title{display:flex;align-items:center;justify-content:space-between;height:31px;gap:6px}.dock-title>div:first-child{background:url("assets/topdown-v4/ui-parchment.png") center/100% 100% no-repeat;padding:6px 25px;color:#2c190e;flex:1;text-align:center}.dock-title b{font:700 19px "KaiTi",serif}.eyebrow{display:none}#selection-label{display:none}#close-dock{font-size:20px;background:transparent;color:#f2d597;width:26px;height:26px}.tabs{display:flex;margin:1px 0 5px;gap:1px}.tabs button{display:flex;align-items:center;justify-content:center;gap:2px;white-space:nowrap;min-width:0;flex:1;height:33px;background:url("assets/topdown-v4/ui-teal.png") center/100% 100% no-repeat;font:700 14px "KaiTi",serif;padding:5px 0}.tabs button.active{background-image:url("assets/topdown-v4/ui-gold.png");color:var(--ink)}#shop{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;min-height:107px} .shop-card{position:relative;min-width:0;min-height:117px;background:url("assets/topdown-v4/ui-parchment.png") center/100% 100% no-repeat;padding:8px 5px;color:var(--ink);display:flex;align-items:center;flex-direction:column;justify-content:space-between;overflow:hidden}.shop-card img{width:74px;height:66px;object-fit:contain;order:2}.shop-card b{font:700 14px "KaiTi",serif;order:1;white-space:nowrap}.shop-card small{display:none;font-size:9px;color:#4f3f24;order:3}.shop-card .price{order:4;background:#f1c84b;border:1px solid #a8731f;border-radius:2px;width:87%;font-size:12px;font-weight:700;padding:1px;white-space:nowrap}.shop-card:disabled{filter:grayscale(.85);opacity:.83;cursor:default}.shop-card.chosen{filter:brightness(1.15);outline:1px solid #ffe07d}.text-icon{font-size:30px;color:#7c560d;order:2}.day-footer{display:flex;flex-direction:column;align-items:stretch;gap:1px;margin-top:4px}.day-footer>small{font-size:10px;text-align:center;color:#ece2b6;padding:2px}.gold-btn,#confirm-build{min-height:45px;background:url("assets/topdown-v4/ui-gold.png") center/100% 100% no-repeat;color:#2b1408;padding:8px 24px;font:700 21px "KaiTi",serif;text-shadow:0 1px #fff2ba70}.gold-btn span{margin-left:15px}.gold-btn:disabled,#confirm-build:disabled{background-image:url("assets/topdown-v4/ui-disabled.png");color:#eee;cursor:default}#workshop-toggle{display:none;position:absolute;bottom:14px;left:50%;transform:translateX(-50%);z-index:5;min-height:36px;font-size:16px;min-width:155px}.dock-collapsed #dock{display:none}.dock-collapsed #workshop-toggle{display:block}.dock-collapsed{--dock-h:0px}.night{--dock-h:0px}.night #dock{display:none}.night #workshop-toggle{display:none}.tower-detail{grid-column:1/-1;min-width:0;display:grid;grid-template-columns:75px minmax(0,1fr);align-items:center;gap:5px;padding:9px 10px;color:#2a1c0b;background:url("assets/topdown-v4/ui-parchment.png") center/100% 100% no-repeat}.tower-detail>img,.tower-detail>.tower-portrait{width:75px;height:75px;object-fit:contain}.tower-detail>div{font-size:12px;line-height:1.8;min-width:0}.detail-actions{grid-column:1/-1;display:grid;grid-template-columns:1fr 1.4fr 1fr;gap:4px}.tower-detail>button{grid-column:1/-1}.detail-actions button{font-size:11px!important;padding:4px!important;line-height:1.4}.detail-actions button.sell{filter:none;background-color:#813521}.tower-detail b{font:700 17px "KaiTi",serif}.tower-detail button{background:url("assets/topdown-v4/ui-teal.png") center/100% 100% no-repeat;min-height:34px;padding:5px 13px;font-size:12px;color:#f8eac7}.tower-detail button:disabled{background-image:url("assets/topdown-v4/ui-disabled.png");color:#eee}.tower-detail .sell{color:#fff1dd}.resource-desc{grid-column:span 2;padding:9px 5px;color:#f3e4bf;font-size:11px}.resource-desc b{font-size:14px}.resource-desc small{display:block;font-size:11px;line-height:1.8;margin-top:7px}.shop-hint{grid-column:1/-1;font-size:12px;line-height:1.9;text-align:center;margin:10px 0;color:#efe0b4}.extras{grid-column:1/-1;display:flex;gap:4px}.extras button{flex:1;background:url("assets/topdown-v4/ui-teal.png") center/100% 100% no-repeat;min-height:34px;padding:7px;font-size:11px}.territory-note{grid-column:1/-1;font-size:10px;line-height:1.5;text-align:center}.territory-shop .shop-card{min-height:95px}#placement-bar{position:absolute;bottom:10px;left:8px;right:8px;background:url("assets/topdown-v4/ui-parchment.png") center/100% 100% no-repeat;z-index:8;color:var(--ink);padding:16px 13px;text-align:center}#placement-label{font:700 17px "KaiTi",serif;display:block}#placement-bar small{font-size:10px;display:block;margin:6px 0}.placement-actions{display:flex;gap:5px}.placement-actions button{flex:1;font-size:16px;min-height:47px;white-space:nowrap}#confirm-build{flex:1.65;font-size:15px;padding:6px!important}.placement-actions #cancel-build{background:url("assets/topdown-v4/ui-teal.png") center/100% 100% no-repeat;color:#f5e7c4}#app.placing #dock,#app.placing #workshop-toggle,#app.placing #joystick,#app.placing #skill,#app.placing #field-tip{display:none}.invalid #placement-label{color:#9b2116}#toast{position:absolute;z-index:22;left:50%;bottom:calc(var(--dock-h) + 100px);transform:translateX(-50%);opacity:0;max-width:94%;width:max-content;background:#08251eed;border:1px solid #c69e50;border-radius:4px;padding:8px 12px;font-size:12px;text-align:center;color:#ffe4a0;pointer-events:none;transition:opacity .2s;line-height:1.5}#toast.show{opacity:1}.overlay{position:absolute;inset:0;z-index:15;background:#031511a8;display:flex;align-items:center;justify-content:center;padding:22px;backdrop-filter:blur(2px)}.overlay.hidden{display:none}.modal{width:100%;max-height:90%;overflow:auto;background:#0d3026;border:3px double #c79944;box-shadow:0 0 0 5px #183921,0 15px 60px #0008;padding:20px 18px;text-align:center;touch-action:pan-y;border-radius:7px}.modal .overline{font:9px Georgia,serif;letter-spacing:2px;color:#dbc18c}.modal h1{font:700 35px/1.3 "KaiTi",serif;color:#ffe094;letter-spacing:2px;margin:12px 0;text-shadow:0 2px #4f270b}.modal p{font-size:12px;line-height:1.9;margin:10px 0;color:#eedfba}.modal .gold-btn,.modal .secondary{width:100%;margin-top:9px}.modal .secondary{min-height:46px;background:url("assets/topdown-v4/ui-teal.png") center/100% 100% no-repeat;padding:9px 17px;font:700 19px "KaiTi",serif}.modal .fine{font-size:9px;color:#d3c39d}.modal .hero-art{display:none}.modal .subtitle{font:700 16px "KaiTi",serif;letter-spacing:2px}.modal ul{list-style:none;padding:0;font-size:12px;line-height:1.9}.divider{font:13px "KaiTi",serif;color:#ddc991;margin:10px 0}.result-emblem{font-size:45px;color:#ffd74e}.result-stats{display:flex;flex-direction:column;gap:6px;background:url("assets/topdown-v4/ui-parchment.png") center/100% 100% no-repeat;color:#311b0b;padding:18px;margin:10px 0}.result-stats>div{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #a0772f55;padding:6px}.result-stats b{font:25px Georgia,serif;order:2}.result-stats small{font:700 16px "KaiTi",serif;order:1}.help-lines{text-align:left;display:grid;grid-template-columns:1fr 1fr;gap:9px}.help-lines p{font-size:11px;line-height:1.7;margin:0}.help-lines b{font:700 17px "KaiTi",serif;color:#ffda8a}.help-lines p:last-child{grid-column:1/-1}.night-bottom{display:flex;justify-content:space-between;font-size:10px}#app[data-screen=start] .topbar,#app[data-screen=start] .statusbar,#app[data-screen=start] .hero-hud,#app[data-screen=start] #dock,#app[data-screen=start] #map-chip,#app[data-screen=start] .field-top{display:none}#app[data-screen=start] #field{top:0}#app[data-screen=start] .overlay{background:transparent;backdrop-filter:none;padding:0;align-items:stretch}#app[data-screen=start] .modal{max-height:none;max-width:none;border:0;border-radius:0;background:none;box-shadow:none;overflow:hidden;padding:0 20px;position:relative;display:flex;flex-direction:column;align-items:center}#app[data-screen=start] .modal h1{width:100%;margin:28px 0 0;font-size:47px;background:url("assets/topdown-v4/ui-hud.png") center/100% 100% no-repeat;padding:21px 8px 18px;letter-spacing:3px}#app[data-screen=start] .modal .subtitle{margin:0;background:#153a29e3;border:1px solid #b68f49;padding:6px 25px;border-radius:3px;color:#fff1d0}#app[data-screen=start] .overline{display:none}.title-spacer{flex:1}.title-menu{width:100%;margin-bottom:15px;padding:7px 0;background:#082c2077}#app[data-screen=start] .modal .gold-btn{font-size:24px;min-height:57px}#app[data-screen=start] .modal .secondary{font-size:22px;min-height:54px}.title-promises{display:flex;justify-content:space-around;font:12px "KaiTi",serif;color:#ffedbb;margin:9px 0}.title-promises span{border-top:1px solid #c49d54;padding:7px 4px 0}#app[data-screen=result] .modal{align-self:flex-end;margin-bottom:15px}#app[data-screen=result] .overlay{background:#03151135;backdrop-filter:none}#app[data-screen=loading] .modal{min-height:180px}.respawn-notice{background:#0c3025ed;border:1px solid #c49d5c;padding:10px;font:18px "KaiTi",serif}
/* Nine-slice components keep the approved corners and leaves in proportion. */
.gold-btn,#confirm-build{background:none;border-style:solid;border-width:13px 24px;border-image:url("assets/topdown-v4/ui-gold.png") 58 82 fill stretch;padding:0 4px;white-space:nowrap;line-height:1}
.gold-btn:disabled,#confirm-build:disabled{background:none;border-image-source:url("assets/topdown-v4/ui-disabled.png")}
.tabs button,.modal .secondary,.tower-detail button,.extras button,.placement-actions #cancel-build{background:none;border-style:solid;border-width:8px 10px;border-image:url("assets/topdown-v4/ui-teal.png") 58 82 fill stretch;padding:0 3px;line-height:1.2}
.tabs button.active{background:none;border-image-source:url("assets/topdown-v4/ui-gold.png")}
.tower-detail button:disabled{background:none;border-image-source:url("assets/topdown-v4/ui-disabled.png")}
.shop-card,.tower-detail,.result-stats,#placement-bar,.dock-title>div:first-child{background:none;border:14px solid transparent;border-image:url("assets/topdown-v4/ui-parchment.png") 53 fill stretch;padding:3px 5px}
.dock-title>div:first-child{border-width:9px 18px;padding:0;height:34px;display:flex;align-items:center;justify-content:center}
.dock-title{height:34px}
#placement-bar{border-width:20px;padding:2px 0 0}
#placement-label{font-size:16px;line-height:1.6}
#app[data-screen=start] .modal .gold-btn{padding:1px 8px;line-height:1;min-height:55px;font-weight:900}
#app[data-panel=towers-detail] .day-footer{display:none}


.brand-mark img{display:block;width:28px;height:28px;object-fit:contain}
#phase-icon img{width:23px;height:23px;display:block;object-fit:contain}
.tabs button img{width:17px;height:17px;object-fit:contain}
.placing .tower-target{pointer-events:none}
.night .tower-target{pointer-events:none}
.training-shop{grid-template-columns:1fr!important;gap:4px!important}
.training-shop .shop-card{display:grid;grid-template-columns:39px minmax(0,1fr) 75px;grid-template-rows:18px 18px;gap:0 6px;min-height:58px;padding:2px 4px;border-width:10px;justify-content:normal}
.training-shop .shop-card img{grid-column:1;grid-row:1/3;width:36px;height:36px}
.training-shop .shop-card b{grid-column:2;grid-row:1;text-align:left;font-size:14px}
.training-shop .shop-card small{display:block;grid-column:2;grid-row:2;text-align:left;font-size:10px;margin:0}
.training-shop .shop-card .price{grid-column:3;grid-row:1/3;width:100%;padding:7px 2px;font-size:12px}
.training-xp{height:29px;position:relative;background:#102a21;border:1px solid #9e7d3e;text-align:left;padding:3px 6px;font:12px "KaiTi",serif;overflow:hidden}
.training-xp span{float:right;font:10px sans-serif}.training-xp i{position:absolute;bottom:0;left:0;height:4px;background:#edc142}
.training-shop .extras{grid-column:1;gap:4px}.training-shop .extras button{line-height:1.4;font-size:10px;min-height:42px}
.extras button:disabled{border-image-source:url("assets/topdown-v4/ui-disabled.png");color:#d1cfca}
#app[data-panel=hero-catalog] .day-footer{display:none}
.field-top{display:none}
#map-chip{top:7px;font-size:11px;padding:4px 7px;border:1px solid #b19b6380}
.night #map-chip{display:none}

/* The approved gold-and-leaf frame is shared by live HUD panels and dialogs. */
button,h1,h2,h3,.brand,.dock-title,.requirement,.resource-yield,.tower-detail,.base-summary,.statusbar,.day-count{font-synthesis:weight}
body{touch-action:manipulation;overscroll-behavior:none}
#app[data-screen=result] #dock,#app[data-screen=result] #workshop-toggle,#app[data-screen=result] #joystick,#app[data-screen=result] #skill,#app[data-screen=result] #map-chip,#app[data-screen=result] #field-tip,#app[data-screen=result] .utility{display:none}#app[data-screen=result] .overlay{padding:15px;background:transparent;backdrop-filter:none;align-items:stretch}#app[data-screen=result] .modal{display:flex;flex-direction:column;max-height:none;border:0;box-shadow:none;padding:0;overflow:hidden;align-self:stretch;margin:0;background:none}#app[data-screen=result] .result-header{border:14px solid transparent;border-image:url("assets/topdown-v4/ui-hud.png") 55 78 fill stretch;padding:4px 0 5px;text-align:center}#app[data-screen=result] .result-header h1{font-size:48px;letter-spacing:5px;color:#ffd15d;margin:2px 0;text-shadow:0 3px #7e2c08,-1px -1px #ffe9a2}#app[data-screen=result] .result-header p{font:700 17px "KaiTi",serif;color:#ffecb2;margin:3px 0}.result-spacer{flex:1;min-height:25px}.result-bottom{flex:none}.result-bottom .result-stats{margin:0;border-width:18px;padding:1px 6px}.result-stats>div{gap:8px;padding:5px 2px}.result-stats img{width:38px;height:38px;object-fit:contain;order:0}.result-stats small{font-size:21px}.result-stats b{margin-left:auto;font:700 28px "KaiTi",serif}.result-stats p{font:700 12px "KaiTi",serif;color:#5e3f18;margin:6px 0}.result-bottom .gold-btn{min-height:54px;font-size:25px}#app[data-screen=result][data-outcome=win] .topbar,#app[data-screen=result][data-outcome=win] .statusbar,#app[data-screen=result][data-outcome=win] .hero-hud{display:none}#app[data-screen=result][data-outcome=win] #field{top:0}#app[data-screen=result][data-outcome=lost] .result-spacer{order:0}#app[data-screen=result][data-outcome=lost] .result-header{order:1;margin-bottom:-3px;z-index:1}#app[data-screen=result][data-outcome=lost] .result-bottom{order:2}#app[data-screen=result][data-outcome=lost] .result-header h1{font-size:40px;color:#ffc85b;text-shadow:0 3px #8c1a08}#app[data-screen=result][data-outcome=lost] .overlay{background:linear-gradient(transparent 55%,#06171088)}
.wallet,.day-count,.statusbar,.hero-pill,.materials,.wave-hud{background:none;border:6px solid transparent;border-image:url("assets/topdown-v4/ui-hud.png") 55 78 fill stretch;border-radius:0;box-shadow:none}
.topbar{gap:2px;padding:2px 4px;background:#08281f}.wallet,.day-count{padding:0 3px;min-height:36px}.wallet b{font-size:18px}.brand{font-size:22px;gap:2px}.brand-mark img{width:25px;height:29px}.day-count{font-size:15px}.top-actions{margin-left:1px}.statusbar{padding:0 5px;gap:4px}.statusbar .base-icon{width:24px;height:24px;object-fit:contain}.hero-hud{padding:1px 4px;gap:2px;border-bottom:0;background:#08281f}.hero-pill{width:48%;padding:0 1px;border-width:6px}.hero-pill>img{width:29px;height:31px}.materials{padding:0 2px;border-width:6px}.wave-hud{display:none;min-width:0;padding:1px 2px;justify-content:center;flex-direction:column;gap:4px}.night .hero-pill{width:38%}.night .materials{flex:1}.night .wave-hud{display:flex;width:27%}.night #resource-info{gap:2px}.night #resource-info img{width:12px;height:15px}.night #resource-info b{font-size:10px}.night .hero-pill b{font-size:11px}.night .hero-pill>img{width:23px;height:29px}.night #wave-count{font-size:9px}.night #wave-track{height:7px}.night .hero-pill b span{font-size:9px;padding-left:0}
#toast{z-index:10}.overlay{z-index:20;background:#03151186;backdrop-filter:blur(1px);padding:22px}.modal{background:none;border:23px solid transparent;border-image:url("assets/topdown-v4/ui-modal.png") 95 fill stretch;box-shadow:0 12px 60px #0008;padding:3px 3px 7px;border-radius:0;max-height:91%;overflow:auto;scrollbar-width:thin;scrollbar-color:#a78037 #12392b}.modal-heading{background:none;border:15px solid transparent;border-image:url("assets/topdown-v4/ui-parchment.png") 53 fill stretch;color:#311604;margin:0 -5px 12px;padding:3px 0;position:relative}.modal-heading h1{font-size:30px;letter-spacing:0;color:#311604;text-shadow:0 1px #ffdc6877;margin:4px -7px}.modal-heading p{font:700 14px "KaiTi",serif;color:#311604;margin:5px 0}.modal-heading>img{width:44px;height:44px;object-fit:contain;margin:-32px 0 -6px;filter:drop-shadow(0 2px 1px #362406)}.modal .gold-btn{font-size:22px;min-height:48px;margin-top:7px}.modal .secondary,.panel-actions .secondary{background:none;border:10px 13px solid transparent;border-style:solid;border-width:10px 13px;border-image:url("assets/topdown-v4/ui-teal.png") 58 82 fill stretch;min-height:43px;font:700 17px "KaiTi",serif;padding:0 2px;color:#fff2cd}.modal .secondary{font-size:20px}.parchment-note{border:12px solid transparent;border-image:url("assets/topdown-v4/ui-parchment.png") 53 fill stretch;color:#311604!important;font:700 14px/1.7 "KaiTi",serif!important;padding:2px!important;margin:8px 0!important}.sound-switch{display:flex;align-items:center;justify-content:space-between;background:#04271f;border:1px solid #8f955b;padding:9px 13px;width:100%;font:700 21px "KaiTi",serif;color:#fff0c5}.sound-switch b{font:700 18px "KaiTi",serif;background:#a2a292;border:2px solid #d4c67d;border-radius:24px;width:68px;padding:4px 10px;position:relative;text-align:left}.sound-switch b:after{content:"";position:absolute;width:24px;height:24px;border-radius:50%;background:#e9e7d3;border:2px solid #d8bf80;top:2px;right:32px}.sound-switch[aria-checked=true] b{background:#efb700;color:#321d07}.sound-switch[aria-checked=true] b:after{right:2px;background:#fff8dc}.warning-count{display:flex;align-items:center;justify-content:center;gap:8px;font:700 17px "KaiTi",serif;padding:6px;background:#062b20;border:1px solid #ae9248}.warning-count img{width:40px;height:40px;object-fit:contain}.field-notes{display:grid;grid-template-columns:1fr 1fr;gap:7px;text-align:left}.field-notes article{border:10px solid transparent;border-image:url("assets/topdown-v4/ui-parchment.png") 53 fill stretch;background:none;padding:2px}.field-notes img{width:44px;height:44px;object-fit:contain;display:block;margin:auto}.field-notes h2{font:700 17px "KaiTi",serif;color:#361d09;margin:5px 0;text-align:center}.field-notes p{font-size:11px;line-height:1.8;color:#3d2a18;margin:0}.dawn-receipt{border:17px solid transparent;border-image:url("assets/topdown-v4/ui-parchment.png") 53 fill stretch;color:#321d0c;padding:1px 6px}.dawn-receipt>div{display:flex;align-items:center;gap:6px;padding:6px 0;border-bottom:1px solid #af813f66;font:700 18px "KaiTi",serif}.dawn-receipt img{width:27px;height:27px;object-fit:contain}.dawn-receipt b{margin-left:auto;font:700 19px Georgia,serif}.dawn-receipt p{color:#44250b;font:700 14px/1.6 "KaiTi",serif;margin:8px 0 0}#app[data-screen=dawn] .modal{align-self:flex-end;margin-bottom:min(27vh,220px);max-height:66%}#app[data-screen=dawn] .overlay{background:#04190e32;backdrop-filter:none}
.tower-detail{grid-template-columns:105px minmax(0,1fr);gap:4px;padding:3px 6px}.tower-detail>img,.tower-detail>.tower-portrait{width:105px;height:102px}.tower-detail p{margin:2px 0;font:14px "KaiTi",serif}.tower-detail strong{font:bold 17px Georgia,serif}.tower-stars{color:#ab6b05;letter-spacing:4px;font-size:16px}.detail-actions{grid-template-columns:1fr 1fr;gap:5px}.detail-actions button{font-size:13px!important;min-height:39px}.detail-actions #upgrade-tower{border-image-source:url("assets/topdown-v4/ui-gold.png");color:#301b07}.detail-actions #more-towers{grid-column:1/-1;min-height:28px;border-width:5px 10px;font-size:12px!important;background:none}.resource-panel{grid-column:1/-1;display:grid;grid-template-columns:36% minmax(0,1fr);gap:7px;color:#2b190a}.facility-preview{width:100%;height:115px;object-fit:contain;border:10px solid transparent;border-image:url("assets/topdown-v4/ui-parchment.png") 53 fill stretch;padding:1px}.resource-conditions{display:flex;flex-direction:column;gap:3px;justify-content:space-between}.resource-yield{font:700 14px "KaiTi",serif;border:7px solid transparent;border-image:url("assets/topdown-v4/ui-parchment.png") 53 fill stretch;display:flex;align-items:center;gap:3px}.resource-yield img{width:21px;height:21px;object-fit:contain}.requirement{border:1px solid #607c61;background:#123a2d;color:#eed7a5;font:13px "KaiTi",serif;padding:3px 5px}.requirement span{display:inline-block;border:1px solid #ad7841;border-radius:50%;width:17px;height:17px;text-align:center;color:#f8d16c;background:#6e4325;font:700 12px sans-serif;margin-right:5px}.requirement.met span{background:#64ce26;border-color:#225e15;color:#123a11}.facility-status{grid-column:1/-1;color:#efe1b2;font-size:11px;text-align:center;margin:0}.panel-actions{grid-column:1/-1;display:flex;gap:6px;margin:3px 0}.panel-actions>button{flex:1;min-width:0;white-space:nowrap;font-size:16px;min-height:43px;padding:0 2px}.panel-actions>button:disabled{border-image-source:url("assets/topdown-v4/ui-disabled.png");color:#ded9cf}.expansion-panel{grid-column:1/-1;display:grid;grid-template-columns:1.25fr 1fr;gap:6px}.expansion-panel>div{border:12px solid transparent;border-image:url("assets/topdown-v4/ui-parchment.png") 53 fill stretch;text-align:center;color:#301c08;padding:0}.expansion-panel h3{font:700 17px "KaiTi",serif;margin:0 0 3px}.expansion-panel img{width:88px;height:76px;object-fit:contain;display:block;margin:auto}.expansion-panel b{font:700 14px/1.5 "KaiTi",serif;display:block}.expansion-risk b{color:#8a1c0b;font-size:16px}.expansion-panel>p{grid-column:1/-1;margin:0;color:#f6d99d;font-size:11px;text-align:center}.base-summary{grid-column:1/-1;display:grid;grid-template-columns:90px minmax(0,1fr);align-items:center;border:13px solid transparent;border-image:url("assets/topdown-v4/ui-parchment.png") 53 fill stretch;color:#321d08;padding:2px 3px;gap:8px}.base-summary>img{width:85px;height:88px;object-fit:contain}.base-summary b{display:block;font:700 20px "KaiTi",serif}.base-summary span{display:block;font-size:13px;padding:4px 0}.base-summary small{display:block;font-size:10px;margin-top:5px}.base-actions{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:6px}.base-actions .shop-card{min-height:99px;display:grid;grid-template-columns:38px 1fr;grid-template-rows:auto auto auto;gap:2px 3px}.base-actions .shop-card img{grid-column:1;grid-row:1/3;width:35px;height:40px}.base-actions .shop-card b{grid-column:2;font-size:16px;text-align:left}.base-actions .shop-card small{display:block;grid-column:2;font-size:11px;text-align:left}.base-actions .shop-card .price{grid-column:1/-1;width:100%;padding:3px}.territory-shop{gap:4px!important}
#app[data-panel^=resource-] .day-footer,#app[data-panel^=hero-] .day-footer,#app[data-panel^=territory-] .day-footer{display:none}#app[data-panel=resource-catalog] .shop-card small{display:block;font-size:10px}#app[data-panel=resource-catalog] .shop-card{min-height:145px}#boss-hud{position:absolute;top:47px;left:70px;right:70px;padding:8px 10px;background:#321b19e8;border:2px solid #cc9b4a;pointer-events:none;color:#ffe7a3;display:grid;grid-template-columns:1fr auto;gap:5px}#boss-hud b{font:700 17px "KaiTi",serif}#boss-value{font-size:11px}#boss-hud>div{grid-column:1/-1;height:11px;background:#201816;border:1px solid #d4b16c}#boss-bar{display:block;height:100%;background:linear-gradient(#f96f36,#c51718);width:100%;transition:width .15s}
@container game-frame (max-width:360px){.brand{font-size:18px}.brand-mark{font-size:25px}.wallet,.day-count{padding:0 2px}.day-count{font-size:14px}.icon-btn{width:23px}.shop-card b{font-size:12px}.tabs button{font-size:13px}.panel-actions>button{font-size:14px}.resource-yield{font-size:12px}.requirement{font-size:11px}.field-notes h2{font-size:15px}.modal-heading h1{font-size:27px}.base-actions .shop-card b{font-size:14px}.base-actions .shop-card small{font-size:10px}}
@container game-frame (max-height:740px){.topbar{height:38px}.statusbar{height:27px}.hero-hud{height:37px}#field{top:102px}.hero-pill>img{height:27px}.shop-card{min-height:88px}.shop-card img{height:43px}.tabs button{height:29px}.dock-title{height:27px}.gold-btn{min-height:40px;font-size:19px}.day-footer>small{font-size:9px}.title-menu{margin-bottom:5px}#app[data-screen=start] .modal h1{margin-top:13px;font-size:39px}.modal{border-width:17px;padding:2px}.modal p{font-size:11px}.modal-heading{border-width:12px;margin-bottom:8px}.modal-heading h1{font-size:25px}.field-notes{gap:5px}.field-notes img{width:30px;height:30px}.field-notes article{border-width:7px}.field-notes h2{font-size:15px}.field-notes p{font-size:10px;line-height:1.6}.modal .gold-btn,.modal .secondary{min-height:40px;font-size:19px}.modal .parchment-note{font-size:12px!important}.dawn-receipt>div{padding:3px 0;font-size:16px}.dawn-receipt img{width:23px;height:23px}#app[data-screen=dawn] .modal{max-height:73%;margin-bottom:120px}.facility-preview{height:100px}.resource-yield{font-size:12px}.requirement{font-size:11px}#joystick,#skill{width:75px;height:75px}#stick{left:22px;top:22px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.resource-marker:active,.tower-target:active{transform:translate(-50%,-50%)!important}
.panel-actions>button{white-space:normal;line-height:1.2}.panel-actions .secondary{border-width:9px 11px;font-size:14px;padding:0 3px}.dawn-receipt{padding:3px 16px 3px 10px}.dawn-receipt>div{min-width:0}.dawn-receipt>div>span{min-width:0;flex:1}.dawn-receipt b{flex:none;margin-right:2px}.dawn-receipt,.result-stats,.field-notes,.parchment-note,.sound-switch{font-synthesis:weight}

/* Mother fidelity: authored timber identity and an independently composited receipt. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.brand-mark>img{width:27px;height:32px;object-fit:contain}
#app[data-screen=start] .modal{padding:0 14px}
#app[data-screen=start] .modal h1.title-lockup{width:calc(100% + 12px);padding:0;margin:25px -6px 0;background:none;border:0;line-height:0;text-shadow:none;flex:none}
.title-lockup>img{display:block;width:100%;height:auto}
#app[data-screen=start] .modal .subtitle{font-size:clamp(15px,4.4vw,19px);letter-spacing:1px;background:#321e0ee8;border:1px solid #b8873d;padding:4px 15px;color:#fff2d1;margin:-1px 0 0}
.title-tools{position:absolute;right:12px;top:7px;display:flex;gap:5px;z-index:2}
.title-tool{width:34px;height:34px;border:7px solid transparent;border-image:url("assets/topdown-v4/ui-modal.png") 95 fill stretch;background:none;padding:0;font:700 23px/18px Georgia,serif;color:#fff0d2;text-shadow:0 1px 2px #160a01}
.title-menu{max-width:100%;width:100%;margin-bottom:10px;padding:5px 7px 3px;border:17px solid transparent;border-image:url("assets/topdown-v4/ui-modal.png") 95 fill stretch;background:none}
.title-day{display:flex;align-items:center;justify-content:center;gap:6px;color:#37200c;font:700 17px "KaiTi",serif;background:url("assets/topdown-v4/ui-parchment.png") center/100% 100% no-repeat;min-height:32px;margin:0 0 4px}
.title-day img{width:24px;height:24px;object-fit:contain}
.title-menu .title-day{width:min(92%,230px);margin:0 auto 4px;background:none;border:solid transparent;border-width:8px 15px;border-image:url("assets/topdown-v4/ui-parchment.png") 53 fill stretch;min-height:38px;padding:0}
#app[data-screen=start] .modal .title-hint{margin:10px 0 4px;font:700 13px "KaiTi",serif;color:#fce8af}
#app[data-context=title] .topbar,#app[data-context=title] .statusbar,#app[data-context=title] .hero-hud,#app[data-context=title] #dock,#app[data-context=title] #joystick,#app[data-context=title] #skill,#app[data-context=title] #workshop-toggle,#app[data-context=title] #slots,#app[data-context=title] #field-tip,#app[data-context=title] #map-chip{display:none!important}
#app[data-context=title] #field{top:0;bottom:0}
.title-promises{gap:5px;justify-content:center;margin:9px 0 4px}
.title-promises>span{display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:56px;border:8px solid transparent;border-image:url("assets/topdown-v4/ui-hud.png") 38 42 fill stretch;padding:0}
.title-promises img{width:32px;height:30px;object-fit:contain}
.title-promises b{font:700 13px "KaiTi",serif;color:#fff0c7;white-space:nowrap}
#app[data-screen=start] .modal .fine{margin:3px 0 0;font-size:10px;line-height:1.4}
#app[data-screen=result] .result-header{padding:0;background:none;border:0;box-shadow:none}
.result-plaque{position:relative;width:100%;aspect-ratio:3;background:url("assets/topdown-v4/timber-plaque.png") center/contain no-repeat}
#app[data-screen=result] .result-header h1{position:absolute;left:12%;right:12%;top:39%;bottom:14%;display:flex;align-items:center;justify-content:center;margin:0;padding:0;background:none;font-size:clamp(30px,8vw,40px);line-height:1;letter-spacing:3px;color:#ffe392;text-shadow:0 2px #773b0b}
#app[data-screen=result] .result-header>p{display:table;margin:-1px auto 0;padding:3px 16px;background:#321e0ee8;border:1px solid #af7c36;font:700 17px "KaiTi",serif;color:#ffedc4}
#app[data-screen=dawn] .overlay{align-items:flex-end;justify-content:center;padding:12px 0 calc(var(--dock-h) + 5px);background:transparent;backdrop-filter:none}
#app[data-screen=dawn] .modal{position:static;align-self:auto;width:var(--dawn-width,260px);max-width:82%;max-height:none;margin:0;padding:0;border:0;background:none;box-shadow:none;overflow:visible}
.dawn-card{position:relative;width:100%;aspect-ratio:var(--dawn-ratio,1.1);background:url("assets/topdown-v4/dawn-frame.png") center/100% 100% no-repeat;container-type:inline-size;color:#321b0b;filter:drop-shadow(0 5px 6px #0a1d1244)}
#app[data-screen=dawn] .dawn-card>h1{position:absolute;top:18.1%;height:10%;left:15%;right:15%;display:flex;align-items:center;justify-content:center;margin:0;font-size:clamp(13px,7.5cqw,21px);line-height:1;letter-spacing:0;color:#301503;text-shadow:0 1px #ffdf9466;white-space:nowrap}
.dawn-card .dawn-receipt{position:absolute;top:33%;bottom:23%;left:15%;right:15%;display:flex;flex-direction:column;border:0;background:none;padding:0}
.dawn-card .dawn-receipt>div{flex:1;min-height:0;gap:4px;padding:0;border-bottom:1px solid #9b6d3766;font-size:clamp(12px,5.8cqw,17px);line-height:1}
.dawn-card .dawn-receipt img{width:clamp(13px,7.2cqw,20px);height:clamp(13px,7.2cqw,20px)}
.dawn-card .dawn-receipt b{font:700 clamp(13px,6.2cqw,18px)/1 Georgia,serif;margin:0 1px 0 auto;white-space:nowrap}
.dawn-card .no-income{color:#786142}
#app[data-screen=dawn] .dawn-recovery{position:absolute;top:82%;bottom:12%;left:9%;right:9%;display:flex;align-items:center;justify-content:center;gap:7px;margin:0;font:700 clamp(10px,4.3cqw,12px)/1.1 "KaiTi",serif;color:#42240b;white-space:nowrap}
.dawn-recovery span+span:before{content:"·";margin-right:7px}
#app[data-screen=dawn] #dawn-continue{position:absolute;min-height:0;margin:0;padding:1px 12px;font-size:22px;line-height:1.1}
#app[data-screen=dawn] #next-night{visibility:hidden}
#app[data-screen=dawn] #forecast,#app[data-screen=dawn] #joystick,#app[data-screen=dawn] #skill,#app[data-screen=dawn] #field-tip,#app[data-screen=dawn] #slots,#app[data-screen=dawn] #map-chip{display:none}
@container game-frame (max-height:740px){#app[data-screen=start] .modal h1.title-lockup{margin-top:17px}.title-menu{border-width:13px;margin-bottom:6px;padding:4px 4px 2px}.title-promises{margin:5px 0 3px}.title-promises>span{min-height:50px;border-width:6px}.title-promises img{width:27px;height:25px}.title-promises b{font-size:12px}#app[data-screen=start] .modal .gold-btn{min-height:48px;font-size:22px}#app[data-screen=start] .modal .secondary{min-height:46px;font-size:20px}.title-day{min-height:28px;font-size:15px}#app[data-screen=dawn] #dawn-continue{font-size:20px}}
@container game-frame (max-height:740px){#app[data-screen=dawn] #shop{min-height:80px}#app[data-screen=dawn] #shop .shop-card{border-width:10px;padding:1px 3px;min-height:80px}#app[data-screen=dawn] #shop .shop-card img{height:36px;width:56px}#app[data-screen=dawn] #shop .shop-card b{font-size:12px}#app[data-screen=dawn] #shop .price{font-size:11px}#app[data-screen=dawn] .tabs button{height:26px}#app[data-screen=dawn] .dock-title{height:26px}}

/* Mother20: independent timber/parchment, actual shared five-second clock. */
#recovery{position:absolute;z-index:6;left:6%;right:6%;bottom:calc(var(--dock-h) + 118px);height:102px;pointer-events:none;display:grid;grid-template-columns:minmax(0,1fr) 80px;align-items:start;filter:drop-shadow(0 3px 3px #06130d99)}
.recovery-copy{padding-top:2px;min-width:0;margin-right:-14px}
.recovery-copy>b{display:flex;align-items:center;justify-content:center;height:57px;background:url("assets/topdown-v4/timber-plaque.png") center/100% 100% no-repeat;padding:12px 8px 2px;font:700 clamp(17px,5.4vw,24px) "KaiTi",serif;color:#ffe29a;text-shadow:0 2px #502a0d;white-space:nowrap}
.recovery-copy p{display:flex;align-items:center;justify-content:center;gap:3px;height:30px;margin:-2px 5px 0 14px;border:7px solid transparent;border-image:url("assets/topdown-v4/ui-parchment.png") 53 fill stretch;color:#321b0c;font:700 14px/1 "KaiTi",serif;white-space:nowrap}
.recovery-clock{position:relative;width:80px;height:80px;margin-top:12px;background:url("assets/topdown-v4/ui-joystick.png") center/contain no-repeat}
.recovery-clock svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg);fill:none;stroke-width:5}.recovery-track{stroke:#04382e}#recovery-ring{stroke:#2de8bc;stroke-linecap:round}
.recovery-clock output{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:700 24px Georgia,serif;color:#fff4dc;text-shadow:0 2px #062c20}
#recovery-hint{position:absolute;left:13%;right:13%;bottom:-4px;text-align:center;font:700 12px/1.2 "KaiTi",serif;color:#ffedbd;background:#082d23e8;border:1px solid #a2813e;padding:4px}
.hero-down .hero-pill,.hero-down #joystick,.hero-down #skill{filter:grayscale(1) brightness(.85)}.hero-down #joystick{pointer-events:none}.hero-down #skill{cursor:default}.hero-down #field-tip,.hero-down #slots{visibility:hidden}
.detail-actions #upgrade-tower:disabled{background:none;border-image-source:url("assets/topdown-v4/ui-disabled.png");color:#e8e5dc;text-shadow:0 1px #252826;cursor:default}
/* Recolor only the authored frame so the text retains its parchment color. */
.detail-actions #sell-tower,.panel-actions #sell-resource{position:relative;isolation:isolate;background:none;border-image-source:url("assets/topdown-v4/ui-teal.png");color:#fff0d5;text-shadow:0 1px #4a100d;filter:none}
.detail-actions #sell-tower:before,.panel-actions #sell-resource:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(#a54c36,#692019);mix-blend-mode:color;clip-path:polygon(5% 0,95% 0,100% 25%,100% 75%,95% 100%,5% 100%,0 75%,0 25%)}
.refund-amount{display:inline-block;white-space:nowrap}
/* Mother22: an illustrated field book, with real game art in four vignettes. */
#app[data-screen=help] .overlay{padding:12px;backdrop-filter:none;background:#04190e77}
#app[data-screen=help] .modal{width:100%;max-height:94%;border-width:15px;border-image-source:url("assets/topdown-v4/ui-parchment.png");border-image-slice:53 fill;padding:0 2px 2px;overflow-y:auto;overscroll-behavior:contain;scrollbar-color:#99703c #ebcc92;color:#351e0d}
.handbook-heading{position:relative;min-height:68px;margin:-5px 0 2px;padding:0 22px;background:url("assets/topdown-v4/timber-plaque.png") center/100% 100% no-repeat;display:flex;align-items:center;justify-content:center}
#app[data-screen=help] .handbook-heading h1{font:700 clamp(25px,7.5vw,34px)/1 "KaiTi",serif;letter-spacing:1px;color:#ffe5a4;text-shadow:0 2px #4f270c;margin:18px 0 0;white-space:nowrap}
#help-x{position:absolute;right:0;top:20px;width:34px;height:34px;background:#4f2f18;border:2px solid #e0b35b;box-shadow:0 0 0 2px #6e411e;border-radius:50%;color:#ffefbb;font:700 28px/1 serif;padding:0;display:flex;align-items:center;justify-content:center}
#app[data-screen=help] .field-notes{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:6px;margin:0}
#app[data-screen=help] .field-notes article{min-width:0;border-width:6px;padding:1px 0 2px;border-image-slice:53 fill;box-shadow:inset 0 0 0 1px #ab7d3666}
#app[data-screen=help] .field-notes h2{font:700 clamp(17px,4.8vw,21px)/1.2 "KaiTi",serif;margin:2px 0 4px;white-space:nowrap}
#app[data-screen=help] .field-notes p{font:700 clamp(11px,3.1vw,13px)/1.6 "KaiTi",serif;color:#402710;text-align:center;margin:0 0 4px;white-space:nowrap}
.note-scene{display:block;width:100%;height:auto;aspect-ratio:10/7;border:0;pointer-events:none}
#app[data-screen=help] .handbook-rule{font:700 14px/1.4 "KaiTi",serif;color:#4a2d0f;margin:8px 0 6px;text-align:center}
.handbook-details{font:12px/1.7 "Microsoft YaHei",sans-serif;color:#3d2914;margin:4px 3px 0;text-align:left;border-top:1px solid #a97b3a;border-bottom:1px solid #a97b3a;padding:5px 3px;touch-action:pan-y}
.handbook-details summary{font:700 14px/1.5 "KaiTi",serif;cursor:pointer;min-height:28px;padding:4px 0}
.handbook-details ul{list-style:disc;padding-left:19px;margin:5px 0 10px;font:12px/1.8 "Microsoft YaHei",sans-serif}
.handbook-details li{margin-bottom:7px}
.handbook-footer{position:sticky;bottom:-3px;padding:4px 0 2px;background:#edce91;z-index:1}
#app[data-screen=help] .handbook-footer .gold-btn{margin:0;width:100%;min-height:45px;font-size:22px}
/* Live HP uses its own clear line instead of tiny digits inside an 8px bar. */
.hero-pill>div{display:grid;grid-template-columns:1fr;gap:0;align-content:center}
.hero-pill b{font-size:12px;line-height:1}.hero-health{margin-top:0;height:4px;flex:none}
.hero-pill small{position:static;font:700 11px/1 sans-serif;text-align:center;text-shadow:0 1px #000}
#wave-count,.night #wave-count{font:700 11px/1.3 "KaiTi",serif}
@container game-frame (max-width:360px){#app[data-screen=help] .overlay{padding:9px}#app[data-screen=help] .modal{border-width:11px}.handbook-heading{min-height:61px}.handbook-details{margin:3px 0 0}#app[data-screen=help] .field-notes{gap:4px}#app[data-screen=help] .field-notes article{border-width:4px}#app[data-screen=help] .field-notes p{font-size:11px}.hero-pill b{font-size:12px}.hero-pill small{font-size:11px}#wave-count,.night #wave-count{font-size:10px}}
@container game-frame (max-height:740px){#app[data-screen=help] .modal{max-height:96%}.handbook-heading{min-height:58px}#app[data-screen=help] .handbook-heading h1{margin-top:15px}#app[data-screen=help] .field-notes h2{margin-bottom:2px}.hero-pill{border-width:4px}.hero-pill small{font-size:10px}}
@container game-frame (max-width:360px){#recovery{left:4%;right:4%;grid-template-columns:minmax(0,1fr) 72px;height:96px}.recovery-copy>b{font-size:19px}.recovery-copy p{font-size:12px;margin-left:9px}.recovery-clock{width:72px;height:72px}.recovery-clock output{font-size:22px}#recovery-hint{font-size:11px}}
@container game-frame (max-height:740px){#recovery{bottom:calc(var(--dock-h) + 101px);height:94px}.recovery-copy>b{height:52px}.recovery-copy p{height:27px}.recovery-clock{margin-top:8px}#recovery-hint{bottom:-3px}}

/* Result composition: preserve the authored camp above its loss plaque. */
@container game-frame (max-height:740px){
 #app[data-screen=result] .result-plaque{width:min(100%,300px);margin-inline:auto}
 #app[data-screen=result] .result-header h1{font-size:28px;letter-spacing:2px}
 #app[data-screen=result] .result-header>p{font-size:14px;padding:2px 8px}
 #app[data-screen=result] .result-bottom .result-stats{border-width:12px;padding:0 6px}
 #app[data-screen=result] .result-stats>div{padding:3px 2px;gap:7px}
 #app[data-screen=result] .result-stats img{width:28px;height:28px}
 #app[data-screen=result] .result-stats small{font-size:16px}
 #app[data-screen=result] .result-stats b{font-size:22px}
 #app[data-screen=result] .result-stats p{font-size:11px;margin:4px 0}
 #app[data-screen=result] .result-bottom .gold-btn{height:48px;min-height:48px;padding:0 10px;border-width:10px;line-height:1;font-size:22px;margin-top:4px;box-sizing:border-box}
}

/* Keep utility controls on the fitted playfield; text/panels retain CSS size. */
.utility{top:calc(var(--playfield-top,116px) + 12px)}#help{right:calc(var(--playfield-side,0px) + 8px)}#sound{right:calc(var(--playfield-side,0px) + 38px)}

/* Keep field controls above the actual app/field obstruction and each other. */
#joystick{bottom:calc(var(--field-control-h,0px) + 11px)}#skill{bottom:calc(var(--field-control-h,0px) + 9px)}#field-tip{bottom:calc(var(--field-control-h,0px) + 5px)}

/* Small fitted fields retain full-size, uncropped confirmation touch targets. */
#field{container-type:inline-size}
@container (max-width:330px){#placement-bar .placement-actions{display:flex;flex-direction:column}#placement-bar .placement-actions button{flex:none;min-width:0;width:100%;min-height:47px}#field-tip{left:86px;right:86px;line-height:1.2}}

/* Compact portal legend reuses the existing hint line. */
.portal-hud #field-tip{display:flex;left:8px;right:8px;align-items:center;justify-content:space-evenly;gap:4px;white-space:nowrap;font:700 11px/1.2 "Microsoft YaHei",sans-serif;padding:3px 4px;color:#ffe9a4}.portal-nav-item{display:inline-block;flex:0 1 auto;white-space:nowrap}.portal-hud #joystick,.portal-hud #skill{translate:0 -22px}

/* Whole game frame is 9:16; the outer browser is a neutral matte. */
body{height:100svh;display:grid;place-items:center}#app{width:min(100vw,480px,56.25svh);height:auto;max-width:none;aspect-ratio:9/16;margin:0;container-type:size;container-name:game-frame}#terrain-backdrop{position:absolute;left:0;display:block;pointer-events:none;z-index:0}#field{background:transparent}

/* Domain-clock hit cue: pauses freeze it, all directions retain original art. */
.hero-pill{position:relative;--hero-hit-alpha:0;box-shadow:inset 0 0 15px rgba(255,69,43,var(--hero-hit-alpha))}#hero-hit-notice{position:absolute;right:3px;top:2px;z-index:2;pointer-events:none;border:1px solid #ffb192;background:#6e1c16;color:#ffe5c9;padding:0 3px;font:700 12px/17px "KaiTi",serif;text-shadow:0 1px #301008}

/* Generated skins are already rasterized at the actual element size. Only the
   neutral source texture repeats; corner/leaf pixels retain one uniform scale. */
[data-ui-skin]{border-image:none!important;border-color:transparent!important;background-color:transparent!important;background-image:var(--ui-skin)!important;background-position:center!important;background-size:100% 100%!important;background-repeat:no-repeat!important;background-origin:border-box!important;background-clip:border-box!important}
.detail-actions #sell-tower::before,.panel-actions #sell-resource::before{display:none}
.modal{min-width:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;touch-action:pan-y}
.modal>*{min-width:0;max-width:100%}
.modal-heading{margin:0 0 10px;border:0;padding:25px 12px 12px;min-height:102px}
.modal-heading h1{margin:2px 0 6px;font-size:clamp(24px,6.4cqw,31px);line-height:1.2;letter-spacing:0}
.modal-heading p{font-size:14px;line-height:1.4;margin:0}
.modal-heading>img{position:absolute;width:48px;height:48px;left:50%;top:-20px;transform:translateX(-50%);margin:0;object-fit:contain}
.modal .gold-btn,.modal .secondary{margin:0;min-height:54px;flex:none;line-height:1.15;font-size:22px}
.modal .secondary{min-height:50px;font-size:20px}
.modal .parchment-note{border:0;margin:0!important;padding:9px 10px!important;font:700 13px/1.6 "KaiTi",serif!important}
#app[data-screen=pause] .modal,#app[data-screen=settings] .modal,#app[data-screen=new-camp] .modal{width:min(82%,330px);max-height:94%;padding:30px 14px 18px;border:0;display:flex;flex-direction:column;gap:11px;scrollbar-gutter:auto}
#app[data-screen=pause] .modal-heading,#app[data-screen=settings] .modal-heading,#app[data-screen=new-camp] .modal-heading{margin:0;flex:none}
.sound-switch{width:100%;min-width:0;min-height:44px;flex:none;padding:7px 12px;box-sizing:border-box}
.sound-switch>span{font-size:20px;white-space:nowrap}
.sound-switch>b{flex:none}
#app[data-screen=new-camp] .modal>p{margin:0;font-size:13px}
#app[data-screen=start] .title-menu .gold-btn{min-height:59px}
#app[data-screen=start] .title-menu .secondary{min-height:54px;margin-top:8px}
#app[data-screen=start] .title-menu{padding:12px 8px 9px;border-width:14px}
.title-tool{border-width:6px}
.tabs{gap:2px}
.tabs button{height:34px;border-width:7px 9px;gap:1px}
.tabs button img{width:14px;height:14px;object-fit:contain}
.dock-title{height:35px;min-height:35px}
.dock-title>div:first-child{border-width:6px 12px;padding:0 5px;min-width:0;min-height:33px;display:grid;align-items:center}
.dock-title b{font-size:19px;line-height:1.1}
.shop-card{min-height:112px;border-width:12px;padding:2px 3px}
.shop-card img{max-width:100%;height:53px;object-fit:contain}
.shop-card b{max-width:100%;line-height:1.2}
.price[data-ui-skin]{border:1px solid #ac772e!important;padding:3px 7px;clip-path:polygon(5px 0,calc(100% - 5px) 0,100% 5px,100% calc(100% - 5px),calc(100% - 5px) 100%,5px 100%,0 calc(100% - 5px),0 5px)}
.resource-marker{padding:5px 11px;min-width:0}
#map-chip{padding:5px 12px}
#toast{padding:10px 24px}
#banner{padding:10px 27px;font-size:20px}
#save-status{font:10px/1.2 "Microsoft YaHei",sans-serif;color:#b8d7a2;white-space:nowrap;flex:none}
#save-status[data-state=failed]{color:#ffc197}
.resource-use{grid-column:1/-1;margin:0;padding:3px 6px;color:#d6dfb6;font:11px/1.5 "Microsoft YaHei",sans-serif;text-align:center}
.base-actions{display:grid;grid-template-columns:1fr;gap:5px}
.base-actions .shop-card{display:grid;grid-template-columns:37px minmax(0,1fr) 74px;grid-template-rows:auto auto;min-height:62px;border-width:9px 12px;gap:0 5px;text-align:left;align-items:center}
.base-actions .shop-card img{grid-column:1;grid-row:1/3;width:33px;height:33px;max-width:100%}
.base-actions .shop-card b{grid-column:2;grid-row:1;font-size:15px}
.base-actions .shop-card small{grid-column:2;grid-row:2;display:block;font-size:10px;line-height:1.3}
.base-actions .shop-card .price{grid-column:3;grid-row:1/3;font-size:11px;text-align:center;justify-self:stretch;white-space:nowrap;padding:4px 2px}
.day-footer>.gold-btn{min-height:52px;font-size:21px;border-width:12px 24px}
.hero-pill>img{object-fit:contain;border-radius:50%;background:#113f36;outline:1px solid #d7a440;flex:none}
#boss-hud{left:8px;right:8px;width:auto;max-width:calc(100% - 16px);z-index:4;min-width:0;grid-template-columns:minmax(0,1fr) auto}
#boss-hud b{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#boss-value{white-space:nowrap;font-size:12px}
/* Whole crested timber must retain 3:1; its central emblem cannot be tiled. */
.handbook-heading{height:auto;min-height:0;aspect-ratio:3;margin:0 0 3px;padding:8.2% 10% 0;background-size:contain}
#app[data-screen=help] .handbook-heading h1{margin:0;font-size:clamp(23px,6.3cqw,30px);line-height:1.1}
#app[data-screen=help] .modal{padding:6px 10px 10px;border-width:12px;scrollbar-gutter:auto}
#app[data-screen=help] .field-notes article{border-width:7px;padding:2px}
#app[data-screen=help] .field-notes img{max-width:100%;object-fit:contain}
#app[data-screen=help] .field-notes p{white-space:normal;overflow-wrap:anywhere;font-size:clamp(10px,2.9cqw,12px);line-height:1.65}
#app[data-screen=help] .handbook-footer .gold-btn{min-height:52px}
.recovery-copy{margin:0;padding:0}
.recovery-copy>b{height:auto;min-height:0;aspect-ratio:3;background-size:contain;padding:8.2% 9% 0;font-size:18px}
#recovery{height:auto;min-height:112px;align-items:center}
.recovery-copy p{margin:-2px 0 0 6px;height:30px;border-width:6px;font-size:12px}
.recovery-clock{margin-top:0}
#recovery-hint{position:static;left:auto;right:auto;bottom:auto;transform:none;grid-column:1/-1;justify-self:center;width:max-content;max-width:100%;margin:3px auto 0;padding:6px 18px;background:none;border:0;color:#3b230f}
@container game-frame (max-width:360px){.recovery-copy>b{font-size:15px}.wave-hud{padding-left:0;padding-right:0}.wave-hud span{font-size:9.5px;letter-spacing:-.2px}#confirm-build{font-size:13px}}
/* The narrow workshop leaves little field height: keep all three utility
   controls in the HUD flow instead of covering the skill/joystick hit areas. */
@container game-frame (max-width:360px){.brand>span:last-child{display:none}.brand{flex:none}.top-actions{display:flex;gap:2px}.top-actions .utility{position:static;top:auto;right:auto;flex:none;width:25px;height:30px;opacity:1}}
@container game-frame (max-height:740px){
 .shop-card{min-height:101px}.shop-card img{height:43px}.shop-card b{font-size:12px}.shop-card .price{font-size:12px}
 .tabs button{height:31px;font-size:13px}.tabs button img{width:12px;height:12px}.day-footer>.gold-btn{min-height:48px;font-size:19px}
 .modal .gold-btn{min-height:51px;font-size:21px}.modal .secondary{min-height:48px;font-size:19px}
 #app[data-screen=pause] .modal,#app[data-screen=settings] .modal,#app[data-screen=new-camp] .modal{gap:9px;padding:27px 12px 15px}
 .modal-heading{min-height:94px;padding:24px 9px 10px}.modal-heading p{font-size:13px}
 #app[data-screen=help] .handbook-heading{min-height:0}#app[data-screen=help] .handbook-heading h1{margin:0}
 #app[data-screen=result] .result-bottom .gold-btn{min-height:52px;height:52px}
}

/* Mother-proportion refinement v24c.
   The pause mother uses a narrower portrait panel with larger, uniformly scaled
   corner leaves. Workshop cards and action bars receive the missing vertical
   breathing room so their source ornaments are not flattened into wide strips. */
#app[data-screen=pause] .modal,#app[data-screen=settings] .modal,#app[data-screen=new-camp] .modal{width:min(74%,300px);padding:28px 12px 16px;gap:12px}
#app[data-screen=pause] .modal-heading,#app[data-screen=settings] .modal-heading,#app[data-screen=new-camp] .modal-heading{min-height:110px;padding:27px 11px 12px}
#app[data-screen=pause] .modal .gold-btn,#app[data-screen=settings] .modal .gold-btn,#app[data-screen=new-camp] .modal .gold-btn{min-height:58px}
#app[data-screen=pause] .modal .secondary,#app[data-screen=settings] .modal .secondary,#app[data-screen=new-camp] .modal .secondary{min-height:53px}
#app[data-screen=pause] .sound-switch,#app[data-screen=settings] .sound-switch,#app[data-screen=new-camp] .sound-switch{min-height:51px;padding:8px 12px}
#app[data-screen=pause] .modal .parchment-note,#app[data-screen=settings] .modal .parchment-note,#app[data-screen=new-camp] .modal .parchment-note{min-height:68px;padding:11px 10px!important}
.shop-card{min-height:132px;padding:3px 4px}
.shop-card img{height:72px}
.shop-card b{font-size:15px}
.shop-card .price{font-size:13px;padding:3px 7px}
.tabs button{height:37px}
.dock-title{height:38px;min-height:38px}
.day-footer>.gold-btn{min-height:56px}
@container game-frame (max-height:740px){
  #app[data-screen=pause] .modal,#app[data-screen=settings] .modal,#app[data-screen=new-camp] .modal{width:min(76%,286px);padding:25px 11px 14px;gap:9px}
  #app[data-screen=pause] .modal-heading,#app[data-screen=settings] .modal-heading,#app[data-screen=new-camp] .modal-heading{min-height:98px;padding:24px 9px 10px}
  #app[data-screen=pause] .modal .gold-btn,#app[data-screen=settings] .modal .gold-btn,#app[data-screen=new-camp] .modal .gold-btn{min-height:52px}
  #app[data-screen=pause] .modal .secondary,#app[data-screen=settings] .modal .secondary,#app[data-screen=new-camp] .modal .secondary{min-height:48px}
  #app[data-screen=pause] .sound-switch,#app[data-screen=settings] .sound-switch,#app[data-screen=new-camp] .sound-switch{min-height:46px}
  #app[data-screen=pause] .modal .parchment-note,#app[data-screen=settings] .modal .parchment-note,#app[data-screen=new-camp] .modal .parchment-note{min-height:60px}
  .shop-card{min-height:116px}.shop-card img{height:58px}.tabs button{height:33px}.dock-title{height:34px;min-height:34px}.day-footer>.gold-btn{min-height:50px}
}
/* Mother-proportion refinement v24d.
   Preserve complete frame corners and the outer modal's timber silhouette.
   These are skin-only changes: no gameplay, source PNG, or state contract changes. */
.modal:not(#app[data-screen=start] .modal):not(#app[data-screen=dawn] .modal){
  background:none;
  border:24px solid transparent;
  border-image:url("assets/topdown-v4/ui-modal.png") 58 fill round;
  border-radius:0;
  box-shadow:0 0 0 4px #183921,0 15px 60px #0008;
}
.gold-btn,#confirm-build,.tabs button,.modal .secondary,.tower-detail button,.extras button,.placement-actions #cancel-build,
.shop-card,.tower-detail,.result-stats,#placement-bar,.dock-title>div:first-child,
.facility-preview,.resource-yield,.expansion-panel>div,.base-summary,.training-shop .shop-card,
.field-notes article,.recovery-copy>p,.title-menu,.title-promises>span{
  border-image-repeat:round;
}
#app[data-screen=pause] .modal,#app[data-screen=settings] .modal,#app[data-screen=new-camp] .modal{
  border-width:24px 20px 24px;
}
#app[data-screen=help] .modal{border-width:20px 18px}
#app[data-screen=result] .modal{border-width:22px 18px}
/* The tall mother cards keep their source ornament scale at compact heights. */
@container game-frame (max-height:740px){
  .shop-card{min-height:126px}
  .shop-card img{height:62px}
  .tabs button{height:34px}
  .dock-title{height:35px;min-height:35px}
  .day-footer>.gold-btn{min-height:52px}
}

/* Mother-sheet proportion pass v26.
   The approved pause/settings family is compact: its parchment title is a
   shallow plate, the sound row is a short control strip, and the two actions
   sit close to the note.  Keep the generated nine-slice skins, changing only
   the layout box so their corner ornaments are not forced into a tall card. */
#app[data-screen=pause] .modal,
#app[data-screen=settings] .modal,
#app[data-screen=new-camp] .modal{
  width:min(76%,286px);
  border-width:18px 20px;
  padding:18px 11px 12px;
  gap:6px;
}
#app[data-screen=pause] .modal-heading,
#app[data-screen=settings] .modal-heading,
#app[data-screen=new-camp] .modal-heading{
  min-height:80px;
  padding:18px 8px 6px;
}
#app[data-screen=pause] .modal-heading h1,
#app[data-screen=settings] .modal-heading h1,
#app[data-screen=new-camp] .modal-heading h1{font-size:clamp(22px,5.8cqw,28px);margin:1px 0 4px}
#app[data-screen=pause] .modal-heading p,
#app[data-screen=settings] .modal-heading p,
#app[data-screen=new-camp] .modal-heading p{font-size:11px;line-height:1.25}
#app[data-screen=pause] .modal-heading>img,
#app[data-screen=settings] .modal-heading>img,
#app[data-screen=new-camp] .modal-heading>img{width:40px;height:40px;top:-17px}
#app[data-screen=pause] .sound-switch,
#app[data-screen=settings] .sound-switch,
#app[data-screen=new-camp] .sound-switch{
  min-height:34px;
  padding:4px 9px;
  font-size:17px;
}
#app[data-screen=pause] .sound-switch>b,
#app[data-screen=settings] .sound-switch>b,
#app[data-screen=new-camp] .sound-switch>b{
  width:58px;
  padding:2px 8px;
  font-size:15px;
}
#app[data-screen=pause] .sound-switch b:after,
#app[data-screen=settings] .sound-switch b:after,
#app[data-screen=new-camp] .sound-switch b:after{width:20px;height:20px;top:1px;right:28px}
#app[data-screen=pause] .sound-switch[aria-checked=true] b:after,
#app[data-screen=settings] .sound-switch[aria-checked=true] b:after,
#app[data-screen=new-camp] .sound-switch[aria-checked=true] b:after{right:1px}
#app[data-screen=pause] .modal .parchment-note,
#app[data-screen=settings] .modal .parchment-note,
#app[data-screen=new-camp] .modal .parchment-note{
  min-height:50px;
  padding:6px 8px!important;
  font-size:11px!important;
  line-height:1.35!important;
}
#app[data-screen=pause] .modal .gold-btn,
#app[data-screen=settings] .modal .gold-btn,
#app[data-screen=new-camp] .modal .gold-btn{min-height:43px;font-size:18px}
#app[data-screen=pause] .modal .secondary,
#app[data-screen=settings] .modal .secondary,
#app[data-screen=new-camp] .modal .secondary{min-height:40px;font-size:17px}

/* The handbook mother keeps the timber heading shallow and lets the four
   parchment notes carry the visual weight. */
#app[data-screen=help] .handbook-heading{
  width:min(100%,260px);
  margin-inline:auto;
  aspect-ratio:3.2;
  padding:8% 8% 0;
}
#app[data-screen=help] .handbook-heading h1{font-size:clamp(22px,5.8cqw,28px)}
#app[data-screen=help] .field-notes{width:100%;gap:6px}
#app[data-screen=help] .field-notes article{min-height:0}
#app[data-screen=help] .field-notes h2{font-size:15px;margin:3px 0}
#app[data-screen=help] .field-notes p{font-size:10px;line-height:1.5}
#app[data-screen=help] .note-scene{width:100%;height:auto;aspect-ratio:10/7;display:block}


/* Mother-sheet proportion repair v27.
   Compact portrait layouts keep the authored corner ornaments from being stretched
   by oversized content boxes. No gameplay state or source art changes. */
@container game-frame (max-height:740px){
  /* Tower catalogue cards match the near-square mother cards at 320/390 widths. */
  #app[data-panel="towers-catalog"] .shop-card{
    min-height:104px;
    padding:2px 3px;
  }
  #app[data-panel="towers-catalog"] .shop-card img{height:48px}
  #app[data-panel="towers-catalog"] .shop-card b{font-size:12px;line-height:1.15}
  #app[data-panel="towers-catalog"] .shop-card .price{font-size:11px;padding:2px 4px}

  /* Four handbook cards: the second row's four wrapped lines previously
     forced every parchment card to 170px tall. */
  #app[data-screen="help"] .modal{max-height:84%;padding:5px 8px 8px}
  #app[data-screen="help"] .field-notes{gap:4px}
  #app[data-screen="help"] .field-notes article{border-width:4px;padding:1px 0}
  #app[data-screen="help"] .field-notes h2{font-size:13px;line-height:1.15;margin:1px 0 2px}
  #app[data-screen="help"] .field-notes p{font-size:9px;line-height:1.3;margin:0 0 2px}
  #app[data-screen="help"] .handbook-heading{margin:0 0 2px}
  #app[data-screen="help"] .handbook-rule{font-size:12px;line-height:1.25;margin:5px 0 4px}
  #app[data-screen="help"] .handbook-footer .gold-btn{min-height:44px;font-size:20px}

  /* Expansion comparison cards use the same compact parchment rhythm as the
     approved mother, instead of tall resource posters. */
  #app[data-panel="territory-catalog"] .expansion-panel>div{
    border-width:8px;
    padding:1px 2px 2px;
  }
  #app[data-panel="territory-catalog"] .expansion-panel h3{
    font-size:14px;line-height:1.15;margin:0 0 1px;
  }
  #app[data-panel="territory-catalog"] .expansion-panel img{
    width:70px;height:60px;
  }
  #app[data-panel="territory-catalog"] .expansion-panel b{
    font-size:12px;line-height:1.3;
  }
  #app[data-panel="territory-catalog"] .expansion-risk b{font-size:13px}
}

/* The ready warning is a short confirmation plaque, not a full-height modal. */
#app[data-screen="ready"] .modal{
  width:min(74%,240px);
  max-height:78%;
  padding:2px 4px 7px;
  border-width:16px 14px;
  gap:0;
}
#app[data-screen="ready"] .modal-heading{
  min-height:72px;
  padding:17px 7px 7px;
  margin:0 0 5px;
}
#app[data-screen="ready"] .modal-heading h1{
  font-size:22px;
  line-height:1.15;
  margin:1px 0 3px;
}
#app[data-screen="ready"] .modal-heading p{
  font-size:10px;
  line-height:1.25;
  margin:0;
}
#app[data-screen="ready"] .modal>p{
  font-size:10px;
  line-height:1.4;
  margin:4px 0;
}
#app[data-screen="ready"] .warning-count{
  min-height:46px;
  padding:4px;
  gap:5px;
  font-size:14px;
}
#app[data-screen="ready"] .warning-count img{width:30px;height:30px}
#app[data-screen="ready"] .modal .gold-btn{
  min-height:42px;
  margin-top:4px;
  font-size:18px;
}
#app[data-screen="ready"] .modal .secondary{
  min-height:38px;
  margin-top:4px;
  font-size:17px;
}

/* Result's full-height timber frame is a nine-slice image. Round the neutral
   joins so the leaves keep one scale from top to bottom. */
#app[data-screen="result"] .modal{border-image-repeat:round}

/* Mother-proportion repair v29.
   The result mother keeps the live forest visible behind the plaque and receipt.
   The previous generated modal skin painted a tall green interior over that
   scene, so the corner leaves read as a stretched frame.  Result composition is
   transparent and keeps only the authored plaque, receipt and action button. */
#app[data-screen="result"] .modal{
  border:0 !important;
  border-image:none !important;
  background:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
}
#app[data-screen="result"] .overlay{
  padding:15px 8px 8px;
  background:transparent;
  backdrop-filter:none;
}

/* On the taller 480-wide portrait frame the mother cards keep their authored
   vertical rhythm.  The compact breakpoint remains unchanged for 320/390. */
@container game-frame (min-height:741px){
  #app[data-panel="towers-catalog"] #shop{min-height:160px}
  #app[data-panel="towers-catalog"] .shop-card{
    min-height:160px;
    padding:4px 5px;
  }
  #app[data-panel="towers-catalog"] .shop-card img{height:84px}
  #app[data-panel="towers-catalog"] .shop-card b{font-size:14px;line-height:1.2}
  #app[data-panel="towers-catalog"] .shop-card .price{font-size:12px;padding:3px 6px}

  #app[data-screen="pause"] .modal,
  #app[data-screen="settings"] .modal,
  #app[data-screen="new-camp"] .modal{width:min(72%,330px)}
}


/* Ready prompt uses the compact mother plaque rhythm at narrow heights. */
@container game-frame (max-height:740px){
  #app[data-screen="ready"] .modal{
    border-width:12px 14px;
    padding:1px 3px 5px;
  }
  #app[data-screen="ready"] .modal-heading{
    min-height:58px;
    padding:12px 6px 4px;
    margin:0 0 3px;
  }
  #app[data-screen="ready"] .modal-heading>img{
    width:34px;height:34px;top:-12px;
  }
  #app[data-screen="ready"] .modal-heading h1{
    font-size:19px;line-height:1.1;margin:0 0 2px;
  }
  #app[data-screen="ready"] .modal-heading p{
    font-size:9px;line-height:1.2;
  }
  #app[data-screen="ready"] .modal>p{
    font-size:9px;line-height:1.25;margin:3px 0;
  }
  #app[data-screen="ready"] .warning-count{
    min-height:36px;height:36px;padding:2px;font-size:12px;
  }
  #app[data-screen="ready"] .warning-count img{width:24px;height:24px}
  #app[data-screen="ready"] .modal .gold-btn{
    min-height:34px;border-width:8px 18px;margin-top:3px;font-size:16px;
  }
  #app[data-screen="ready"] .modal .secondary{
    min-height:32px;border-width:7px 11px;margin-top:3px;font-size:15px;
  }
}