:root{--bg:#f8edd8;--ink:#7e3128;--green:#79b54a;--red:#d85956;--shadow:0 12px 30px rgba(124,90,52,.12);font-family:system-ui,-apple-system,"Noto Sans Thai",Tahoma,sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink)}button,input,textarea{font:inherit}button{cursor:pointer}
.app{max-width:590px;min-height:100dvh;margin:auto;padding:16px 14px 24px}.screen{display:none;animation:f .18s ease}.screen.active{display:block}@keyframes f{from{opacity:.45;transform:translateY(8px)}to{opacity:1;transform:none}}
.topbar{display:flex;justify-content:space-between;align-items:center}.topbar.inner{margin-bottom:10px}.space{width:54px}.pill,.round,.chip,.menu-item,.card,.segment,.bubble,.inputbox{background:rgba(255,250,242,.88);box-shadow:var(--shadow)}
.pill{border:0;border-radius:28px;height:54px;padding:0 20px;font-size:21px;font-weight:800;color:#8c6f48}.round{border:0;border-radius:50%;width:54px;height:54px;font-size:26px;color:#8c6f48}.round.mini{width:44px;height:44px;font-size:20px}
.hero{text-align:center;margin-top:8px}.monthrow{display:grid;grid-template-columns:40px 1fr 40px;align-items:center}.monthrow button,.link{border:0;background:transparent;color:#9c785c}.monthrow h1,.monthrow h3{margin:8px 0;font-size:31px}.monthrow.compact h3{font-size:27px}
.total{font-size:48px;font-weight:900;color:#a5c757;line-height:1.05}.total span{font-size:23px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}.chip{border-radius:24px;padding:12px 10px}.chip small{display:block;color:#8e7352;font-weight:700}.chip b{font-size:16px}.pos{color:var(--green)}.neg{color:var(--red)}.bal{color:#7b5633}
.bubbles{height:430px;position:relative;margin-top:18px}.bubble{position:absolute;border:4px solid #fffdf6;border-radius:50%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:10px;color:#7a2f27;overflow:hidden}.bubble .emoji{font-size:24px;margin-bottom:4px}.bubble b{font-size:clamp(15px,3.8vw,22px);line-height:1.1}.bubble strong{font-size:clamp(17px,4.4vw,30px);margin-top:2px}
.card{border-radius:24px;padding:14px 14px 8px;margin-top:12px}.section-head{display:flex;justify-content:space-between;align-items:center}.section-head h3,.label-title,.report h3{margin:0 0 12px;font-size:18px}.latest .item,.history-item{display:flex;justify-content:space-between;gap:12px;padding:12px 2px;border-top:1px solid #efe3cc}.latest .item:first-child{border-top:0}.item-left{display:flex;gap:10px;align-items:flex-start}.iconball{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-size:18px}.meta small,.muted{color:#96775b}
.segment{position:sticky;bottom:10px;display:grid;grid-template-columns:1fr 1fr;gap:4px;border-radius:30px;padding:4px;margin:14px auto 0;width:min(390px,100%)}.segment button{border:0;background:transparent;border-radius:26px;padding:12px;font-size:22px;font-weight:800;color:#8b7453}.segment .active{background:#fff0d7;color:#8b3027}.segment.alt{position:static;width:100%;margin:6px 0 18px}
.fab{position:fixed;right:max(22px,calc((100vw - 590px)/2 + 22px));bottom:86px;border:0;width:64px;height:64px;border-radius:50%;background:#9a352d;color:#fff;font-size:38px;box-shadow:0 18px 34px rgba(110,43,36,.35)}
.entry-wrap,.summary-wrap{display:grid;gap:12px}.category-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.cat-btn{border:2px solid transparent;border-radius:24px;padding:12px 8px;min-height:94px;background:#fff7eb}.cat-btn.active{border-color:#f39b98;box-shadow:0 10px 24px rgba(154,102,71,.12)}.cat-btn span{font-size:28px;display:block}.cat-btn b{display:block;margin-top:6px;font-size:15px}
.field{display:block}.field span{display:block;font-weight:800;margin-bottom:7px}.inputbox{display:flex;align-items:center;gap:10px;border-radius:18px;padding:10px 14px}.inputbox input,.inputbox textarea{flex:1;border:0;background:transparent;outline:none;color:var(--ink)}.inputbox textarea{min-height:82px;resize:none}
.savebtn{border:0;border-radius:20px;padding:16px 18px;background:linear-gradient(135deg,#8c342b,#af3e2d);color:#fff;font-weight:900;font-size:24px;margin-top:8px}.tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:6px 0 12px}.tabs button{border:0;border-radius:20px;padding:10px;background:#fff7eb;color:#9b7a5e;font-weight:800}.tabs .active{background:#fff0d7;color:#8b3027}
.stack,.manage-list,.menu-list{display:grid;gap:12px}.day-group{background:#fff8ee;border-radius:20px;padding:14px;box-shadow:var(--shadow)}.day-head{display:flex;justify-content:space-between;color:#8f7356;font-weight:800;margin-bottom:8px}.month-card,.report,.menu-item{background:#fff8ee;border-radius:24px;box-shadow:var(--shadow)}.month-card{padding:14px}.bar-row{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;margin:10px 0}.bar-row .line{grid-column:1/2;height:8px;background:#f0e5d2;border-radius:999px;overflow:hidden}.bar-row .fill{height:100%;border-radius:999px}
.menu-item{border:0;padding:14px;display:grid;grid-template-columns:44px 1fr 18px;gap:12px;align-items:center;text-align:left}.menu-item span{font-size:28px}.menu-item b{display:block;font-size:17px}.menu-item i{font-style:normal;color:#a07b5b}.manage-item{background:#fff8ee;border-radius:22px;padding:14px;box-shadow:var(--shadow);display:grid;grid-template-columns:40px 1fr auto;gap:12px;align-items:center}.tools{display:flex;gap:8px}.tool{border:0;background:#fff1e6;border-radius:12px;padding:8px 10px;color:#a13c2b;font-weight:800}.empty{text-align:center;padding:22px;color:#9b7e60}
@media(max-width:430px){.app{padding-inline:12px}.monthrow h1{font-size:28px}.total{font-size:44px}.bubbles{height:400px}.category-grid{gap:10px}.segment button{font-size:20px}}
/* mobile polish v4 */
button.item,.history-item{width:100%;border:0;background:transparent;text-align:left;color:inherit;appearance:none;-webkit-appearance:none}
.latest .item,.history-item{align-items:center;border-top:1px solid #efe3cc;box-shadow:none;border-radius:0}
.latest .item:first-child{border-top:0}.latest .item:last-child{padding-bottom:14px}
.meta{min-width:0;display:flex;flex-direction:column}.meta b{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.meta small{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:220px}
.item>.pos,.item>.neg,.history-item>.pos,.history-item>.neg{margin-left:auto;text-align:right;display:flex;flex-direction:column;align-items:flex-end;white-space:nowrap}.item>.pos b,.item>.neg b,.history-item>.pos b,.history-item>.neg b{font-size:17px}
.section-head{min-height:34px}.section-head .link{font-size:14px;font-weight:700;padding:8px 0}.latest{overflow:hidden}
.monthrow h1{white-space:nowrap;font-size:clamp(23px,7vw,31px);line-height:1.15}.hero .monthrow{grid-template-columns:28px minmax(0,1fr) 28px}.monthrow button{font-size:28px;padding:0}
.bubbles{height:410px;overflow:hidden}.bubble{box-shadow:inset 0 0 26px #ffffff55,0 10px 22px rgba(141,109,69,.10)}
@media(max-width:430px){.app{padding:14px 12px 22px}.topbar{margin-bottom:8px}.pill{height:50px;padding:0 18px}.round{width:50px;height:50px}.hero{margin-top:2px}.hero .total{font-size:43px}.stats{gap:8px;margin-top:12px}.chip{padding:10px 6px}.chip b{font-size:15px}.bubbles{height:395px;margin-top:12px}.latest{margin-top:8px;padding:12px}.segment{margin-top:10px}.fab{bottom:78px;width:58px;height:58px;font-size:34px}.meta small{max-width:175px}}

/* v5 mobile polish: bubble packing + spacing */
#bubbleArea{overflow:hidden;height:390px;margin-top:14px}
#bubbleArea .bubble{transform:translateX(-50%) scale(.9);transform-origin:center center}
#bubbleArea .bubble:nth-child(1){left:50%!important;top:31%!important}
#bubbleArea .bubble:nth-child(2){left:77%!important;top:10%!important}
#bubbleArea .bubble:nth-child(3){left:23%!important;top:18%!important}
#bubbleArea .bubble:nth-child(4){left:24%!important;top:57%!important}
#bubbleArea .bubble:nth-child(5){left:76%!important;top:57%!important}
#bubbleArea .bubble:nth-child(6){left:43%!important;top:3%!important}
#bubbleArea .bubble:nth-child(7){left:58%!important;top:31%!important}
#bubbleArea .bubble:nth-child(8){left:50%!important;top:67%!important}
.latest{margin-top:8px;margin-bottom:18px;padding-bottom:12px}
#screen-dashboard{padding-bottom:88px}
@media(max-width:430px){#bubbleArea{height:370px}.stats{gap:8px}.chip{padding:10px 7px}.chip b{font-size:15px}.fab{bottom:82px;width:58px;height:58px;font-size:34px}.segment{margin-top:10px}}

/* v6 final mobile polish */
#screen-dashboard{padding-bottom:132px}
#bubbleArea{overflow:hidden;height:360px;margin-top:10px;margin-bottom:2px;position:relative}
#bubbleArea .bubble{transform:translateX(-50%);transform-origin:center center;box-shadow:inset 0 0 26px rgba(255,255,255,.35),0 10px 22px rgba(141,109,69,.10)}
#bubbleArea .bubble:nth-child(1){left:50%!important;top:34%!important;transform:translateX(-50%) scale(1);z-index:1}
#bubbleArea .bubble:nth-child(2){left:79%!important;top:18%!important;transform:translateX(-50%) scale(.93);z-index:2}
#bubbleArea .bubble:nth-child(3){left:21%!important;top:28%!important;transform:translateX(-50%) scale(.93);z-index:2}
#bubbleArea .bubble:nth-child(4){left:22%!important;top:61%!important;transform:translateX(-50%) scale(.88);z-index:2}
#bubbleArea .bubble:nth-child(5){left:78%!important;top:61%!important;transform:translateX(-50%) scale(.88);z-index:2}
#bubbleArea .bubble:nth-child(6){left:50%!important;top:6%!important;transform:translateX(-50%) scale(.86);z-index:3}
#bubbleArea .bubble:nth-child(7){left:58%!important;top:36%!important;transform:translateX(-50%) scale(.80);z-index:3}
#bubbleArea .bubble:nth-child(8){left:50%!important;top:69%!important;transform:translateX(-50%) scale(.82);z-index:3}
.latest{margin-top:0;margin-bottom:14px;padding-bottom:10px}.segment{margin-top:8px}
.fab{bottom:96px;width:58px;height:58px;font-size:34px;right:max(18px,calc((100vw - 590px)/2 + 18px))}
@media(max-width:430px){#screen-dashboard{padding-bottom:126px}#bubbleArea{height:345px;margin-top:8px;margin-bottom:0}.latest{margin-top:0;margin-bottom:12px}.segment{margin-top:8px}.fab{bottom:94px;width:56px;height:56px;font-size:32px}}
