*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;font:16px/1.4 Arial,sans-serif;background:#b4d28d;color:#173f35}body{--u:1px;--paper:#fffbea;--ink:#173f35;--accent:#ffdf51}button,a{font-family:Quack,Arial,sans-serif}button{font-size:14px;border:1.5px solid var(--ink);border-radius:12px;background:var(--paper);color:var(--ink);min-height:44px;padding:9px 13px;cursor:pointer;touch-action:manipulation}button:hover:enabled{background:#ffe991}button:disabled{opacity:.48;cursor:default}button:focus-visible,a:focus-visible{outline:3px solid #1aab96;outline-offset:3px}button.primary{background:var(--accent)}[hidden]{display:none!important}#builder-game,#world{position:absolute;inset:0;width:100%;height:100%}#world{touch-action:none;display:block;outline:none}img{object-fit:contain}.builder-header{position:absolute;top:calc(10 * var(--u) + env(safe-area-inset-top));left:calc(12 * var(--u));right:calc(12 * var(--u));display:flex;justify-content:space-between;pointer-events:none}.builder-header a{display:flex;align-items:center;gap:8px;background:var(--paper);border:2px solid var(--ink);border-radius:12px;color:var(--ink);text-decoration:none;padding:8px 13px;pointer-events:auto;font-size:16px}.header-actions{display:flex;gap:6px}.header-actions button{pointer-events:auto;width:44px;height:44px;padding:8px}.header-actions img{width:25px;height:25px}.builder-wallet{position:absolute;top:10px;left:50%;transform:translateX(-50%);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border:2px solid var(--ink);border-radius:13px;padding:8px;background:var(--paper);width:400px;box-shadow:0 3px #173f3525}.builder-wallet>div{display:grid;grid-template-columns:24px 1fr;gap:0 4px;padding:0 8px;border-right:1px solid #c7d3ba}.builder-wallet>div:last-child{border:0}.builder-wallet img{width:24px;height:28px;grid-row:1/3}.builder-wallet span{font-size:12px}.builder-wallet strong{font:700 17px Quack,Arial;white-space:nowrap}.builder-dock{position:absolute;left:12px;top:88px;display:grid;gap:8px}.builder-dock button{width:72px;display:flex;flex-direction:column;align-items:center;gap:2px;padding:7px 4px;box-shadow:0 3px #173f3525}.builder-dock img{width:29px;height:29px}.builder-dock small{font:12px Arial}.island-info{position:absolute;right:12px;top:78px;display:flex;flex-direction:column;align-items:end;gap:5px;pointer-events:none;font-size:12px}.island-info span{background:#173f35df;color:#fffbe8;border-radius:15px;padding:5px 10px}.island-info #raid-status{background:#fff0c8;color:#725125;border:1px solid #bd9c61}.builder-goal{position:absolute;left:50%;top:80px;transform:translateX(-50%);max-width:360px;text-align:center;background:#fffbe9e8;border-radius:10px;padding:8px 13px;font-size:13px;pointer-events:none;margin:0}#toast{position:absolute;left:50%;top:150px;transform:translateX(-50%);max-width:380px;background:var(--accent);border:1.5px solid var(--ink);padding:9px 12px;border-radius:12px;font-size:13px;opacity:0;pointer-events:none;transition:opacity .2s;z-index:9}#toast.show{opacity:1}.builder-drawer{position:absolute;left:96px;top:80px;bottom:135px;width:370px;max-width:calc(100vw - 120px);padding:17px;background:var(--paper);border:2px solid var(--ink);border-radius:20px;box-shadow:0 8px 30px #173f3533;z-index:7;display:flex;flex-direction:column}.drawer-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;gap:10px}.drawer-heading h1{font-size:23px;line-height:1.1;margin:0}.drawer-heading button{width:36px;min-height:36px;height:36px;padding:0;font-size:24px}#drawer-content{overflow:auto;overscroll-behavior:contain;min-height:0;padding:0 3px 3px}#drawer-content p{font-size:14px;margin:8px 0;color:#547062}.build-filters{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:12px}.build-filters button{font:13px Arial;min-height:36px;padding:6px 9px}.build-filters button[aria-pressed=true]{background:var(--accent)}.build-catalog{display:grid;grid-template-columns:1fr 1fr;gap:9px}.catalog-card{display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:5px;padding:12px;background:#f0f1de}.catalog-card img{width:44px;height:44px;align-self:center}.catalog-card strong{font-size:15px}.catalog-card span{font:12px/1.4 Arial}.catalog-card .materials{color:#5d744e}.catalog-card:disabled .materials{color:#a34931}.building-detail{display:grid;gap:10px}.building-detail>.building-icon{width:72px;height:72px;justify-self:center}.building-detail progress{width:100%;accent-color:#21a18c}.detail-stats{display:flex;gap:5px;flex-wrap:wrap}.detail-stats span{font:12px Arial;background:#e8edda;padding:7px;border-radius:8px}.building-detail .crew-list{display:grid;gap:6px}.crew-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px;border:1px solid #c6d2b8;border-radius:11px}.crew-row img{width:36px;height:36px}.crew-row>div{flex:1}.crew-row strong{font-size:14px}.crew-row small{display:block;font-size:12px;color:#56715b}.crew-row select{max-width:140px;background:#fffbe8;border:1px solid #b4c7a6;border-radius:8px;padding:8px;color:var(--ink);font-size:14px}.village-list{display:grid;gap:8px}.village-list button{display:flex;align-items:center;text-align:left;gap:10px}.village-list img{width:40px;height:40px}.village-list small{display:block;font:12px Arial;margin-top:4px}.placement{position:absolute;left:50%;bottom:145px;transform:translateX(-50%);width:min(470px,calc(100vw - 24px));padding:12px;background:var(--paper);border:2px solid var(--ink);border-radius:16px;display:grid;gap:6px;text-align:center;z-index:8}.placement>span{font-size:13px}.placement>div{display:flex;gap:7px;justify-content:center}.context-action{position:absolute;left:50%;bottom:125px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:5px}.context-action>span{background:#173f35df;color:#fffbe8;padding:4px 9px;border-radius:15px;font-size:12px;white-space:nowrap}.context-action>span:empty{display:none}.context-action button{min-width:145px}.builder-touch{position:absolute;left:14px;right:14px;bottom:calc(22px + env(safe-area-inset-bottom));display:flex;justify-content:space-between;align-items:end;pointer-events:none}.action-buttons{display:flex;gap:8px;align-items:end}.action-buttons button{pointer-events:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-width:54px;touch-action:none;user-select:none}.action-buttons #quack{width:90px;height:66px}.action-buttons #quack img{width:30px;height:30px}.action-buttons #chop{font-size:22px}.action-buttons #chop span{font-size:12px}#joystick{display:none;width:85px;height:85px;border:2px solid #173f3580;border-radius:50%;place-items:center;background:#fffbe855;pointer-events:auto;touch-action:none}#stick{width:32px;height:32px;background:#ffeb91;border:2px solid var(--ink);border-radius:50%;pointer-events:none}#save-status{position:absolute;bottom:4px;right:15px;background:#173f35ce;color:#fffbea;padding:2px 7px;border-radius:10px;font-size:11px;pointer-events:none}.builder-overlay{position:absolute;inset:0;z-index:20;background:#174e43a6;display:grid;place-items:center;padding:20px}.welcome-card{width:min(430px,100%);max-height:90dvh;overflow:auto;border:2px solid var(--ink);border-radius:24px;background:var(--paper);padding:28px;text-align:center;box-shadow:0 7px #173f3544}.welcome-card>img{width:78px;height:88px}.welcome-card h1{font:700 28px/1.15 Quack,Arial;margin:10px 0}.welcome-card p{font-size:15px;color:#507261}.welcome-card #overlay-actions{display:grid;gap:8px}.welcome-card a{color:var(--ink)}.welcome-card .keyboard-help{font-size:12px}.build-yours .sound-panel{color:var(--ink)}
html[data-phone-ui] body{--u:var(--phone-unit);-webkit-text-size-adjust:100%;text-size-adjust:100%}
html[data-phone-ui] .builder-header a{font-size:calc(12 * var(--u));height:calc(42 * var(--u));padding:calc(7 * var(--u)) calc(10 * var(--u));border-radius:calc(11 * var(--u))}
html[data-phone-ui] .header-actions{gap:calc(4 * var(--u))}html[data-phone-ui] .header-actions button{width:calc(42 * var(--u));height:calc(42 * var(--u));min-height:0;padding:calc(9 * var(--u));font-size:calc(16 * var(--u));border-radius:calc(11 * var(--u))}html[data-phone-ui] .header-actions img{width:calc(22 * var(--u));height:calc(22 * var(--u))}
html[data-phone-ui] .builder-wallet{left:calc(8 * var(--u));right:calc(8 * var(--u));top:calc(59 * var(--u) + env(safe-area-inset-top));width:auto;transform:none;padding:calc(6 * var(--u));border-radius:calc(11 * var(--u))}html[data-phone-ui] .builder-wallet>div{grid-template-columns:1fr;text-align:center;padding:0 calc(3 * var(--u))}html[data-phone-ui] .builder-wallet img{display:none}html[data-phone-ui] .builder-wallet span{font-size:calc(10 * var(--u))}html[data-phone-ui] .builder-wallet strong{font-size:calc(14 * var(--u))}
html[data-phone-ui] .builder-dock{top:calc(114 * var(--u) + env(safe-area-inset-top));left:calc(8 * var(--u));gap:calc(6 * var(--u))}html[data-phone-ui] .builder-dock button{width:calc(56 * var(--u));min-height:calc(48 * var(--u));padding:calc(5 * var(--u));font-size:calc(10 * var(--u));border-radius:calc(11 * var(--u))}html[data-phone-ui] .builder-dock img{width:calc(24 * var(--u));height:calc(24 * var(--u))}html[data-phone-ui] .builder-dock small{font-size:calc(9 * var(--u))}
html[data-phone-ui] .island-info{top:calc(115 * var(--u) + env(safe-area-inset-top));right:calc(8 * var(--u));font-size:calc(9 * var(--u));gap:calc(4 * var(--u))}html[data-phone-ui] .island-info span{padding:calc(4 * var(--u)) calc(7 * var(--u))}html[data-phone-ui] .island-info span:first-child{display:none}
html[data-phone-ui] .builder-goal{top:calc(115 * var(--u) + env(safe-area-inset-top));left:calc(74 * var(--u));transform:none;width:calc(178 * var(--u));font-size:calc(10 * var(--u));padding:calc(7 * var(--u));border-radius:calc(10 * var(--u))}
html[data-phone-ui] #toast{top:calc(175 * var(--u) + env(safe-area-inset-top));width:calc(245 * var(--u));max-width:none;font-size:calc(11 * var(--u));padding:calc(8 * var(--u));border-radius:calc(10 * var(--u))}
html[data-phone-ui] .builder-drawer{zoom:var(--phone-scale);left:8px;top:170px;bottom:145px;width:calc(100vw / var(--phone-scale) - 16px);max-width:none;padding:14px;border-radius:16px}
html[data-phone-ui] .placement{bottom:calc(140 * var(--u) + env(safe-area-inset-bottom));width:calc(370 * var(--u));padding:calc(9 * var(--u));font-size:calc(12 * var(--u));border-radius:calc(13 * var(--u))}html[data-phone-ui] .placement>span{font-size:calc(11 * var(--u))}html[data-phone-ui] .placement button{min-height:calc(40 * var(--u));font-size:calc(12 * var(--u));padding:calc(7 * var(--u)) calc(11 * var(--u))}
html[data-phone-ui] .context-action{bottom:calc(132 * var(--u) + env(safe-area-inset-bottom))}html[data-phone-ui] .context-action>span{font-size:calc(10 * var(--u))}html[data-phone-ui] .context-action button{font-size:calc(12 * var(--u));padding:calc(8 * var(--u));min-height:calc(42 * var(--u));min-width:calc(140 * var(--u));border-radius:calc(11 * var(--u))}
html[data-phone-ui] .builder-touch{left:calc(10 * var(--u));right:calc(10 * var(--u));bottom:calc(20 * var(--u) + env(safe-area-inset-bottom))}html[data-phone-ui] #joystick{display:grid;width:calc(80 * var(--u));height:calc(80 * var(--u))}html[data-phone-ui] #stick{width:calc(32 * var(--u));height:calc(32 * var(--u))}html[data-phone-ui] .action-buttons{gap:calc(5 * var(--u));display:grid;grid-template-columns:calc(48 * var(--u)) calc(66 * var(--u))}html[data-phone-ui] .action-buttons button{min-width:0;min-height:calc(42 * var(--u));font-size:calc(11 * var(--u));padding:calc(5 * var(--u));border-radius:calc(11 * var(--u))}html[data-phone-ui] #chop{grid-column:1;grid-row:1;font-size:calc(18 * var(--u))}html[data-phone-ui] #chop span{font-size:calc(10 * var(--u))}html[data-phone-ui] #run{grid-column:1;grid-row:2}html[data-phone-ui] .action-buttons #quack{grid-column:2;grid-row:1/3;width:calc(66 * var(--u));height:calc(66 * var(--u));font-size:calc(11 * var(--u))}html[data-phone-ui] #quack img{width:calc(28 * var(--u));height:calc(28 * var(--u))}html[data-phone-ui] #save-status{font-size:calc(9 * var(--u));bottom:calc(2 * var(--u) + env(safe-area-inset-bottom))}
html[data-phone-ui] .welcome-card{zoom:var(--phone-scale);width:calc(100vw / var(--phone-scale) - 24px);max-height:calc(90dvh / var(--phone-scale));padding:22px}html[data-phone-ui] .sound-panel{zoom:var(--phone-scale);width:calc(100vw / var(--phone-scale) - 24px)}
html[data-phone-ui][data-phone-layout=landscape] .builder-wallet{top:calc(10 * var(--u));left:calc(160 * var(--u));right:calc(200 * var(--u))}html[data-phone-ui][data-phone-layout=landscape] .builder-dock{top:calc(66 * var(--u));display:flex}html[data-phone-ui][data-phone-layout=landscape] .island-info{top:calc(67 * var(--u))}html[data-phone-ui][data-phone-layout=landscape] .builder-goal{top:calc(67 * var(--u));left:50%;transform:translateX(-50%)}html[data-phone-ui][data-phone-layout=landscape] .builder-drawer{top:65px;bottom:10px;left:190px;width:350px}html[data-phone-ui][data-phone-layout=landscape] .placement{bottom:calc(14 * var(--u));width:calc(340 * var(--u))}html[data-phone-ui][data-phone-layout=landscape] .context-action{bottom:calc(14 * var(--u))}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

