:root{--cream:#fff8ee;--paper:#fff;--cocoa:#5b4636;--cocoa-soft:#8a7361;--orange:#f2994a;--orange-deep:#d97b2b;--green:#6fa37a;--peach:#f7c6c0;--line:#efe3d3;--calm-blue:#3d6fa8;--calm-blue-soft:#e6eef8;--warn:#b5523b;--radius:18px;--shadow:0 4px 16px #5b463614;--tab-h:64px;color:var(--cocoa);background:var(--cream);-webkit-text-size-adjust:100%;font-family:-apple-system,BlinkMacSystemFont,Noto Sans Thai,Sukhumvit Set,Thonburi,Segoe UI,sans-serif}*{box-sizing:border-box}html,body{background:var(--cream);margin:0;padding:0;overflow-x:hidden}body{min-height:100dvh;font-size:16px;line-height:1.55}button,input,select,textarea{font:inherit;color:inherit}a{color:var(--orange-deep)}img{max-width:100%}.app{flex-direction:column;max-width:480px;min-height:100dvh;margin:0 auto;display:flex}.topbar{z-index:5;border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#fff8eef2;justify-content:space-between;align-items:center;gap:8px;padding:10px 16px;display:flex;position:sticky;top:0}.topbar h1{margin:0;font-size:18px;font-weight:700}.topbar .back{cursor:pointer;background:0 0;border:0;min-width:44px;min-height:44px;font-size:22px}.safety-link{background:var(--calm-blue-soft);min-width:44px;min-height:44px;color:var(--calm-blue);border-radius:22px;justify-content:center;align-items:center;font-size:20px;text-decoration:none;display:inline-flex}main.content{padding:16px 16px calc(var(--tab-h) + 24px);flex:1}.tabs{height:var(--tab-h);background:var(--paper);border-top:1px solid var(--line);z-index:6;padding-bottom:env(safe-area-inset-bottom);justify-content:center;display:flex;position:fixed;bottom:0;left:0;right:0}.tabs nav{grid-template-columns:repeat(5,1fr);width:100%;max-width:480px;display:grid}.tabs a{color:var(--cocoa-soft);flex-direction:column;justify-content:center;align-items:center;gap:2px;min-height:44px;font-size:12px;text-decoration:none;display:flex}.tabs a .ico{font-size:22px;line-height:1}.tabs a.active{color:var(--orange-deep);font-weight:700}.card{background:var(--paper);border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid var(--line);margin-bottom:14px;padding:16px}.card h2,.card h3{margin:0 0 8px;font-size:17px}.muted{color:var(--cocoa-soft);font-size:14px}.small{font-size:13px}.row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.col{flex-direction:column;gap:10px;display:flex}.grid2{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.spacer{flex:1}.center{text-align:center}.btn{background:var(--orange);color:#fff;cursor:pointer;border:0;border-radius:14px;justify-content:center;align-items:center;gap:6px;min-height:48px;padding:10px 18px;font-size:16px;font-weight:700;text-decoration:none;display:inline-flex}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.block{width:100%}.btn.secondary{color:var(--cocoa);background:#f4e7d6}.btn.ghost{color:var(--cocoa);border:1.5px solid var(--line);background:0 0}.btn.green{background:var(--green)}.btn.calm{background:var(--calm-blue)}.btn.danger{background:var(--warn)}.btn.sm{border-radius:12px;min-height:44px;padding:6px 12px;font-size:14px}.chips{flex-wrap:wrap;gap:8px;display:flex}.chip{border:1.5px solid var(--line);background:var(--paper);cursor:pointer;border-radius:22px;min-height:44px;padding:8px 14px;font-size:15px}.chip.on{background:var(--orange);color:#fff;border-color:var(--orange);font-weight:700}.chip:disabled{opacity:.45}.badge{background:#f4e7d6;border-radius:12px;padding:2px 10px;font-size:12px;display:inline-block}.badge.lock{color:#5a4b7a;background:#ece6f4}.badge.ok{color:#2f6b3e;background:#e2f0e5}label.field{flex-direction:column;gap:6px;margin-bottom:14px;font-size:15px;font-weight:600;display:flex}input[type=text],input[type=time],input[type=date],input[type=number],select,textarea{border:1.5px solid var(--line);background:var(--paper);border-radius:12px;width:100%;min-height:48px;padding:10px 12px;font-weight:400}textarea{resize:vertical;min-height:96px}.check{background:var(--paper);border:1.5px solid var(--line);cursor:pointer;border-radius:14px;align-items:flex-start;gap:12px;margin-bottom:10px;padding:12px;display:flex}.check input{width:24px;height:24px;accent-color:var(--orange);flex:none;margin-top:2px}.state{text-align:center;color:var(--cocoa-soft);padding:32px 12px}.state .emoji{font-size:40px}.spinner{border:4px solid var(--line);border-top-color:var(--orange);border-radius:50%;width:36px;height:36px;margin:0 auto 12px;animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.error{color:#8a2f22;background:#fbeceb;border-radius:14px;margin-bottom:12px;padding:12px}.toast{left:50%;bottom:calc(var(--tab-h) + 16px);background:var(--cocoa);color:#fff;z-index:10;border-radius:22px;max-width:90vw;padding:10px 18px;font-size:15px;position:fixed;transform:translate(-50%)}.hero{text-align:center;padding:24px 8px 8px}.hero img{width:180px;height:auto}.hero h1{margin:8px 0 4px;font-size:26px}.notice{background:var(--calm-blue-soft);color:#274b75;border-radius:14px;padding:12px 14px;font-size:14px}.cat-card{cursor:pointer;align-items:center;gap:12px;display:flex}.cat-card img{flex:none;width:84px;height:auto}.cat-card.selected{outline:3px solid var(--orange)}.bond-bar{background:#f4e7d6;border-radius:6px;height:12px;overflow:hidden}.bond-bar>div{background:linear-gradient(90deg, var(--orange), #f7b267);border-radius:6px;height:100%}.moods{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;display:grid}.mood-btn{border:1.5px solid var(--line);background:var(--paper);cursor:pointer;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:4px;min-height:76px;padding:6px 2px;font-size:12px;display:flex}.mood-btn .e{font-size:30px;line-height:1}.mood-btn.on{border-color:var(--orange);background:#fff1e3;font-weight:700}.chat{flex-direction:column;gap:10px;padding-bottom:12px;display:flex}.bubble{white-space:pre-wrap;word-break:break-word;border-radius:18px;max-width:82%;padding:10px 14px}.bubble.user{background:var(--orange);color:#fff;border-bottom-right-radius:6px;align-self:flex-end}.bubble.cat{background:var(--paper);border:1px solid var(--line);border-bottom-left-radius:6px;align-self:flex-start}.chat-cat{align-items:flex-end;gap:8px;display:flex}.chat-cat img{flex:none;width:36px;height:auto}.composer{left:0;right:0;bottom:var(--tab-h);background:var(--cream);border-top:1px solid var(--line);z-index:5;padding:8px 12px;position:fixed}.composer form{gap:8px;max-width:456px;margin:0 auto;display:flex}.composer input{flex:1}.talk-pad{height:72px}.safety-banner{background:var(--calm-blue-soft);color:#274b75;border:1.5px solid #bcd0ea;border-radius:14px;margin-bottom:10px;padding:12px}.steps{counter-reset:s;margin:0;padding:0;list-style:none}.steps li{counter-increment:s;align-items:flex-start;gap:10px;margin-bottom:10px;display:flex}.steps li:before{content:counter(s);background:#f4e7d6;border-radius:50%;flex:none;justify-content:center;align-items:center;width:28px;height:28px;font-size:14px;font-weight:700;display:flex}.timer{text-align:center;font-variant-numeric:tabular-nums;font-size:40px;font-weight:800}.breath{background:radial-gradient(circle,#f7c6c0,#f2994a);border-radius:50%;width:140px;height:140px;margin:16px auto;animation:10s ease-in-out infinite breathe}@keyframes breathe{0%,to{transform:scale(.7)}40%{transform:scale(1)}}@media (prefers-reduced-motion:reduce){.breath,.spinner,.wiggle{animation:none}}.wiggle{animation:.6s ease-in-out wiggle}@keyframes wiggle{0%,to{transform:rotate(0)}25%{transform:rotate(-8deg)}75%{transform:rotate(8deg)}}.occ{border-bottom:1px solid var(--line);flex-direction:column;gap:8px;padding:12px 0;display:flex}.occ:last-child{border-bottom:0}.occ .title{font-weight:700}.occ.done .title{color:var(--cocoa-soft);text-decoration:line-through}.weekday-pick{grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;display:grid}.weekday-pick .chip{text-align:center;padding:8px 0}.gift-preview{border-radius:var(--radius);background:#f4e7d6;overflow:hidden}.gift-preview img,.gift-preview video{width:100%;height:auto;display:block}.plan{border:2px solid var(--line)}.plan.current{border-color:var(--green)}.price{font-size:26px;font-weight:800}.resource{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:12px;padding:12px 0;display:flex}.resource:last-child{border-bottom:0}.hidden-sr{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}.tb-spacer{width:44px;display:inline-block}a.card,a.mood-btn,a.row{color:inherit;text-decoration:none}input[type=password]{border:1.5px solid var(--line);background:var(--paper);border-radius:12px;width:100%;min-height:48px;padding:10px 12px}
