:root{--bg:#f0e8d8;--surface:#fffdf7;--surface-2:#efe4cf;--fg:#2a2117;--fg-muted:#7a6e5c;--accent:#b8862c;--accent-2:#8c5a2b;--gold-deep:#6e4a1c;--danger:#a13a2f;--nirvana:#6a4fa3;--ok:#3f7d4f;--line:#3b2a1a;--font-display:"Chonburi", "IBM Plex Sans Thai", serif}*{box-sizing:border-box}html,body{height:100%}body{background:radial-gradient(120% 90% at 50% -20%, #f4b94238, transparent 60%), repeating-linear-gradient(45deg, #b8862c0d 0 2px, transparent 2px 14px), repeating-linear-gradient(-45deg, #b8862c0d 0 2px, transparent 2px 14px), var(--bg);color:var(--fg);margin:0;font-family:IBM Plex Sans Thai,Noto Sans Thai,system-ui,sans-serif}[hidden]{display:none!important}button{font:inherit;color:inherit;cursor:pointer}.link-btn{background:var(--surface-2);color:var(--fg);border-radius:999px;padding:.5rem 1rem;font-size:.85rem;text-decoration:none;display:inline-block}.wallet{flex-direction:column;height:100dvh;display:flex;overflow:hidden}.balance-card{border-bottom:3px solid var(--accent);text-align:center;background:repeating-radial-gradient(circle at -2% -8%,#0000 0 5px,#8c5a2b12 5px 6px) 0 0/220px 220px no-repeat,repeating-radial-gradient(circle at 102% 108%,#0000 0 5px,#8c5a2b12 5px 6px) 100% 100%/220px 220px no-repeat,linear-gradient(160deg,#fffdf7 0%,#fbf1da 55%,#f3e2bd 100%);border-radius:0 0 1.5rem 1.5rem;flex-shrink:0;padding:1.25rem 1rem 1rem;position:relative;box-shadow:inset 0 0 0 1px #8c5a2b47,inset 0 0 0 4px #fffdf7e6,inset 0 0 0 5px #8c5a2b2e,0 4px 16px #6e4a1c29}.balance-card:before{content:"บุญWallet";font-family:var(--font-display);color:var(--accent-2);font-size:.78rem;position:absolute;top:.6rem;left:.9rem}.balance-card:after{content:attr(data-serial);font-family:var(--font-display);color:var(--danger);font-size:.72rem;position:absolute;top:.6rem;right:3.4rem}.balance-label{color:var(--fg-muted);font-size:.8rem}.balance-amount{font-family:var(--font-display);color:var(--gold-deep);cursor:pointer;font-size:clamp(1.9rem,8.5vw,2.8rem);font-weight:400;line-height:1.25}.balance-rate{color:var(--ok);font-size:.85rem;font-weight:600}.rebirth-badge{background:var(--surface);border:1.5px solid var(--accent);color:var(--accent-2);border-radius:999px;margin-top:.5rem;padding:.25rem .75rem;font-size:.8rem;font-weight:600;display:inline-block}.icon-btn{background:var(--surface-2);border:none;border-radius:999px;width:2.25rem;height:2.25rem;font-size:1.1rem;line-height:1;position:absolute;top:.75rem;right:.75rem}.event-banner{flex-shrink:0;margin:.5rem}.event-claim{text-align:left;background:var(--surface);border:none;border-radius:1rem;align-items:flex-start;gap:.6rem;width:100%;padding:.75rem 1rem;animation:.3s ease-out notif-in;display:flex;box-shadow:0 4px 14px #0000002e}.event-icon{background:var(--accent);color:#fff;border-radius:999px;flex-shrink:0;justify-content:center;align-items:center;width:2rem;height:2rem;font-size:1.1rem;display:flex}.event-body{flex-direction:column;gap:.1rem;min-width:0;display:flex}.event-app{color:var(--fg-muted);font-size:.7rem;font-weight:600}.event-title{color:var(--fg);font-weight:700}.event-desc{color:var(--fg-muted);font-size:.8rem}.buff-pills{flex-wrap:wrap;justify-content:center;gap:.35rem;margin-top:.4rem;display:flex}.buff-pill{background:var(--accent);color:#fff;border-radius:999px;padding:.2rem .6rem;font-size:.72rem;font-weight:600;display:inline-block}.click-area{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:.75rem;min-height:0;padding:1rem;display:flex;position:relative;overflow:hidden}.click-area:before{content:"";aspect-ratio:1;pointer-events:none;background:repeating-conic-gradient(#f4b94229 0deg 9deg,#0000 9deg 24deg);width:min(150vw,720px);animation:48s linear infinite aura-spin;position:absolute;top:50%;left:50%;translate:-50% -50%;-webkit-mask-image:radial-gradient(circle,#000 20%,#0000 68%);mask-image:radial-gradient(circle,#000 20%,#0000 68%)}@keyframes aura-spin{to{rotate:360deg}}.clickable{z-index:1;position:relative}.float-layer{z-index:2}.clickable{border:3px solid var(--gold-deep);background:radial-gradient(circle at 35% 28%, #fff2cf 0%, #f2ce7e 34%, var(--accent) 68%, var(--accent-2) 100%);width:min(55vw,220px);min-width:200px;height:min(55vw,220px);min-height:200px;color:var(--gold-deep);touch-action:manipulation;-webkit-user-select:none;user-select:none;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;gap:.4rem;animation:3.2s ease-in-out infinite coin-breathe;display:flex;box-shadow:0 0 0 6px #f4b94247,0 10px 26px #6e4a1c52,inset 0 -8px 18px #6e4a1c47,inset 0 6px 14px #fffaebb3}.clickable:active{transform:scale(.95);box-shadow:0 0 0 6px #f4b94266,0 4px 12px #6e4a1c4d,inset 0 -4px 10px #6e4a1c4d,inset 0 4px 10px #fffaeb99}@keyframes coin-breathe{0%,to{box-shadow:0 0 0 6px #f4b94247,0 10px 26px #6e4a1c52,inset 0 -8px 18px #6e4a1c47,inset 0 6px 14px #fffaebb3}50%{box-shadow:0 0 0 12px #f4b94224,0 10px 26px #6e4a1c52,inset 0 -8px 18px #6e4a1c47,inset 0 6px 14px #fffaebb3}}.click-art{font-size:3rem;line-height:1}.click-tier-name{text-align:center;color:var(--accent-2);background:#fffaebd9;border-radius:999px;padding:.2rem .85rem;font-size:.85rem;font-weight:700}.float-layer{pointer-events:none;position:absolute;inset:0;overflow:visible}.float-plus{font-family:var(--font-display);color:var(--gold-deep);text-shadow:0 1px #fffaebe6;animation:1s ease-out forwards float-up;position:absolute;top:40%}.shake{animation:.3s ease-in-out shake}.tab-bar{background:var(--surface);border-top:2px solid var(--surface-2);flex-shrink:0;gap:.3rem;padding:.35rem .5rem;display:flex}.tab{color:var(--fg-muted);background:0 0;border:none;border-radius:999px;flex:1;padding:.55rem .5rem;font-size:.85rem;font-weight:600}.tab.active{color:#fff;background:linear-gradient(160deg, var(--accent), var(--accent-2));font-weight:700;box-shadow:inset 0 1px 3px #fffaeb66,0 2px 6px #6e4a1c4d}.panel{background:var(--surface-2);flex-shrink:0;max-height:45dvh;padding:.75rem;overflow-y:auto}.service-row,.upgrade-row{text-align:left;background:var(--surface);border:2px solid #3b2a1a24;border-radius:1rem;grid-template-columns:1fr auto;gap:.1rem .75rem;width:100%;margin-bottom:.5rem;padding:.6rem .85rem;transition:transform 80ms;display:grid;box-shadow:0 2px #3b2a1a1f}button.service-row:not(.unaffordable):active,button.upgrade-row:not(.unaffordable):active{transform:translateY(1px);box-shadow:0 1px #3b2a1a1f}.service-name,.upgrade-name{text-wrap:pretty;grid-column:1;font-weight:600}.service-flavor,.upgrade-flavor{color:var(--fg-muted);grid-column:1/-1;font-size:.75rem}.service-owned{grid-column:2;align-self:start}.service-cost,.upgrade-cost{grid-column:2;align-self:start;font-weight:600}.service-row.locked{background:var(--surface-2);opacity:.55;justify-content:space-between;display:flex}.service-row.unaffordable,.upgrade-row.unaffordable{opacity:.5}.pix{image-rendering:pixelated}.pix-click{width:clamp(96px,30vw,128px);height:clamp(96px,30vw,128px)}.service-row{grid-template-columns:auto 1fr auto}.pix-icon{grid-area:1/1/span 2;align-self:center;width:48px;height:48px}.service-name{grid-column:2}.service-flavor{grid-column:2/-1}.service-owned,.service-cost{grid-column:3}.service-row.locked{align-items:center;gap:.75rem}.service-row.locked .service-cost{margin-left:auto}.service-row.locked .pix-icon{filter:brightness(0);opacity:.22}.upgrade-row.amulet{border:2px solid var(--accent);background:linear-gradient(135deg, var(--surface-2), #f6e9c9)}.upgrade-row.click-tier-row{background:var(--accent);color:#fff}.upgrade-row.click-tier-row .upgrade-cost{color:#fff}.empty-hint{color:var(--fg-muted);font-size:.85rem}#achievements-list{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.5rem;margin-bottom:1rem;display:grid}.achievement-item{background:var(--surface);border:2px solid #3b2a1a24;border-radius:.75rem;padding:.5rem .6rem}.achievement-item.locked{opacity:.45}.achievement-name{font-size:.8rem;font-weight:700;display:block}.achievement-desc{color:var(--fg-muted);font-size:.7rem;display:block}#stats-block{margin-bottom:1rem}.stat-row{border-bottom:1px solid var(--surface-2);justify-content:space-between;padding:.35rem 0;font-size:.85rem;display:flex}.danger-btn,.nirvana-btn{color:#fff;border:none;border-radius:1rem;width:100%;margin-top:.5rem;padding:.75rem;font-weight:700;display:block}.danger-btn{background:var(--danger)}.nirvana-btn{background:var(--nirvana)}.about-link{text-align:center;margin-top:1rem}.toast-layer{left:0;right:0;bottom:calc(1rem + env(safe-area-inset-bottom,0px));pointer-events:none;z-index:50;flex-direction:column;align-items:center;gap:.4rem;display:flex;position:fixed}.toast{color:#fff;opacity:1;text-align:center;background:#14100ae6;border-radius:999px;max-width:85vw;padding:.5rem 1rem;font-size:.85rem;transition:opacity .4s}.toast-out{opacity:0}#confirm-dialog{border:2px solid var(--accent);background:linear-gradient(160deg,#fffdf7,#faf0d9);border-radius:1rem;outline:4px solid #f4b94240;max-width:min(90vw,360px);padding:1.25rem}#confirm-dialog::backdrop{background:#0006}.confirm-actions{gap:.5rem;margin-top:1rem;display:flex}.confirm-actions button{border:none;border-radius:999px;flex:1;padding:.6rem;font-weight:600}.secondary-btn{background:var(--surface-2);color:var(--fg)}.ending{background:var(--bg);z-index:100;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.ending-content{text-align:center;width:min(90vw,360px)}.ending-stats{margin-bottom:1.5rem}.ending-line{color:var(--fg-muted);margin-bottom:2.5rem;font-size:1.1rem;font-weight:600}.reenter-btn{right:1rem;bottom:calc(1rem + env(safe-area-inset-bottom,0px));background:var(--surface-2);color:var(--fg);border:none;border-radius:999px;padding:.4rem .9rem;font-size:.7rem;position:fixed}#app.app-ending{opacity:0;transition:opacity 4s}.rebirth-overlay{color:var(--fg);z-index:200;opacity:0;background:#fff;justify-content:center;align-items:center;transition:opacity .5s;display:flex;position:fixed;inset:0}.rebirth-overlay.visible{opacity:1}.rebirth-content{text-align:center;padding:1.5rem}.rebirth-tier-name{margin-bottom:.5rem;font-size:1.8rem;font-weight:700}.rebirth-flavor{color:var(--fg-muted);font-size:.95rem}.about-page{max-width:640px;margin:0 auto;padding:1.5rem 1.25rem 3rem}.about-header h1{margin-bottom:.25rem;font-size:1.5rem}.about-section{margin-top:1.75rem}.about-section h2{margin-bottom:.5rem;font-size:1.05rem}.about-section p{margin:0 0 .75rem;line-height:1.6}.about-guardrails{margin:0;padding-left:1.25rem;line-height:1.7}.unit-table-wrap{background:var(--surface);border-radius:.75rem;margin-bottom:1rem;overflow-x:auto}.unit-table{border-collapse:collapse;width:100%;font-size:.85rem}.unit-table th,.unit-table td{text-align:left;border-bottom:1px solid var(--surface-2);padding:.5rem .75rem}.unit-table th{color:var(--fg-muted);font-weight:600}.source-links{flex-wrap:wrap;gap:.5rem;display:flex}.source-link,.back-link{background:var(--surface-2);color:var(--fg);border-radius:999px;padding:.5rem 1rem;font-size:.8rem;text-decoration:none;display:inline-block}.back-link{background:var(--accent);color:#fff;font-weight:600}@keyframes float-up{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-70px)}}@keyframes notif-in{0%{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-4px)rotate(-1deg)}40%{transform:translate(4px)rotate(1deg)}60%{transform:translate(-3px)}80%{transform:translate(3px)}}@media (width>=640px){.wallet{max-width:480px;margin:0 auto;box-shadow:0 0 24px #00000014}}@media (width>=1024px){.wallet{grid-template:"sidebar header aside""sidebar banner aside""sidebar click aside"1fr/220px minmax(0,1fr) 340px;max-width:1200px;height:100dvh;display:grid;overflow:hidden}.tab-bar{border-top:none;border-right:1px solid var(--surface-2);flex-direction:column;grid-area:sidebar;align-items:stretch;gap:.25rem;padding:1rem 0}.tab{text-align:left;flex:none;padding:.85rem 1.25rem;font-size:.95rem}.tab.active{border-radius:0 999px 999px 0;box-shadow:0 2px 6px #6e4a1c4d}.balance-card{border-radius:0 0 1rem 1rem;grid-area:header}.event-banner{grid-area:banner}.click-area{grid-area:click;padding:2rem}.clickable{width:280px;min-width:280px;height:280px;min-height:280px}.click-art{font-size:4rem}.pix-click{width:160px;height:160px}.panel{border-left:1px solid var(--surface-2);grid-area:1/aside/-1;height:100%;max-height:none;padding:1.25rem}}@media (prefers-reduced-motion:reduce){.float-plus,.shake,.event-claim,.clickable,.click-area:before{animation:none!important}.clickable:active{transform:none}#app.app-ending,.rebirth-overlay{transition:none!important}}