@media(any-pointer:coarse){#joystick{display:grid}.builder-touch{pointer-events:none}.builder-touch button,.builder-touch #joystick{pointer-events:auto}}

/* Progression stays in one small card; trade details open on demand. */
.builder-wallet{width:555px;grid-template-columns:repeat(6,minmax(0,1fr))}.builder-wallet>div{padding:0 5px}.builder-wallet strong{font-size:16px}
.builder-goal{left:auto;right:12px;top:82px;transform:none;width:270px;max-width:none;text-align:left;pointer-events:auto;padding:10px 12px;display:grid;gap:4px;border:1.5px solid var(--ink);background:var(--paper)}.builder-goal strong{display:flex;justify-content:space-between;align-items:center;font-size:14px;gap:8px}.builder-goal span{font:13px Arial}.builder-goal small{font:12px Arial;color:#597467}.builder-goal em{font:700 13px Quack,Arial;color:#168477}.builder-goal progress{width:100%;height:5px;accent-color:#219986;border:0}.island-info{top:205px}.island-info span:not(#raid-status){display:none}
.trade-card{display:grid;gap:10px;border:1px solid #b6c7ae;border-radius:14px;background:#f2f3e6;padding:14px;margin-bottom:13px}.trade-card h2,.trade-card h3{margin:0;font-size:17px;line-height:1.2}.trade-card small{font-size:12px;color:#58705a}.trade-card select,.trade-card input[type=number]{width:100%;min-height:42px;padding:8px;border:1px solid #9db699;border-radius:9px;background:#fffbea;color:var(--ink);font:14px Arial}.order-needs{display:grid;gap:5px}.order-needs>div{display:flex;align-items:center;gap:8px;font-size:14px}.order-needs img{width:25px;height:25px}.order-needs span{flex:1}.order-needs .ready strong{color:#158376}.order-needs .missing strong{color:#a85335}.trade-amount{display:flex;align-items:center;gap:10px;margin-top:5px}.trade-amount input[type=range]{width:100%;min-width:0;accent-color:#1c9b83;min-height:40px}.trade-amount input[type=number]{width:86px;flex:none}.trade-card label{font-size:14px}.unlock-row{display:flex;align-items:center;gap:8px}.unlock-row>img{width:36px;height:36px}.unlock-row>div{flex:1;min-width:0}.unlock-row strong{font-size:14px;display:block}.unlock-row small{display:block;margin-top:3px}.unlock-row button{padding:6px 9px;font-size:12px}.builder-drawer>#drawer-content>button{width:100%}
@media(max-width:1000px){html:not([data-phone-ui]) .builder-wallet{top:68px;left:96px;right:12px;width:auto;transform:none}html:not([data-phone-ui]) .builder-goal{top:145px}html:not([data-phone-ui]) .island-info{top:272px}}
html[data-phone-ui] .builder-goal{left:auto;right:calc(8 * var(--u));top:calc(115 * var(--u) + env(safe-area-inset-top));transform:none;width:calc(218 * var(--u));padding:calc(8 * var(--u));gap:calc(3 * var(--u))}html[data-phone-ui] .builder-goal strong{font-size:calc(11 * var(--u));gap:calc(5 * var(--u))}html[data-phone-ui] .builder-goal span,html[data-phone-ui] .builder-goal em{font-size:calc(10 * var(--u))}html[data-phone-ui] .builder-goal small{font-size:calc(9 * var(--u))}html[data-phone-ui] .builder-goal progress{height:calc(4 * var(--u))}html[data-phone-ui] .island-info{top:calc(222 * var(--u) + env(safe-area-inset-top))}html[data-phone-ui] #toast{top:calc(280 * var(--u) + env(safe-area-inset-top))}
html[data-phone-ui][data-phone-layout=landscape] .builder-goal{top:calc(65 * var(--u));right:calc(8 * var(--u));left:auto;transform:none;width:calc(210 * var(--u))}html[data-phone-ui][data-phone-layout=landscape] .island-info{top:calc(170 * var(--u))}

#construction-progress{position:absolute;inset:0;pointer-events:none;overflow:hidden}.construction-badge{position:absolute;left:0;top:0;display:grid;gap:3px;min-width:120px;padding:6px 9px;border:1px solid #296852;border-radius:9px;background:#fffbeaee;color:#173f35;box-shadow:0 2px 4px #173f3530;font:12px/1.2 Arial;white-space:nowrap;pointer-events:none}.construction-badge progress{width:100%;height:5px;accent-color:#1da28a}.zoom-controls{position:absolute;left:14px;bottom:120px;display:flex;gap:4px}.zoom-controls button{width:38px;min-height:36px;padding:4px;font-size:18px}.zoom-controls #zoom-reset{font-size:12px}html[data-phone-ui] .zoom-controls{left:calc(10 * var(--u));bottom:calc(115 * var(--u) + env(safe-area-inset-bottom))}html[data-phone-ui] .zoom-controls button{width:calc(30 * var(--u));min-height:calc(30 * var(--u));font-size:calc(15 * var(--u));padding:calc(3 * var(--u))}html[data-phone-ui] .zoom-controls #zoom-reset{font-size:calc(10 * var(--u))}html[data-phone-ui] .construction-badge{font-size:calc(10 * var(--u));min-width:calc(105 * var(--u));padding:calc(5 * var(--u)) calc(7 * var(--u))}

/* Expansion controls share the compact village panels. */
.expansion-controls{display:grid;gap:12px;margin-top:18px;padding-top:16px;border-top:1px solid #9caf95}.expansion-controls:empty{display:none}.expansion-controls h2{font-size:18px;margin:0}.expansion-controls p{margin:0;line-height:1.5}.expansion-controls small{display:block;line-height:1.5}.expansion-controls label{display:grid;gap:8px}.expansion-controls input[type=range]{width:100%;accent-color:#187b6b}.expansion-controls progress{width:100%;height:12px;accent-color:#239b7d}.recipe-choice{display:grid;gap:10px;border:1px solid #b3c3a4;background:#f0f2e3;padding:14px;border-radius:12px}.monument-stage{display:grid;gap:5px;border-left:3px solid #d5b94e;padding:8px 12px}.material-strip{border-radius:10px;background:#e7eedc;padding:10px 12px;font-weight:700}.building-detail>select{min-height:44px;width:100%;margin-top:8px}.building-detail>strong{margin-top:18px}.expansion-controls button{min-height:44px}.expansion-controls .primary:disabled{opacity:.55}

/* Town controls stay inside compact expandable cards. */
.town-fold,.chapter-card,.policy-card{border:1px solid #acc1ac;border-radius:14px;padding:12px;background:#f2f2e5;margin:12px 0}.town-fold summary{cursor:pointer;font-weight:800;padding:5px}.town-fold>div{display:grid;gap:9px;padding-top:10px}.town-fold small{line-height:1.5}.style-swatches{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.style-swatches button[aria-pressed=true]{background:#ffe778}.policy-card label{display:grid;gap:6px;margin:14px 0}.policy-card input{width:100%;font:inherit;padding:10px;border:1px solid #9ab8a1;border-radius:9px}.chapter-card h2{margin:7px 0}.chapter-card p{margin:8px 0}.chapter-trail{font-size:11px;opacity:.8}.crew-row .cart-toggle{grid-column:2 / -1;padding:5px;font-size:12px}
/* Expanded supplies retain their order and readable phone sizes. */
.builder-wallet{width:min(800px,calc(100vw - 370px));grid-template-columns:repeat(9,minmax(0,1fr))}.builder-wallet>div{grid-template-columns:18px 1fr;padding:0 5px;gap:0 3px}.builder-wallet img{width:18px;height:26px}.builder-wallet span{font-size:11px}.builder-wallet strong{font-size:15px}.builder-wallet>div:nth-child(7){border-left:1px solid #90b2a0}
@media(max-width:1150px){html:not([data-phone-ui]) .builder-wallet{top:66px;left:96px;right:12px;width:auto;transform:none}html:not([data-phone-ui]) .builder-goal{top:130px}html:not([data-phone-ui]) .island-info{top:254px}}
html[data-phone-ui] .builder-wallet{display:flex;overflow-x:auto;scrollbar-width:thin;overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding:calc(6 * var(--u));gap:0}html[data-phone-ui] .builder-wallet>div{flex:0 0 calc(60 * var(--u));grid-template-columns:1fr;scroll-snap-align:start;padding:0 calc(3 * var(--u))}html[data-phone-ui] .builder-wallet span{font-size:calc(10 * var(--u))}html[data-phone-ui] .builder-wallet strong{font-size:calc(14 * var(--u))}html[data-phone-ui] .builder-wallet>div:nth-child(7){border-left:0}
.training-list{display:grid;gap:12px}.training-card,.diver-card{padding:13px;border:1px solid #a9c3b0;border-radius:13px;background:#edf3e7;display:grid;gap:8px}.training-heading{display:flex;justify-content:space-between;gap:8px}.training-heading span{font-size:12px;white-space:nowrap;color:#57765d}.training-card small,.diver-card small{font:12px/1.5 Arial;color:#52705f}.training-card progress,.diver-card progress{width:100%;height:7px;accent-color:#229889}.training-card p{margin:0!important}.diver-card h2{margin:0;font-size:18px}.diver-card input{width:100%;accent-color:#238f8c}.mission-rewards{background:#fff4ca;border-radius:10px;padding:9px}#diver-status{pointer-events:auto;background:#d0eee6;min-height:28px;padding:4px 9px;font-size:12px}.crew-row{flex-wrap:wrap}.crew-row .cart-toggle{margin-left:auto}
html[data-phone-ui] #diver-status{font-size:calc(10 * var(--u));min-height:calc(26 * var(--u));padding:calc(4 * var(--u)) calc(8 * var(--u))}

html[data-phone-ui][data-phone-layout=portrait] .builder-wallet{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));overflow:visible;row-gap:calc(5 * var(--u))}html[data-phone-ui][data-phone-layout=portrait] .builder-wallet>div{border-right:1px solid #c7d3ba}html[data-phone-ui][data-phone-layout=portrait] .builder-wallet>div:nth-child(5),html[data-phone-ui][data-phone-layout=portrait] .builder-wallet>div:last-child{border-right:0}html[data-phone-ui][data-phone-layout=portrait] .builder-dock,html[data-phone-ui][data-phone-layout=portrait] .builder-goal{top:calc(151 * var(--u) + env(safe-area-inset-top))}html[data-phone-ui][data-phone-layout=portrait] .island-info{top:calc(258 * var(--u) + env(safe-area-inset-top))}html[data-phone-ui][data-phone-layout=portrait] #toast{top:calc(333 * var(--u) + env(safe-area-inset-top))}html[data-phone-ui][data-phone-layout=portrait] .builder-drawer{top:205px}html[data-phone-ui][data-phone-layout=landscape] .builder-wallet{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));overflow:visible}html[data-phone-ui][data-phone-layout=landscape] .builder-wallet>div{padding:0 calc(2 * var(--u))}

.life-card{display:grid;gap:9px;margin:0 0 16px;padding:15px;border:1px solid #b0c2ac;border-radius:14px;background:#eef4e5}.life-card h2,.life-card p{margin:0}.life-card h2{font-size:19px}.life-card p{font:14px/1.4 Arial}.life-card small{font:12px/1.5 Arial;color:#55735d}.life-card progress{width:100%;height:10px;accent-color:#289e80}.mood-parts{display:grid;grid-template-columns:1fr 1fr;gap:7px;font-size:13px}.event-card{background:#fff1c5}.worker-settings{width:100%;font-size:13px;border-top:1px solid #c3d1b8;padding-top:8px}.worker-settings summary{cursor:pointer}.worker-settings label{display:grid;gap:5px;margin-top:9px}.worker-settings .protect-worker{display:flex;align-items:center;gap:8px}.protect-worker input{width:19px;height:19px}.worker-settings small{display:block;margin-top:8px;line-height:1.4}.floor-controls{position:absolute;left:14px;bottom:168px;background:#fffbea;border:1.5px solid #275e50;border-radius:10px;padding:6px;pointer-events:auto}.floor-controls small{font:11px Arial;display:block;margin-bottom:4px}.floor-controls>div{display:flex;gap:3px}.floor-controls button{font-size:12px;min-height:32px;padding:5px 9px}.floor-controls button[aria-pressed=true]{background:#ffe36b}#life-status{font-size:12px;padding:5px 9px;background:#fff1ad;pointer-events:auto}html[data-phone-ui] .floor-controls{left:calc(10 * var(--u));bottom:calc(157 * var(--u) + env(safe-area-inset-bottom));padding:calc(5 * var(--u))}html[data-phone-ui] .floor-controls button{font-size:calc(10 * var(--u));min-height:calc(27 * var(--u));padding:calc(4 * var(--u)) calc(7 * var(--u))}html[data-phone-ui] .floor-controls small{font-size:calc(9 * var(--u))}html[data-phone-ui] #life-status{font-size:calc(10 * var(--u));padding:calc(4 * var(--u)) calc(7 * var(--u))}.diver-card select{width:100%;min-height:42px;border:1px solid #9caf95;border-radius:8px;background:#fffbea;color:var(--ink);padding:8px;font:14px Arial}.diver-card label{display:grid;gap:5px}

.floor-choice{display:flex;justify-content:center;align-items:center;gap:8px;font-size:12px}.floor-choice select{min-height:36px;padding:5px 10px;border:1px solid #8eaf9b;border-radius:8px;background:#edf4e5;color:var(--ink);font:inherit}#drawer-content .floor-guide{background:#e3eedc;border-radius:10px;padding:12px;font-size:13px;line-height:1.6}html[data-phone-ui] .floor-choice{font-size:calc(11 * var(--u))}html[data-phone-ui] .floor-choice select{min-height:calc(32 * var(--u));padding:calc(5 * var(--u)) calc(9 * var(--u))}

.floor-controls #upper-floors{display:block;width:100%;margin-top:6px;min-height:36px;font-size:13px}html[data-phone-ui] .floor-controls #upper-floors{font-size:calc(11 * var(--u));min-height:calc(32 * var(--u))}

.kit-themes{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.kit-themes button{font-size:14px;min-height:42px;border-left:7px solid var(--kit-color);padding:8px 10px}.kit-themes button[aria-pressed=true]{background:#ffe36b;box-shadow:0 0 0 2px #28634f}.floor-controls #room-view{display:block;width:100%;margin-top:5px;min-height:36px;font-size:13px}.floor-controls #room-view[hidden]{display:none}.building-detail label{display:grid;gap:7px}.building-detail select{min-height:44px;padding:8px;border:1px solid #436f60;border-radius:8px;background:#fffbea;color:var(--ink);font:14px Arial}.building-detail small{font:13px/1.5 Arial}html[data-phone-ui] .floor-controls #room-view{font-size:calc(11 * var(--u));min-height:calc(32 * var(--u))}

/* Shared Inbox fits the village drawer and retains a visible header badge. */
.header-actions #inbox-open{position:relative;width:auto;display:flex;align-items:center;gap:6px;padding:8px 12px}.inbox-label{font-size:14px}#inbox-count{pointer-events:none;top:-5px;right:-5px;font:700 12px/20px Arial;min-width:20px;text-align:center}
.builder-inbox .inbox-social-grid{grid-template-columns:1fr}.builder-inbox .inbox-social-card p,.builder-inbox .inbox-social-card button,.builder-inbox .inbox-social-link,.builder-inbox .inbox-hint,.builder-inbox .inbox-reward,.builder-inbox .inbox-pagination{font-size:14px!important}.builder-inbox .inbox-letter-heading small,.builder-inbox .inbox-social-heading small,.builder-inbox .inbox-status{font-size:12px}.builder-inbox button{min-height:44px}.builder-inbox>.inbox-tabs{background:var(--paper)}.builder-gift{display:grid;gap:12px}.builder-gift h2{font-size:20px;margin:0}.builder-gift>button,.builder-inbox>button{width:100%;margin-top:8px}
html[data-phone-ui] .header-actions #inbox-open{width:calc(42 * var(--u));padding:calc(9 * var(--u))}html[data-phone-ui] .inbox-label{display:none}html[data-phone-ui] #inbox-count{font-size:calc(11 * var(--u));line-height:calc(18 * var(--u));min-width:calc(18 * var(--u));top:calc(-4 * var(--u));right:calc(-4 * var(--u))}

/* Device-local graphics controls keep the game visible and running. */
.graphics-icon{font:28px/29px Arial}.graphics-fps{position:absolute;right:12px;bottom:36px;min-height:32px;padding:5px 9px;font:700 13px Arial;background:#173f35e8;color:#fffbea;z-index:5}.graphics-drawer{width:590px;max-width:calc(100vw - 120px)}.graphics-presets{display:flex;flex-wrap:wrap;gap:7px}.graphics-presets button{flex:1;min-width:70px;min-height:44px;padding:8px;font-size:14px}.graphics-presets button[aria-pressed=true]{background:#ffdf51;box-shadow:inset 0 0 0 1px #173f35}.graphics-note{min-height:2.8em}.graphics-options{display:grid;grid-template-columns:1fr 1fr;gap:12px}.graphics-options label{display:grid;align-content:start;gap:7px;border:1px solid #b1c4ac;border-radius:12px;padding:12px;background:#edf3e5;min-width:0}.graphics-options strong{font-size:15px}.graphics-options small{font:13px/1.45 Arial;color:#42614f}.graphics-options select{width:100%;min-height:44px;border:1px solid #71937c;border-radius:8px;background:#fffbea;color:#173f35;font:14px Arial;padding:8px}.graphics-actions{display:flex;gap:8px;position:sticky;bottom:0;padding:10px 0;background:#fffbea}.graphics-actions button{flex:1;min-height:44px}#drawer-content .graphics-live{padding:10px;border-radius:8px;background:#173f35;color:#fffbea;font:700 14px Arial;min-height:38px}
@media(max-width:600px){.graphics-options{grid-template-columns:1fr}.graphics-drawer{max-width:calc(100vw - 20px);left:10px}}
html[data-phone-ui] .graphics-icon{font-size:calc(24 * var(--u));line-height:calc(24 * var(--u))}html[data-phone-ui] .graphics-fps{right:calc(10 * var(--u));bottom:calc(110 * var(--u) + env(safe-area-inset-bottom));font-size:calc(12 * var(--u));min-height:calc(28 * var(--u));padding:calc(5 * var(--u)) calc(8 * var(--u))}html[data-phone-ui] .graphics-drawer{top:70px;bottom:12px;left:72px;width:calc(100vw / var(--phone-scale) - 84px);max-width:none}html[data-phone-ui][data-phone-layout=portrait] .graphics-drawer{top:151px;left:8px;bottom:12px;width:calc(100vw / var(--phone-scale) - 16px)}html[data-phone-ui][data-phone-layout=portrait] .graphics-options{grid-template-columns:1fr}html[data-phone-ui] .graphics-options select,html[data-phone-ui] .graphics-presets button,html[data-phone-ui] .graphics-actions button{min-height:44px}

.graphics-options select{font-size:16px}