@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@500;600;700;800&family=Be+Vietnam+Pro:wght@400;500;600;700;800&display=swap');
:root{font-family:'Be Vietnam Pro',sans-serif;color:#503b2b;--brown:#65432b;--cream:#fff3cf;--gold:#f4c356;--green:#54875e}*{box-sizing:border-box}body{margin:0;background:#203c38;overflow:hidden}button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}button:focus-visible{outline:3px solid white;outline-offset:3px}button:disabled{cursor:not-allowed;filter:grayscale(.6);opacity:.65}button:active:not(:disabled){transform:translateY(3px) scale(.97)}#game{width:min(100vw,calc(100dvh * .5625));height:100dvh;max-height:1200px;margin:auto;position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(#98c3bf 0 15%,#e5c88d 15% 50%,#9baca5 50% 85%,#5c6864 85%)}.world{position:absolute;inset:0;z-index:-2;overflow:hidden}.world>img{width:100%;height:100%;object-fit:cover;display:block}.world>canvas{position:absolute;inset:0;width:100%;height:100%;z-index:2}.sunlight{position:absolute;inset:0;background:linear-gradient(125deg,#fff3bf22,transparent 40%,#f2b26a08);pointer-events:none}.shop-sign{position:absolute;top:36.7%;left:22%;width:56%;height:9%;display:flex;justify-content:center;align-items:center;flex-direction:column;background:linear-gradient(#a54832,#7b302a);border:3px solid #dcad67;border-radius:5px;box-shadow:0 4px 0 #49372d88,0 0 16px #ffd99e22;color:#ffedba;text-shadow:0 2px 0 #4c2920;transform:rotate(-.4deg);z-index:1}.shop-sign small{font-size:clamp(5px,1.45dvh,10px);letter-spacing:1.4px}.shop-sign strong{font:800 clamp(22px,4.7dvh,42px)/1.05 'Baloo 2',Georgia,serif}.shop-sign>span{font-size:clamp(5px,1dvh,8px);letter-spacing:2px;margin-top:2px}.hud{position:absolute;top:max(14px,env(safe-area-inset-top));left:12px;right:12px;display:flex;gap:10px;align-items:flex-start;z-index:5}.rank{background:linear-gradient(#f8db8c,#ebad53);border:3px solid #fff0b9;border-radius:23% 23% 40% 40%;box-shadow:0 3px 0 #6f4b33,0 5px 10px #273d3744;color:#613b2b;width:73px;flex-shrink:0;padding:5px 3px;display:flex;align-items:center;flex-direction:column}.rank>span{font-size:32px;line-height:1.1;filter:drop-shadow(0 2px 0 #936a43)}.rank strong{color:#fff1a7;font-size:17px;letter-spacing:1px;text-shadow:0 2px #9a7139,1px 0 #9a7139}.rank small{font-size:8px;font-weight:800}.resources{flex:1;min-width:0;display:grid;gap:8px;padding-top:7px}.resource{height:33px;display:flex;align-items:center;gap:7px;background:linear-gradient(#fff7d8,#f1d7a5);border:2px solid #8b653f;border-radius:20px;box-shadow:0 2px 0 #4e3b2b77;padding:0 3px 0 5px;position:relative}.resource>span{font-size:22px;line-height:1}.resource .coin{display:grid;place-items:center;background:linear-gradient(#ffe6a0,#e8a529);border:2px solid #fff0af;border-radius:50%;color:#a96a23;width:34px;height:34px;font-family:Georgia,serif;font-weight:bold;box-shadow:0 1px 2px #62442377;margin-left:-11px}.resource strong{font-size:13px;white-space:nowrap;flex:1;font-weight:800;font-variant-numeric:tabular-nums}.resource button{border:2px solid #d8f0ae;border-radius:50%;background:linear-gradient(#85be5c,#427f49);color:white;text-shadow:0 1px #385f35;font-size:23px;line-height:23px;width:27px;height:27px;padding:0;font-weight:bold}.resource small{font-size:7px;color:#8a7150;margin-right:6px}.reputation{width:88%;height:27px}.reputation>span{font-size:23px;margin-left:-8px}.reputation strong{font-size:11px}.hud.hud-hidden>.rank,.hud.hud-hidden>.resources{display:none}.hud>.top-actions{margin-left:auto}.top-actions{display:grid;grid-template-columns:1fr 1fr;gap:5px;padding-top:6px}.top-actions button{color:#ffebc9;background:#354b43d9;border:2px solid #a3b49d;border-radius:14px;width:33px;height:34px;box-shadow:0 3px 0 #23382d;font-size:20px;padding:0}.side-stats{position:absolute;top:128px;left:12px;z-index:4;display:grid;gap:7px}.side-stats>div{display:grid;grid-template-columns:22px auto;align-items:center;background:#304e42de;border:1px solid #bed3a466;box-shadow:0 2px 0 #243a2d66;border-radius:7px;padding:5px 9px 5px 5px;color:#fff4cf;font-size:17px;min-width:102px}.side-stats strong{font-size:12px;text-align:right}.side-stats small{grid-column:2;font-size:7px;text-align:right;color:#d2d8b8}.location-pill{position:absolute;left:50%;transform:translateX(-50%);top:14%;font-size:8px;letter-spacing:1.4px;color:#fff8df;background:#334a3ec7;border:1px solid #f8e3b76b;padding:7px 12px;border-radius:20px;white-space:nowrap;z-index:3;backdrop-filter:blur(6px)}#save-dot{color:#b7d87c;font-size:7px;margin-left:7px}.scene-hint{position:absolute;bottom:calc(11% + 13px);left:0;right:0;text-align:center;color:#fff6dc;text-shadow:0 1px 3px #253529,1px 0 3px #253529;font-size:9px;z-index:4;pointer-events:none}.bottom-nav{position:absolute;bottom:0;left:0;right:0;height:11%;min-height:77px;display:flex;justify-content:space-around;align-items:center;padding:4px 4px max(5px,env(safe-area-inset-bottom));background:linear-gradient(#4f57374d,#463c29f5 40%);border-top:1px solid #ffdfa730;z-index:5}.bottom-nav:before{content:'';position:absolute;bottom:0;left:-10%;right:-10%;height:15px;background:#302e23;z-index:-1}.bottom-nav button{background:none;border:0;color:#fff0cc;display:flex;align-items:center;flex-direction:column;gap:4px;padding:0;width:20%;height:100%;justify-content:center;text-shadow:0 2px 2px #33261c,1px 0 #523822,-1px 0 #523822}.bottom-nav span{font-size:clamp(26px,4.8dvh,46px);line-height:1.15;filter:drop-shadow(0 3px 1px #32281d);transition:transform .2s}.bottom-nav button:hover span{transform:translateY(-4px)}.bottom-nav strong{font:700 clamp(10px,1.7dvh,15px) 'Baloo 2',sans-serif;letter-spacing:.2px}.lamp{position:absolute;width:8px;height:8px;background:#fff2b0;border-radius:50%;box-shadow:0 0 12px 7px #ffce6a66;animation:glow 3s ease-in-out infinite;top:47%;z-index:1}.lamp-a{left:30%}.lamp-b{right:29%;animation-delay:1s}.smoke{position:absolute;top:48%;left:22%;height:8%;width:5%;background:radial-gradient(ellipse,#fff5dd88,transparent 70%);filter:blur(4px);animation:steam 4s linear infinite;pointer-events:none;z-index:3}.smoke-b{animation-delay:2s;left:24%}@keyframes steam{0%{transform:translateY(10px) scale(.7);opacity:0}30%{opacity:.7}100%{transform:translate(9px,-40px) scale(1.9);opacity:0}}@keyframes glow{50%{opacity:.65;box-shadow:0 0 10px 4px #ffce6a44}}.float{position:absolute;color:#fff0aa;font:800 22px 'Baloo 2',sans-serif;text-shadow:0 2px #75452a,1px 0 #75452a;animation:float 1.2s ease-out forwards;z-index:8;pointer-events:none}@keyframes float{to{transform:translateY(-65px);opacity:0}}.desktop-note{display:none}dialog{width:440px;max-width:calc(100vw - 20px);max-height:85dvh;overflow:auto;padding:0;border:3px solid #825736;border-radius:22px;background:#fff3d5;color:#5c412c;box-shadow:0 7px 0 #4c382a,0 20px 80px #132c2aaa;overscroll-behavior:contain}dialog::backdrop{background:#162f2977;backdrop-filter:blur(3px)}.sheet-top{display:flex;align-items:center;justify-content:space-between;padding:20px 21px 16px;background:linear-gradient(#ffe6a9,#f6d292);border-bottom:2px solid #e3bf82;position:sticky;top:0;z-index:2}.sheet-top small{font-size:8px;letter-spacing:1.7px;color:#957041;font-weight:700}.sheet-top h1{font:800 27px/1.2 'Baloo 2',sans-serif;margin:4px 0 0}.sheet-top button{border:2px solid #fff2c7;border-radius:50%;background:#a95b3b;color:#fff5d8;width:32px;height:32px;box-shadow:0 2px 0 #774329;padding:0}#sheet-body{padding:18px}.tabs{display:flex;gap:5px;margin-bottom:12px}.tabs button{border:1px solid #d8ba86;background:#f0dfb9;color:#997853;border-radius:10px;padding:10px 4px;flex:1;font-size:10px;font-weight:700}.tabs button.active{background:#63875c;border-color:#46694b;color:#fff8d9;box-shadow:0 2px 0 #37593c}.upgrade{padding:14px 10px;display:flex;align-items:center;gap:11px;border:1px solid #e6cfa1;background:#fffaf0;border-radius:13px;margin-bottom:9px;box-shadow:0 3px 0 #ead3a6}.item-icon{background:#f3e0b9;border:2px solid #ecd09d;border-radius:12px;display:grid;place-items:center;font-size:32px;width:54px;height:56px;flex-shrink:0}.item-info{flex:1;min-width:0}.item-info h2{font:800 17px/1.2 'Baloo 2',sans-serif;margin:0 0 4px}.item-info p{font-size:9px;line-height:1.6;margin:0;color:#937d62}.item-info small{display:block;font-size:8px;margin-top:5px;color:#a28b63}.buy{background:linear-gradient(#8cb360,#588947);border:2px solid #e6f2bf;border-radius:10px;box-shadow:0 3px 0 #3a6439;color:#fff9df;font-size:10px;font-weight:800;padding:9px 8px;min-width:79px;text-shadow:0 1px #476439}.buy:disabled{background:#d0c5a8;box-shadow:0 2px #ac9e80;border-color:#e4d7bb;color:#776d54;text-shadow:none}.detail{font-size:11px;line-height:1.9;color:#8c7352;margin:12px 1px}.wide-button.confirm{background:linear-gradient(#d9534f,#a3322e);border-color:#ffd0c9;box-shadow:0 3px 0 #6d1f1c}.wide-button{width:100%;padding:13px;border:2px solid #f7df97;border-radius:12px;background:linear-gradient(#d98548,#b55a32);box-shadow:0 3px 0 #87492d;color:#fff6d8;font:800 19px 'Baloo 2',sans-serif}.journey-item{padding:17px;margin-bottom:12px;background:#fffaf0;border:1px solid #e2c594;border-radius:13px;display:flex;gap:14px}.journey-item>span{font-size:35px}.journey-item h2{font:800 20px 'Baloo 2',sans-serif;margin:0}.journey-item p{font-size:10px;line-height:1.8;color:#937858;margin:3px 0}.journey-item.current{border:2px solid #8ea666;background:#f3f5df}.track{height:10px;background:#dfcda9;border-radius:20px;overflow:hidden;margin:14px 0}.track i{display:block;height:100%;background:linear-gradient(90deg,#96b66a,#5f8d54);border-radius:20px;transition:width .3s}.city-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.city{padding:20px 12px;background:#f0e4c9;border:2px dashed #ceb98c;border-radius:13px;text-align:center}.city:first-child{background:#f3f5df;border:2px solid #8ea666}.city>span{font-size:36px;display:block}.city strong{display:block;font:800 20px 'Baloo 2',sans-serif;margin:8px 0 3px}.city small{font-size:9px;color:#917b59}.welcome{padding:10px;text-align:center}.welcome>span{font-size:65px}.welcome h2{font:800 30px 'Baloo 2',sans-serif;margin:10px}.welcome p{font-size:12px;line-height:1.8;color:#8d7151}.welcome strong{font:800 33px 'Baloo 2',sans-serif;color:#68824b}#toast{position:fixed;top:50%;left:50%;transform:translate(-50%,-30%);opacity:0;pointer-events:none;background:#fff1cceb;border:2px solid #a87b47;border-radius:15px;padding:14px 21px;font-size:12px;box-shadow:0 4px 0 #70512f99;text-align:center;z-index:20;max-width:85vw;transition:opacity .2s,transform .2s}#toast.show{opacity:1;transform:translate(-50%,-50%)}@media(min-width:850px){body{background:radial-gradient(ellipse at 50% 40%,#65816b,#203c38 65%)}#game{box-shadow:0 0 100px #142e2a,0 0 0 6px #a39b7044}.desktop-note{position:fixed;display:block;left:calc(50% + 100dvh * .28125 + 45px);top:40%;width:210px;color:#f1e5bd}.desktop-note>strong{font:800 38px 'Baloo 2',sans-serif}.desktop-note>span{font-size:10px;letter-spacing:1.5px;display:block}.desktop-note p{font:600 19px/1.7 'Baloo 2',sans-serif;color:#b1c1a5}.desktop-note small{font-size:9px;color:#98ad96}.desktop-note:before{content:'HÀ NỘI · VIỆT NAM';display:block;font-size:8px;letter-spacing:3px;color:#9daf91;margin-bottom:15px}}@media(max-width:600px){#game{width:100vw}.hud{gap:8px}.rank{width:66px}.top-actions button{width:31px}.resource strong{font-size:12px}dialog{margin:auto auto 8px;max-height:82dvh;border-radius:22px 22px 14px 14px}.sheet-top{padding:17px}.side-stats{top:118px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
/* Align the live sign with the illustrated signboard. */
.shop-sign{top:30.25%;left:28.7%;width:42.7%;height:4.65%;background:none;border:0;box-shadow:none;transform:none}.shop-sign strong{font-size:clamp(23px,4.2dvh,40px)}.shop-sign small,.shop-sign>span{display:none}.lamp{top:41.4%}.lamp-a{left:35%}.lamp-b{right:34%}
.world>img{object-fit:fill}
.roadside .shop-sign,.roadside .lamp{display:none}.roadside .smoke{top:53%;left:43%}.roadside .smoke-b{left:46%}.roadside .location-pill{top:27%}.roadside [data-panel="map"]{filter:saturate(.45)}
.shop-sign{top:33.5%;left:26%;width:48%;height:4.4%}.shop-sign strong{font-size:clamp(23px,3.9dvh,37px)}
.roadside .smoke{top:39%;left:29%}.roadside .smoke-b{left:32%}
.item-icon img{display:block;width:52px;height:50px;object-fit:contain}
#game-actions{position:absolute;inset:0;z-index:8;pointer-events:none}.service-action{position:absolute;transform:translate(-50%,-100%);border:2px solid #9b7546;border-radius:14px;background:#fff6dc;box-shadow:0 3px 0 #74523466;color:#6b4b2c;min-width:55px;width:max-content;max-width:125px;padding:4px 6px;pointer-events:auto;text-align:center;z-index:2;touch-action:manipulation;animation:bubble-in .2s ease-out}.service-action::after{content:'';position:absolute;left:45%;bottom:-7px;width:10px;height:10px;background:#fff6dc;border-right:2px solid #9b7546;border-bottom:2px solid #9b7546;transform:rotate(45deg)}.service-action .bubble-picture{display:block;height:30px;font-size:25px;line-height:30px}.bubble-picture svg{display:block;width:43px;height:32px;margin:auto}.service-action small{display:block;font:700 10px/1.35 'Be Vietnam Pro','Segoe UI',sans-serif;margin-top:3px;white-space:normal;overflow-wrap:anywhere}.service-action:hover:enabled{background:#fffbe9;box-shadow:0 0 0 3px #f3ce6a77,0 3px #74523466}.service-action:active:enabled{transform:translate(-50%,-96%) scale(.97)}.service-action:disabled{opacity:.95;filter:none;cursor:default;background:#f1edce}.service-action:disabled::after{background:#f1edce}@keyframes bubble-in{from{opacity:0;scale:.45}to{opacity:1;scale:.64}}@media(max-width:500px){.service-action small{font-size:9px}.service-action .bubble-picture{height:26px;font-size:23px}.bubble-picture svg{height:28px;width:37px}.service-action{max-width:105px;padding:3px 5px}}
.service-action>*{pointer-events:none}
.roadside .smoke{top:33%;left:24%}.roadside .smoke-b{left:27%}
.roadside .location-pill{top:22%}

.staff-card{padding:15px;margin:12px 0;border:1px solid #cba56d;border-radius:14px;background:#fff8e4}.staff-heading{display:flex;gap:12px;align-items:center}.staff-heading>span{font-size:36px}.staff-heading h2{font-size:15px;margin:0 0 4px}.staff-heading p,.staff-heading small{font-size:11px;margin:0;line-height:1.6}.staff-controls{display:grid;gap:8px}.staff-training{display:flex;justify-content:space-between;align-items:center;gap:10px;text-align:left;border:1px solid #8c9f67;border-radius:10px;background:#e8edce;color:#4b5739;padding:12px;font-size:11px}.staff-training b{white-space:nowrap}.staff-card .wide-button{margin-top:12px}

.staff-heading .staff-avatar{width:70px;height:70px;flex-shrink:0;border-radius:18px;background:#efe2bf;border:2px solid #caa569;overflow:hidden;display:grid;place-items:center}.staff-avatar img{width:100%;height:100%;object-fit:cover}.staff-heading .staff-stars{margin-top:6px;color:#84601f;font-weight:700}

.bottom-nav .staff-nav-avatar{display:block;width:36px;height:36px;object-fit:contain;border-radius:10px}

.audio-settings{padding:14px;border:1px solid #cfb27c;border-radius:14px;background:#fff8e5;margin:12px 0}.audio-settings h2{font-size:18px;margin:0 0 10px}
.audio-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.audio-head h2{margin:0!important}.audio-fold{border:1px solid #ae8b55;border-radius:20px;background:#e1d5b7;color:#604a31;padding:7px 12px;font-size:12px;font-weight:700}.audio-settings.folded .audio-groups,.audio-settings.folded>.detail{display:none}.audio-master{width:100%;padding:12px;border:2px solid #f7df97;border-radius:12px;background:linear-gradient(#d98548,#b55a32);box-shadow:0 3px 0 #87492d;color:#fff6d8;font:800 16px 'Baloo 2',sans-serif;margin-bottom:12px}.audio-master[aria-pressed=true]{background:linear-gradient(#8cb360,#588947);box-shadow:0 3px 0 #3a6439;border-color:#e6f2bf}
.audio-master-volume{display:flex;align-items:center;gap:10px;margin:4px 0 12px;font-weight:700}.audio-master-volume input{flex:1;min-width:0;accent-color:#b55a32}.audio-master-volume output{min-width:4ch;text-align:right}
.audio-group{border:1px solid #dfc99e;border-radius:12px;background:#fffdf4;margin:10px 0;padding:4px 10px}.audio-line{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:9px 0;border-top:1px solid #efe0bc}.audio-line.head{border-top:0;border-bottom:2px solid #dfc99e;padding-bottom:11px}.audio-line.head strong{font-size:15px}
.audio-name{min-width:0}.audio-name strong{display:block;font-size:13px}.audio-name small{display:block;font-size:10px;line-height:1.5;margin-top:3px;color:#856d50}
.audio-ctl{display:flex;align-items:center;gap:5px;flex-shrink:0}.audio-ctl button{width:32px;height:32px;padding:0;border:1px solid #ae8b55;border-radius:50%;background:#e1d5b7;color:#604a31;font-size:16px;font-weight:700}.audio-ctl output{min-width:38px;text-align:center;font-size:12px;font-weight:700;color:#604a31}
.audio-mute[aria-pressed=false]{background:#54875e!important;color:#fff!important;border-color:#426c49!important}
.audio-line.muted .audio-name,.audio-group.off .audio-line:not(.head) .audio-name,.audio-settings.master-off .audio-name{opacity:.5}.audio-group.off .audio-line:not(.head) .audio-ctl,.audio-settings.master-off .audio-ctl{opacity:.6}

/* Compact live counters directly below reputation. */
.resources .side-stats{position:static;display:flex;gap:4px;width:100%;margin-top:-3px}.resources .side-stats>div{display:flex;align-items:center;gap:3px;min-width:0;flex:1;padding:3px 5px;border-radius:9px;font-size:10px;white-space:nowrap;box-shadow:none}.resources .side-stats strong{font-size:10px}.resources .side-stats small{font-size:6px;text-align:left;white-space:normal;line-height:1.2}.resources .side-stats>div:last-child{flex:1.2}

.staff-controls{margin-top:12px}.staff-controls h3{margin:0;font-size:12px;color:#765337}.staff-training{background:linear-gradient(#85ab60,#578345);border:2px solid #d5e4af;color:#fff8df;box-shadow:0 2px 0 #3d6238;padding:11px 10px;font-size:12px;min-height:60px}.staff-training strong,.staff-training small{display:block}.staff-training small{font-size:10px;margin-top:5px;letter-spacing:.5px;color:#ecf1d7}.staff-training b{font-size:11px}.staff-training:disabled{background:#c9c6b1;color:#6e6b5c;box-shadow:none}.staff-training:disabled small{color:#777461}
.save-btn{margin-left:6px;padding:2px 8px;border:1px solid #f8e3b78c;border-radius:12px;background:#ffffff1f;color:#fff8df;font:inherit;letter-spacing:1px;cursor:pointer}.save-btn:active{background:#ffffff40}
.start-screen{position:fixed;inset:0;z-index:100000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;border:0;background:radial-gradient(circle at 50% 38%,#4a6b5a,#203c38 70%);color:#fff3cf;font-family:'Baloo 2',sans-serif;cursor:pointer;padding:24px;text-align:center}.start-screen .start-bowl{font-size:64px}.start-screen strong{font-size:40px;line-height:1}.start-screen em{font-style:normal;font-size:22px;padding:8px 22px;border:2px solid #f7df97;border-radius:14px;background:linear-gradient(#d98548,#b55a32);box-shadow:0 3px 0 #87492d;animation:startPulse 1.6s ease-in-out infinite}.start-screen small{font-size:13px;opacity:.85}.start-screen.gone{display:none}@keyframes startPulse{50%{transform:scale(1.06)}}@media (prefers-reduced-motion:reduce){.start-screen em{animation:none}}
.care-bars{display:flex;gap:6px;margin-top:4px}.care-bar{flex:1;display:flex;align-items:center;gap:4px;padding:2px 6px;border:1px solid #f8e3b76b;border-radius:10px;background:#334a3ec7;color:#fff8df;font-size:10px}.care-bar span{line-height:1}.care-bar i{flex:1;height:6px;overflow:hidden;border-radius:4px;background:#0000004d}.care-bar b{display:block;width:0;height:100%;border-radius:4px;background:#8fc36b;transition:width .4s,background .4s}
.angry-badge{position:absolute;top:-8px;right:-6px;font-size:15px;line-height:1;filter:drop-shadow(0 1px 1px #0006)}
.resources{grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);column-gap:8px;row-gap:6px}
.resources>.resource:not(.reputation){grid-column:1;grid-row:1}
.resources>.reputation{grid-column:1;grid-row:2;width:100%}
.care-bars{display:contents}
.care-bar{margin:0;gap:5px;padding:0 8px 0 6px;border-radius:14px;min-width:0}
#hyg-bar{grid-column:2;grid-row:1;height:33px}
#sat-bar{grid-column:2;grid-row:2;height:27px}
.care-icon{font-size:17px;line-height:1;flex:none}
.care-body{flex:1;min-width:0;display:grid;gap:2px}
.care-body small{font-size:7px;font-weight:800;letter-spacing:.3px;line-height:1;color:#ffeec0cc;text-transform:uppercase}
.care-body i{height:6px}
.care-body small{display:flex;justify-content:space-between;gap:4px}
.care-body em{font-style:normal;font-size:8px;font-weight:900;letter-spacing:0;color:#fff8df}
#sat-bar .care-body{gap:1px}
.resources>.side-stats{grid-column:1/-1}
.item-icon svg{width:50px;height:auto;display:block}
.upgrade.locked-dish .item-icon{opacity:.38;filter:grayscale(.85)}.upgrade.locked-dish h2{color:#8c7a5a}.pips{display:inline-flex;gap:3px;margin-right:6px;vertical-align:middle}.pips i{width:9px;height:9px;border-radius:50%;background:#eadcba;border:1px solid #cbb585}.pips i.on{background:#6fa24d;border-color:#4e7f39}
.upgrade.tier{align-items:flex-start;gap:12px;padding:12px 11px}
.upgrade.tier .item-icon{width:58px;height:60px;margin-top:2px}
.upgrade.tier .item-icon svg{width:48px}
.tier-head{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:3px}
.tier-head h2{margin:0;font-size:16px}
.tier-badge{flex:none;font:800 8.5px/1 'Be Vietnam Pro',sans-serif;letter-spacing:.2px;padding:4px 7px;border-radius:20px;background:#e5f0cf;color:#44763a;border:1px solid #b8d58f;white-space:nowrap}
.tier-badge.off{background:#efe5cf;color:#8c7a5a;border-color:#dccaa0}
.tier-badge.max{background:linear-gradient(#ffe9a3,#f2c14e);color:#7a4f10;border-color:#e3a92d}
.tier-desc{font-size:9px;line-height:1.5;color:#937d62;margin:0 0 7px}
.tier-pips{display:flex;gap:4px;margin-bottom:7px}
.tier-pips i{flex:1;height:7px;border-radius:5px;background:#eadcba;border:1px solid #d3bf92;box-shadow:inset 0 1px 1px #0000000d}
.tier-pips i.on{background:linear-gradient(#9ccb6c,#5f9a45);border-color:#4f8139}
.upgrade.is-max .tier-pips i.on{background:linear-gradient(#ffd770,#e9a928);border-color:#c98a17}
.tier-chips{display:flex;flex-wrap:wrap;gap:5px}
.chip{display:inline-flex;align-items:center;gap:5px;font-size:9px;line-height:1.3;padding:4px 7px;border-radius:8px;background:#f6ecd2;color:#6b5438;border:1px solid #e6d3a6}
.chip b{font-size:7.5px;text-transform:uppercase;letter-spacing:.4px;color:#a28b63}
.chip.now{background:#e9f3d6;border-color:#c2dc98;color:#3d6a33;font-weight:700}
.chip.now b{color:#6a9a55}
.chip.care{background:#fff0e0;border-color:#f0cfa6;color:#9a5a22;font-weight:700}
.tier-next{font-size:8.5px;color:#a28b63;margin-top:6px}
.tier-next b{color:#6b5438}
.upgrade.tier .buy{align-self:center;display:flex;flex-direction:column;align-items:center;gap:2px;min-width:84px;font-size:11px;line-height:1.1;padding:8px 8px}
.upgrade.tier .buy small{display:block;margin:0;font-size:9px;font-weight:700;color:#fff3c4}
.upgrade.tier .buy:disabled small{color:#8a7e62}
.upgrade.tier .unlock-btn{background:linear-gradient(#f0b25c,#d17b34);border-color:#ffe3b0;box-shadow:0 3px 0 #94521f;text-shadow:0 1px #94521f}
.upgrade.tier .unlock-btn:disabled{background:#d0c5a8;border-color:#e4d7bb;box-shadow:0 2px #ac9e80;text-shadow:none}
.upgrade.is-max .buy:disabled{background:linear-gradient(#f4dd96,#e3b94d);color:#7a5314;border-color:#fff0bb;box-shadow:0 2px #b98d28}
.upgrade.locked-dish.tier .tier-desc,.upgrade.locked-dish.tier h2{opacity:.85}
.chip{align-items:flex-start}.chip b{white-space:nowrap;padding-top:1px}.tier-head{align-items:flex-start}.tier-head h2{flex:1;min-width:0}

/* only the bubble frame is see-through; picture and text stay fully opaque */
.service-action{scale:.64;transform-origin:50% 100%;background:#fff6dcf2;border-color:#9b7546;color:#4a2f18}
.service-action::after{background:#fff6dcf2;border-color:#9b7546}
.service-action small{color:#4a2f18;font-weight:800}
.service-action:hover:enabled{background:#fffbe9f0}
.service-action:hover:enabled::after{background:#fffbe9f0}
.service-action:disabled{opacity:1;background:#f1edcef2}
.service-action:disabled::after{background:#f1edcef2}

/* money pop-ups: larger, outlined, centred and held a little longer so they read on a busy street */
.float{transform:translate(-50%,-50%);color:#ffe27a;font:900 23px 'Baloo 2',sans-serif;letter-spacing:.2px;white-space:nowrap;-webkit-text-stroke:4.5px #5a321c;paint-order:stroke fill;text-shadow:0 3px 0 #5a321c,0 6px 10px #0006;animation:float 1.6s ease-out forwards}
.float.tip{color:#b6f59a;font-size:18px}
@keyframes float{0%{transform:translate(-50%,-30%) scale(.5);opacity:0}12%{transform:translate(-50%,-50%) scale(1.18);opacity:1}25%{transform:translate(-50%,-55%) scale(1)}80%{opacity:1}100%{transform:translate(-50%,-140%) scale(1);opacity:0}}

/* quest board */
.quest{display:flex;gap:12px;align-items:center;padding:13px;margin-bottom:11px;background:#fffaf0;border:1px solid #e2c594;border-radius:13px}
.quest.done{background:#f4ffe6;border-color:#9ccb6c}
.quest-icon{font-size:32px;flex:none}
.quest-info{flex:1;min-width:0}
.quest-info h2{font:800 16px/1.25 'Baloo 2',sans-serif;margin:0 0 2px}
.quest .track{margin:7px 0 6px}
.quest-meta{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.quest-meta small{font-weight:700;color:#7a5b3a}
.quest .buy{flex:none;min-width:92px;padding:9px 10px;font:800 14px 'Baloo 2',sans-serif;border:2px solid #f7df97;border-radius:11px;background:linear-gradient(#d98548,#b55a32);box-shadow:0 3px 0 #87492d;color:#fff6d8}
.quest .buy:disabled{background:#d9cbb0;border-color:#e8dcc3;box-shadow:0 3px 0 #b5a888;color:#8a7a5d}
.quest.done .buy:not(:disabled){background:linear-gradient(#7fc15a,#4d8a3a);box-shadow:0 3px 0 #386a2a}

#day-clock{position:absolute;top:12%;left:3%;display:flex;align-items:center;gap:6px;padding:4px 8px;border-radius:12px;background:#233f38e8;color:#fff4cf;font:700 12px 'Baloo 2',sans-serif;pointer-events:none;z-index:4}
.clock-face{position:relative;width:23px;height:23px;border:2px solid #c69e5a;border-radius:50%;background:#fff5d5}
.clock-face i{position:absolute;bottom:50%;left:calc(50% - 1px);width:2px;border-radius:2px;background:#624731;transform-origin:bottom}
#hour-hand{height:5px}#minute-hand{height:8px}

.period-buttons{position:absolute;top:calc(100% + 5px);left:0;display:flex;flex-wrap:wrap;width:min(285px,88vw);gap:4px;pointer-events:auto}
.period-buttons button{padding:5px 8px;border:1px solid #a89266;border-radius:7px;background:#233f38f5;color:#fff4cf;font-size:10px;font-weight:800;white-space:nowrap}
.period-buttons button[aria-pressed="true"]{background:#f4cf81;color:#493322}

#game.controls-hidden .top-actions > :not(#hud-toggle),
#game.controls-hidden .bottom-nav,
#game.controls-hidden .period-buttons,
#game.controls-hidden #day-clock,
#game.controls-hidden #scene-hint,
#game.controls-hidden #effects,
#game.controls-hidden #toast,
#game.bubbles-hidden #game-actions{display:none}

.day-report-content{padding:0 18px 18px}.day-report-content ul{padding-left:20px;line-height:1.8}
#day-clock{top:calc(max(14px,env(safe-area-inset-top)) + 124px)}
#day-clock:not(.tools-on) .period-buttons{display:none}
.test-tools-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:10px 0 12px;padding:10px 12px;border:1px solid #e6cfa1;border-radius:12px;background:#fffaf0}
.test-tools-row b{display:block;font-size:13px}.test-tools-row small{display:block;font-size:9px;color:#937d62;margin-top:2px}
.test-tools-row button{flex:none;min-width:64px;padding:8px 12px;border:2px solid #e6f2bf;border-radius:10px;background:linear-gradient(#8cb360,#588947);color:#fff9df;font-size:11px;font-weight:800;box-shadow:0 3px 0 #3a6439}
.test-tools-row button[aria-pressed="false"]{background:#d0c5a8;border-color:#e4d7bb;color:#776d54;box-shadow:0 2px #ac9e80}
#day-clock{background:#233f3859;border:1px solid #f8e3b733;text-shadow:0 1px 2px #0009;backdrop-filter:none}
/* Quán tab: one-line names, 1-2 line descriptions, tidy art */
.tier-head h2{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:15px}
.tier-head .tier-badge{flex:none}
.tier-desc{display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.9em}
.upgrade.tier .item-icon img{width:48px;height:46px;object-fit:contain}
.art-umbrella{display:block;width:50px;height:46px;background:url(assets/cafe-umbrellas.png) -12px 0/133px 44px no-repeat}
.tier-bar{height:7px;margin-bottom:7px;border:1px solid #d3bf92;border-radius:5px;background:#eadcba;overflow:hidden}
.tier-bar b{display:block;height:100%;background:linear-gradient(#9ccb6c,#5f9a45);border-radius:5px}
.upgrade.is-max .tier-bar b{background:linear-gradient(#ffd770,#e9a928)}
.tier-items{margin-top:6px}
.chip.item{background:#f1ead6;border-color:#e0d1ab;color:#8c7a5a;font-weight:600}
.chip.item.done{background:#e9f3d6;border-color:#c2dc98;color:#3d6a33}
.staff-heading h2{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.staff-heading p{display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.staff-heading>div{min-width:0}
.tier-meta{display:flex;align-items:center;gap:8px;margin-bottom:7px}.tier-meta .tier-pips,.tier-meta .tier-bar{flex:1;margin:0;min-width:0}.tier-head h2{max-width:100%}
/* HUD: four tidy bars (tiền, sao, vệ sinh, khách hàng), label and status on one row, clock pulled up */
.resources{row-gap:5px}
.resources>.resource:not(.reputation){height:30px}
.resources>.reputation{height:28px}
#hyg-bar{height:30px}#sat-bar{height:28px}
.care-body small{white-space:nowrap;font-size:6.5px;letter-spacing:.2px;overflow:hidden}
.care-body small em{flex:none;font-size:7.5px}
.resources>.side-stats{margin-top:0}
#day-clock{top:calc(max(14px,env(safe-area-inset-top)) + 104px)}
.top-actions{grid-template-columns:1fr;gap:4px}
.top-actions button{width:31px;height:28px;font-size:16px}
.care-icon{font-size:14px}
.care-bar{padding:0 6px 0 5px;gap:4px}
.care-body small{letter-spacing:0;gap:3px}
/* bát đã bán / tiền mỗi phút: two pills aligned with the two bar columns above */
.resources>.side-stats{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);column-gap:8px;gap:0 8px;width:100%}
.resources .side-stats>div{flex:none;height:22px;padding:0 8px;border-radius:12px;box-sizing:border-box;justify-content:flex-start;gap:5px;overflow:hidden}
.resources .side-stats>div:last-child{flex:none}
.resources .side-stats strong{font-size:10.5px;flex:none}
.resources .side-stats small{font-size:7px;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
#toast{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:10px 16px;max-width:none;width:max-content}
@media (max-width:420px){.care-icon{display:none}.care-bar{padding:0 6px}.care-body small{font-size:5.8px;gap:2px}.care-body small em{font-size:6.6px}}

.service-action:enabled{background:#d7eee2;border-color:#487f70;color:#254f43}
.service-action:enabled::after{background:inherit;border-right-color:#487f70;border-bottom-color:#487f70}
.service-action:enabled:hover{background:#e8f8ed;box-shadow:0 0 0 3px #75ad9980,0 3px 0 #355e4c55}

.day-transition{position:absolute;inset:0;z-index:100;display:grid;place-items:center;background:#253e38;color:#fff1cb;font:800 clamp(28px,7vw,48px)/1.2 'Baloo 2','Be Vietnam Pro',sans-serif;text-shadow:0 2px 0 #182d28}

.lottery-form{display:grid;gap:12px}#donate-qr{text-align:center}#donate-qr img{max-width:100%;border-radius:12px}
.lottery-form label{display:grid;gap:5px;font-weight:700}
.lottery-form input,.lottery-form select{font:inherit;color:inherit;background:#fffaf0;border:1px solid #c6a675;border-radius:8px;padding:8px}
.bottom-nav .lottery-unbought{opacity:.45}

.law-list{display:grid;gap:10px}
.law-list article{padding:12px 14px;border:1px solid #d9bd89;border-radius:12px;background:#fffaf0}
.law-list h2{margin:0 0 6px;font-size:16px}
.law-list p{margin:5px 0;font-size:12px;line-height:1.5}
.journey-hero{display:flex;gap:14px;align-items:center;padding:16px;border-radius:16px;background:linear-gradient(135deg,#f9d98e,#f0b45c);border:2px solid #fff0b9;box-shadow:0 3px 0 #a3743f;color:#5b3a22}
.journey-badge{flex:none;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;font-size:30px;background:#fff7dc;border:3px solid #fff;box-shadow:0 2px 0 #b98846}
.journey-hero small{display:block;font-size:9px;letter-spacing:1.6px;font-weight:800;color:#8a5a2d}.journey-hero h2{font:800 22px/1.15 'Baloo 2',sans-serif;margin:3px 0 4px}.journey-hero p{font-size:11px;line-height:1.6;margin:0;color:#6d4a2b}
.journey-card{margin:12px 0;padding:14px;border-radius:14px;background:#fffaf0;border:1px solid #e6cfa1;box-shadow:0 3px 0 #ead3a6}
.journey-pct{display:flex;align-items:baseline;gap:8px}.journey-pct b{font:800 30px 'Baloo 2',sans-serif;color:#54875e}.journey-pct span{font-size:11px;color:#8c7352}
.journey-card .track{margin:8px 0 12px}
.journey-cats{list-style:none;margin:0;padding:0;display:grid;gap:9px}.journey-cats li{display:grid;grid-template-columns:104px 1fr 46px;align-items:center;gap:9px;font-size:12px;font-weight:700}.journey-cats small{text-align:right;font-size:11px;color:#8c7352}.journey-cats li.done small{color:#54875e;font-weight:800}
.journey-cats .mini{height:8px;border-radius:8px;background:#e7d8b5;overflow:hidden}.journey-cats .mini i{display:block;height:100%;background:linear-gradient(90deg,#96b66a,#5f8d54);border-radius:8px}
.journey-tip{font-size:10px;line-height:1.7;color:#937d62;margin:12px 0 0}
.journey-title{font:800 15px 'Baloo 2',sans-serif;margin:16px 2px 8px;color:#65432b}
.journey-road{list-style:none;margin:0;padding:0 0 0 6px;position:relative}.journey-road:before{content:'';position:absolute;left:25px;top:16px;bottom:16px;border-left:3px dashed #d9bd88}
.journey-road li{position:relative;display:flex;align-items:center;gap:12px;padding:10px 10px 10px 0}.journey-road .road-dot{position:relative;z-index:1;flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-size:19px;background:#f3e6c4;border:3px solid #fffaf0;box-shadow:0 0 0 2px #d9bd88}
.journey-road strong{display:block;font:800 15px 'Baloo 2',sans-serif;color:#65432b}.journey-road small{display:block;font-size:10px;color:#937d62;line-height:1.5}
.journey-road li.done .road-dot{background:#8cb360;color:#fff;box-shadow:0 0 0 2px #588947}
.journey-road li.soon,.journey-road li.locked{opacity:.78;pointer-events:none;cursor:not-allowed;user-select:none}.journey-road li.soon .road-dot{filter:grayscale(.55)}
.journey-road em{margin-left:auto;flex:none;font-style:normal;font-size:10px;font-weight:800;color:#8a5a2d;background:#fff0c4;border:1px dashed #c99b55;border-radius:20px;padding:5px 9px}
.law-list ul{margin:6px 0 0;padding-left:20px;list-style:disc}.law-list li{margin:5px 0;line-height:1.7;font-size:13px}.law-list li::marker{color:#b0793a}.law-list .law-intro{margin:0 0 12px}
/* Bigger, icon-free action bubbles; only payment keeps a $ sign */
.service-action{scale:.82;min-width:60px;max-width:none;padding:5px 9px;border-radius:14px}
.service-action small{font-size:12px;line-height:1.3;margin-top:0;white-space:nowrap}
.service-action .bubble-picture.cash{height:auto;margin-bottom:1px;font:800 28px/1 'Baloo 2','Be Vietnam Pro',sans-serif;color:#2f8f4e}
.service-action[data-service=pay]{min-width:52px;padding:4px 14px}
.service-action .bubble-picture.cash{font-size:34px;margin:0}
/* Red outline on every action bubble */
.service-action,.service-action:enabled,.service-action:disabled{border-color:#d93a2f}
.service-action::after,.service-action:enabled::after,.service-action:disabled::after{border-right-color:#d93a2f;border-bottom-color:#d93a2f}
/* Lottery and the day report sit in the middle of the screen */
#day-report,#sheet.centered{margin:auto;border-radius:22px}
/* Action bubbles: more see-through background (text and red outline stay solid) */
.service-action,.service-action::after{background:#fff6dceb}
.service-action:enabled,.service-action:enabled::after{background:#d7eee2eb}
.service-action:disabled,.service-action:disabled::after{background:#f1edceeb}
.service-action:enabled:hover,.service-action:enabled:hover::after{background:#e8f8edf5}
.service-action small{color:#372413}
/* Pointer tail: keep only the half below the bubble so no diamond shows through the see-through body */
.service-action::after{clip-path:polygon(100% 0,100% 100%,0 100%);bottom:-8px}
/* Outline is drawn by ::before so it can open up where the pointer tail joins the bubble */
.service-action,.service-action:enabled,.service-action:disabled{border-color:transparent}
.service-action::before{content:'';position:absolute;inset:-2px;border:2px solid #d93a2f;border-radius:14px;pointer-events:none;clip-path:polygon(0 0,100% 0,100% 100%,calc(45% + 12px) 100%,calc(45% + 12px) calc(100% - 3px),calc(45% - 2px) calc(100% - 3px),calc(45% - 2px) 100%,0 100%)}
.service-action::after{bottom:-5px}
#test-pass{width:320px;max-width:calc(100vw - 32px);margin:auto;text-align:center}
.test-pass-form{display:grid;gap:10px;padding:16px}
.test-pass-form h2{margin:0;font-size:18px}
.test-pass-form label{display:grid;gap:6px;font-weight:700;text-align:left;font-size:13px}
.test-pass-form input{font:inherit;padding:9px 10px;border:1px solid #c6a675;border-radius:8px;background:#fffaf0;color:inherit}
.test-pass-error{min-height:1.2em;margin:0;color:#c0392b;font-size:12px;font-weight:700}
.test-pass-form div{display:flex;gap:8px;justify-content:center}
.test-pass-form button{flex:1;padding:9px 12px;border:2px solid #e6f2bf;border-radius:10px;background:linear-gradient(#8cb360,#588947);color:#fff9df;font-weight:800;box-shadow:0 3px 0 #3a6439}
.test-pass-form button[data-test-pass-cancel]{background:#d0c5a8;border-color:#e4d7bb;color:#776d54;box-shadow:0 2px #ac9e80}
#release-notes{width:420px;max-width:calc(100vw - 24px);margin:auto;border-radius:22px;overflow:hidden;display:none}
#release-notes[open]{display:flex;flex-direction:column;max-height:82dvh}
.release-top{padding:16px 18px 10px;background:linear-gradient(#fff3cf,#ffe7a8);border-bottom:2px solid #e6cfa1}
.release-top span{font-size:11px;font-weight:800;letter-spacing:.06em;color:#9b7546}
.release-top h2{margin:2px 0 0;font-size:20px}
.release-top small{color:#937d62;font-size:11px}
.release-body{flex:1;overflow:auto;padding:6px 18px 4px;overscroll-behavior:contain}
.release-body h3{margin:12px 0 4px;font-size:13px;color:#7b5a35}
.release-body ul{margin:0;padding-left:18px;font-size:13px;line-height:1.5}
.release-body li{margin:3px 0}
#release-notes>.wide-button{margin:10px 18px 16px;width:calc(100% - 36px)}
.release-body code{padding:1px 5px;border-radius:5px;background:#f1e6c8;font-size:12px}
.service-action .bubble-picture.cash{height:auto;margin:0;line-height:0}
.service-action .bubble-picture.cash svg{width:60px;height:52px;margin:0 auto}
.service-action .bubble-picture.cash svg{width:40px;height:28px}
.service-action[data-service=pay]{min-width:44px;padding:4px 10px}
/* Payment bubble: the supplied cash-stack picture (1300x1300 png, artwork sits in x 215-1085, y 350-1078), cropped with the background offset */
.service-action .bubble-picture.cash{width:38px;height:32px;margin:0 auto;background:url(assets/cash-stack.png) -9.5px -15.5px/57.4px 57.4px no-repeat}

/* Bottom bar: Quán, Nhân sự and the shortcuts (Hành trình, Nhiệm vụ, Vé số, Luật, Ô, Lưu) in a strip that scrolls sideways with ‹ › arrows */
.bottom-nav{height:66px;min-height:66px;padding:2px 3px max(3px,env(safe-area-inset-bottom));gap:2px}
.nav-track{flex:1;min-width:0;height:100%;display:flex;align-items:center;gap:2px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.nav-track::-webkit-scrollbar{display:none}
.bottom-nav .nav-track button{flex:0 0 auto;width:calc((100% - 8px)/5);min-width:66px;height:100%;position:relative;scroll-snap-align:start;gap:1px}
.bottom-nav .nav-track button[hidden]{display:none}
.bottom-nav .nav-track span{font-size:30px;line-height:1.1}
.bottom-nav .nav-track strong{font-size:12px;line-height:1.1;white-space:nowrap}
.bottom-nav .staff-nav-avatar{width:32px;height:32px}
.bottom-nav .nav-track i{position:absolute;right:calc(50% - 30px);top:3px;background:#ce583a;color:#fff4c8;border:2px solid #ffdb87;border-radius:50%;font-style:normal;font-weight:bold;min-width:18px;height:18px;font-size:11px;line-height:14px;text-align:center}
.bottom-nav .nav-track i[hidden]{display:none}
.bottom-nav .nav-track #save-dot{position:static;background:none;border:0;min-width:0;height:auto;font-size:inherit;line-height:inherit;color:inherit}
.nav-arrow{flex:0 0 26px;height:46px;padding:0;border:0;border-radius:10px;background:#00000038;color:#fff0cc;font-size:24px;line-height:1;text-shadow:0 2px 2px #33261c}
.nav-arrow:disabled{opacity:.28;cursor:default}
.scene-hint{bottom:calc(66px + 8px)}
.service-action .bubble-picture.bone{width:44px;height:26px;margin:0 auto;line-height:0}
.service-action .bubble-picture.bone svg{width:44px;height:26px}
.service-action[data-service=feed-dog]{min-width:52px;padding:6px 10px}
/* Day report: income summary as label / amount rows */
#day-report-counts{list-style:none;padding:0;margin:0}
#day-report-counts li{display:flex;justify-content:space-between;gap:12px;padding:5px 0;border-bottom:1px dashed #e2c594;line-height:1.4}
#day-report-counts li b{white-space:nowrap}
#day-report-counts li.sub{font-weight:800;color:#6b4b2c;border-bottom:1px solid #d3bf92}
#day-report-counts li.total{margin-top:6px;padding:9px 10px;border:2px solid #d3a24f;border-radius:10px;background:#fff1c8;font-size:15px;font-weight:800;color:#4a2f18}
.day-tabs{display:flex;gap:6px;margin:12px 0 8px}
.day-tabs button{flex:1;padding:9px 6px;border:1px solid #d8ba86;border-radius:10px;background:#f0dfb9;color:#997853;font-size:13px;font-weight:700}
.day-tabs button[aria-selected=true]{background:linear-gradient(#8cb360,#588947);border-color:#e6f2bf;color:#fff9df;box-shadow:0 2px 0 #3a6439}
#day-report-work{list-style:none;padding:0;margin:0}
#day-report-work li{display:flex;justify-content:space-between;gap:12px;padding:5px 0;border-bottom:1px dashed #e2c594;line-height:1.4}
#day-report-work li b{white-space:nowrap}
#day-report-work li.sub{font-weight:800;color:#6b4b2c;border-bottom:1px solid #d3bf92}
#day-report-work li.total{margin-top:6px;padding:9px 10px;border:2px solid #d3a24f;border-radius:10px;background:#fff1c8;font-size:15px;font-weight:800;color:#4a2f18}
#day-report-work[hidden]{display:none}
.service-action .bubble-picture.fish{width:44px;height:26px;margin:0 auto;line-height:0}
.service-action .bubble-picture.fish svg{width:44px;height:26px}
.service-action[data-service=feed-cat]{min-width:52px;padding:6px 10px}
.shot-flash{position:absolute;inset:0;z-index:30;background:#fff;pointer-events:none;animation:shot-flash .4s ease-out forwards}
@keyframes shot-flash{from{opacity:.85}to{opacity:0}}
.shop-name-card{display:grid;gap:6px;margin:10px 0 12px;padding:10px 12px;border:1px solid #e6cfa1;border-radius:12px;background:#fffaf0}
.shop-name-card label{font-weight:800;font-size:13px}
.shop-name-card div{display:flex;gap:8px}
.shop-name-card input{flex:1;min-width:0;font:inherit;padding:9px 10px;border:1px solid #c6a675;border-radius:8px;background:#fff;color:inherit}
.shop-name-card button{flex:none;padding:9px 14px;border:2px solid #e6f2bf;border-radius:10px;background:linear-gradient(#8cb360,#588947);color:#fff9df;font-weight:800;box-shadow:0 3px 0 #3a6439}
.shop-name-card small{font-size:10px;color:#937d62}
.rank small{max-width:68px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* A long stall name must wrap inside the side note instead of running off the screen */
.desktop-note{width:min(210px,calc(50vw - 100dvh * .28125 - 61px))}
.desktop-note>strong{display:block;overflow-wrap:anywhere;line-height:1.1;font-size:clamp(22px,3.4vw,38px)}
#guide{width:430px;max-width:calc(100vw - 24px);margin:auto;border-radius:22px;overflow:hidden;display:none}
#guide[open]{display:flex;flex-direction:column;max-height:86dvh}
.guide-top{padding:16px 18px 10px;background:linear-gradient(#fff3cf,#ffe7a8);border-bottom:2px solid #e6cfa1}
.guide-top span{font-size:11px;font-weight:800;letter-spacing:.06em;color:#9b7546}
.guide-top h2{margin:2px 0 0;font-size:20px}
.guide-tabs{display:flex;gap:5px;padding:10px 12px 0}
.guide-tabs button{flex:1;padding:8px 2px;border:1px solid #d8ba86;border-radius:10px;background:#f0dfb9;color:#997853;font-size:12px;font-weight:700}
.guide-tabs button[aria-selected=true]{background:linear-gradient(#8cb360,#588947);border-color:#e6f2bf;color:#fff9df;box-shadow:0 2px 0 #3a6439}
.guide-body{flex:1;overflow:auto;padding:10px 16px 6px;overscroll-behavior:contain}
.guide-preface{margin:10px 0;font-size:14px;line-height:1.65;font-style:italic}
.guide-sign{margin:14px 0 6px;text-align:right;font-weight:800;font-size:14px}
.guide-list{list-style:none;margin:0;padding:0}
.guide-list li{display:flex;gap:11px;padding:9px 0;border-bottom:1px dashed #e2c594}
.guide-list li>span{flex:none;width:32px;font-size:24px;line-height:1.2;text-align:center}
.guide-list b{font-size:13px}
.guide-list p{margin:2px 0 0;font-size:12.5px;line-height:1.5;color:#6b5238}
.guide-foot{display:flex;gap:8px;padding:10px 14px 14px}
.guide-foot button{flex:1;padding:11px;border:2px solid #e4d7bb;border-radius:12px;background:#d0c5a8;color:#776d54;font-weight:800;font-size:14px}
.guide-foot button.primary{flex:2;border-color:#e6f2bf;background:linear-gradient(#8cb360,#588947);color:#fff9df;box-shadow:0 3px 0 #3a6439}
#day-clock{flex-wrap:wrap;max-width:94%}
#clock-status{display:flex;flex-wrap:wrap;gap:4px}
#clock-status:not(:empty){padding-left:7px;border-left:1px solid #f8e3b755}
#clock-status span{padding:1px 7px;border-radius:9px;font:700 11px 'Baloo 2',sans-serif;background:#ffffff1f;white-space:nowrap}
#clock-status .status-rain{background:#5b8fc94d}
#clock-status .status-power{background:#f2b53a59;color:#fff1c2}
#clock-status .status-backup{background:#7fb35e59}
#clock-status .status-gang{background:#d9503a59}
#clock-status .status-police{background:#4f7fd659}
#clock-status .status-celebrity{background:#9b65ca8c;color:#fff2d1}
#clock-status .status-disorder{background:#e8923259}
#clock-status .status-dog,#clock-status .status-cat{background:#8cb36059}
.leave-list{list-style:none;margin:0 0 6px;padding:0;display:grid;gap:8px}.leave-list li{padding:10px 14px;border:1px solid #e6cfa1;border-radius:12px;background:#fffaf0;font-weight:700;font-size:14px}.leave-list li:before{content:'🌴 '}
.subtabs{display:flex;gap:6px;margin:0 0 10px;padding:4px;border-radius:12px;background:#ecdcb8}.subtabs button{flex:1;border:0;border-radius:9px;background:transparent;color:#8a6c43;padding:8px 6px;font:700 12px 'Be Vietnam Pro',sans-serif}.subtabs button.active{background:#63875c;color:#fff8d9;box-shadow:0 2px 0 #37593c}
.staff-card.on-leave .staff-avatar{opacity:.38;filter:grayscale(.85)}.staff-card.on-leave h2,.staff-card.on-leave>.staff-heading p:not(.leave-badge):not(.leave-reason):not(.leave-effect){opacity:.6}
.leave-badge{display:inline-block;margin:4px 0 2px!important;padding:3px 10px;border-radius:20px;background:#fff0c4;border:1px dashed #c99b55;color:#8a5a2d;font-weight:800;font-size:12px!important}.leave-reason{margin:2px 0 0!important;font-size:12px!important;color:#7a5a36;font-weight:700}.leave-effect{margin:4px 0 0!important;font-size:11px!important;color:#b5412f;font-weight:700}
.leave-list li{display:flex;flex-direction:column;gap:2px}.leave-list li small{font-weight:600;color:#8a6c43;font-size:12px}
.lottery-number{display:flex;gap:8px}.lottery-number input{flex:1;min-width:0}.lottery-random{flex:none;border:1px solid #ae8b55;border-radius:8px;background:#e1d5b7;color:#604a31;padding:0 14px;font:700 13px 'Be Vietnam Pro',sans-serif}.lottery-random:active{transform:scale(.96)}
.achv-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border-radius:14px;background:linear-gradient(135deg,#f9d98e,#f0b45c);border:2px solid #fff0b9;box-shadow:0 3px 0 #a3743f;color:#5b3a22;margin-bottom:10px}.achv-head small{display:block;font-size:10px;letter-spacing:1px;font-weight:800;color:#8a5a2d}.achv-head b{font:800 18px 'Baloo 2',sans-serif}
.achv-titles{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}.achv-titles button{border:1px solid #ae8b55;border-radius:20px;background:#efe2c1;color:#604a31;padding:6px 12px;font-size:12px;font-weight:700}.achv-titles button.on{background:#63875c;color:#fff8d9;border-color:#46694b}
.achv{display:grid;grid-template-columns:44px 1fr auto;gap:10px;align-items:center;padding:12px;margin-bottom:9px;border:1px solid #e6cfa1;border-radius:13px;background:#fffaf0;box-shadow:0 3px 0 #ead3a6}.achv.done{background:#f3f5df;border-color:#8ea666}
.achv-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:#f3e0b9;font-size:24px}.achv h2{font:800 16px/1.2 'Baloo 2',sans-serif;margin:0}.achv-goal{margin:2px 0 4px;font-size:11px;color:#8c7352}.achv .track{margin:4px 0 6px}
.achv-tiers{display:flex;gap:5px;flex-wrap:wrap}.achv-tiers span{min-width:34px;padding:2px 7px;border-radius:12px;background:#ede0c0;color:#8c7352;font-size:10px;font-weight:700;text-align:center}.achv-tiers .ready{background:#f4c356;color:#5b3a22}.achv-tiers .got{background:#8cb360;color:#fff}
.achv-prize{display:block;margin-top:6px;font-size:10px;color:#937d62}
.journey-medal{display:inline-block;margin:0 0 4px!important;padding:2px 10px;border-radius:20px;background:#fff7dc;border:1px solid #c99b55;color:#8a5a2d!important;font-weight:800;font-size:11px!important}
.scene-door{white-space:nowrap;position:absolute;transform:translate(-50%,-100%);z-index:9;pointer-events:auto;display:flex;align-items:center;gap:6px;border:2px solid #fff0b9;border-radius:18px;background:linear-gradient(#b9814a,#8a5a2d);box-shadow:0 3px 0 #5e3a1b;color:#fff8e0;padding:6px 12px;font:800 13px 'Baloo 2',sans-serif;cursor:pointer}.scene-door:active{transform:translate(-50%,-96%)}.scene-door i{font-style:normal;min-width:20px;height:20px;line-height:20px;text-align:center;border-radius:10px;background:#ce583a;border:2px solid #ffdb87;font-size:11px}.scene-door i[hidden]{display:none}

.acct{display:grid;gap:12px}.acct button:disabled{opacity:.6;cursor:progress}
.acct-hero{text-align:center;padding:2px 8px 4px}.acct-hero>span{font-size:46px}.acct-hero h2{font:800 24px 'Baloo 2',sans-serif;margin:2px 0}.acct-hero p{margin:0;font-size:12.5px;line-height:1.6;color:#8d7151}
.acct-social{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:12px;border:1.5px solid #cba56d;border-radius:12px;background:#fffaf0;color:#503b2b;font:700 15px 'Be Vietnam Pro',sans-serif;box-shadow:0 2px 0 #d9bd8a}.acct-social:active{transform:translateY(1px);box-shadow:none}
.acct-or{display:flex;align-items:center;gap:10px;color:#8c7352;font-size:11px}.acct-or::before,.acct-or::after{content:'';flex:1;height:1px;background:#d9bd8a}
.acct-tabs{display:grid;grid-template-columns:1fr 1fr;padding:3px;border-radius:12px;background:#ecd9ad}.acct-tabs button{border:0;border-radius:9px;padding:9px;background:transparent;color:#7a5f3e;font:700 13px 'Be Vietnam Pro',sans-serif}.acct-tabs button.on{background:#fffaf0;color:#503b2b;box-shadow:0 1px 3px #0002}
.acct-form{display:grid;gap:10px}.acct-form label{display:grid;gap:4px;font-size:12px;font-weight:700;color:#6d5439}.acct-form input{font:inherit;font-weight:400;color:inherit;background:#fffaf0;border:1px solid #c6a675;border-radius:10px;padding:10px}.acct-form .wide-button{margin-top:2px}
.acct-msg{margin:0;padding:9px 12px;border-radius:10px;background:#fde4d8;color:#9b2f1a;font-size:12px;line-height:1.5}.acct-msg.ok{background:#eaf3d9;color:#4b6b2a}
.acct-link{border:0;background:none;color:#8c6a3f;font:600 13px 'Be Vietnam Pro',sans-serif;text-decoration:underline;padding:6px}.acct-out{color:#a2452a}
.acct-card{display:flex;align-items:center;gap:14px;padding:14px;border:1px solid #cba56d;border-radius:14px;background:#fff8e4}.acct-avatar{flex:none;width:56px;height:56px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:#d98548;color:#fff6d8;font:800 26px 'Baloo 2',sans-serif;border:2px solid #f7df97}.acct-avatar img{width:100%;height:100%;object-fit:cover}
.acct-who{display:grid;gap:2px;min-width:0}.acct-who strong{font-size:15px;overflow-wrap:anywhere}.acct-who small{font-size:12px;color:#8c7352;overflow-wrap:anywhere}.acct-via{justify-self:start;margin-top:3px;padding:2px 9px;border-radius:20px;background:#e1ecc9;color:#4b6b2a;font-size:11px;font-weight:700}
.acct-sync{margin:0;font-size:12px;line-height:1.6;color:#8c7352;text-align:center}
.acct-hint{margin:0;font-size:11.5px;line-height:1.6;color:#8c7352}

.set-hello{display:flex;align-items:center;gap:12px;padding:4px 2px 2px}.set-hello>span{font-size:40px}.set-hello h2{font:800 22px 'Baloo 2',sans-serif;margin:0}.set-hello p{margin:0;font-size:12px;color:#8d7151}
.set-group{display:grid;margin:14px 0;border:1px solid #e6cfa1;border-radius:14px;background:#fffaf0;overflow:hidden}.set-group h3{margin:0;padding:9px 14px 6px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#937d62}
.set-row{display:flex;align-items:center;gap:12px;width:100%;padding:12px 14px;border:0;border-top:1px solid #f0e0bb;background:none;color:#503b2b;text-align:left}.set-row:active{background:#f7ebc9}.set-row>span{font-size:22px;width:28px;text-align:center}.set-row b{flex:1;font-size:14px}.set-row small{display:block;margin-top:1px;font-size:11px;font-weight:400;color:#8c7352}.set-row i{font-style:normal;font-size:22px;color:#b79a68}
.set-more{margin:10px 0;border:1px solid #e6cfa1;border-radius:12px;background:#fffaf0;padding:0 14px}.set-more summary{padding:11px 0;font-size:13px;font-weight:700;cursor:pointer;color:#6d5439}.set-more[open] summary{border-bottom:1px solid #f0e0bb;margin-bottom:6px}
.set-danger{display:block;width:100%;margin:14px 0 4px;padding:11px;border:1.5px solid #d9a08c;border-radius:12px;background:none;color:#a2452a;font:700 14px 'Be Vietnam Pro',sans-serif}.set-danger:active{background:#fde4d8}

.donate-chips{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.donate-chips button{padding:9px 0;border:1.5px solid #cba56d;border-radius:10px;background:#fffaf0;color:#503b2b;font:700 13px 'Be Vietnam Pro',sans-serif}.donate-chips button:active{background:#f7ebc9}
.donate-bank{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border:1px solid #e6cfa1;border-radius:12px;background:#fffaf0;font-size:13px}.donate-bank b{letter-spacing:.03em}.donate-bank button{flex:none;padding:7px 12px;border:1.5px solid #cba56d;border-radius:9px;background:#fff;color:#6d5439;font:700 12px 'Be Vietnam Pro',sans-serif}
.donate-sum{margin:6px 0;font-size:13px;color:#6d5439}

.empty-state{display:grid;justify-items:center;gap:4px;padding:18px 12px;text-align:center}.empty-state>span{font-size:40px}.empty-state b{font:800 17px 'Baloo 2',sans-serif}.empty-state p{margin:0;font-size:12.5px;line-height:1.6;color:#8d7151}
/* Readability: bigger HUD captions and roomy line-height so Vietnamese diacritics (also on capitals) are never clipped */
.rank small{font-size:10px;line-height:1.3}
.resource small{font-size:9px;line-height:1.3;margin-right:6px}
.care-body{gap:3px}
.care-body small{font-size:9px;line-height:1.35;letter-spacing:.2px}
.care-body em{font-size:10px;line-height:1.2}
.resources .side-stats small{font-size:8px;line-height:1.3}
.resources .side-stats{margin-top:0}
.nav-track strong{line-height:1.35}
/* The status words (RẤT BẨN, GIẬN GIỮ) stack two diacritics: give them headroom inside the clipping box instead of squeezing the font */
.care-body small{font-size:8.5px;line-height:1.3;padding:4px 0 1px;margin:-4px 0 -1px;overflow:hidden}
.care-body small em{font-size:9.5px;line-height:1.3}
@media (max-width:420px){.care-body small{font-size:8px}.care-body small em{font-size:9px}}