:root{font-family:-apple-system,BlinkMacSystemFont,Hiragino Kaku Gothic ProN,Yu Gothic,Meiryo,sans-serif;color:#21342f;background:#f4f6f3;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;--ink: #203731;--muted: #71817a;--line: #e4eae5;--paper: #ffffff;--green: #234f43;--green-soft: #e1eee6;--mint: #c8e2d1;--shadow: 0 16px 40px rgba(31, 59, 48, .08)}*{box-sizing:border-box}html{min-width:320px;background:#f4f6f3}body{margin:0;min-width:320px;min-height:100vh;background:#f4f6f3}body.sheet-open{overflow:hidden}button,input,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.56;cursor:wait}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid rgba(59,128,99,.25);outline-offset:2px}#app{min-height:100vh}.shell{width:min(100%,620px);min-height:100vh;margin:0 auto;padding:env(safe-area-inset-top) 18px calc(104px + env(safe-area-inset-bottom))}.topbar{height:64px;display:flex;align-items:center;justify-content:space-between}.brand-lockup{display:flex;align-items:center;gap:10px;color:var(--ink)}.brand-lockup>span:last-child{display:grid;gap:1px}.brand-lockup strong{font-size:11px;letter-spacing:.17em;font-weight:800}.brand-lockup small{color:var(--muted);font-size:11px;letter-spacing:.04em}.brand-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:12px;background:var(--green);color:#e9f4ec;font:700 20px Georgia,serif;box-shadow:0 5px 14px #234f432e}.icon-button{border:0;color:#5c7068;background:#e9eeea;width:40px;height:40px;display:grid;place-items:center;border-radius:14px;font-size:21px;transition:transform .15s,background .15s}.icon-button:active{transform:scale(.96);background:#dfe8e1}.settings-glyph{font-size:18px}main{padding-bottom:24px}.spend-card{position:relative;overflow:hidden;color:#f6faf6;border-radius:25px;padding:23px 23px 20px;background:radial-gradient(circle at 92% 12%,rgba(201,230,211,.18),transparent 33%),linear-gradient(135deg,#244f43,#183a32);box-shadow:0 16px 34px #1e423530}.spend-card:after{content:"";position:absolute;width:195px;height:195px;border:1px solid rgba(226,245,232,.1);border-radius:50%;right:-83px;bottom:-130px;box-shadow:0 0 0 22px #e2f5e806,0 0 0 46px #e2f5e805;pointer-events:none}.spend-topline{display:flex;align-items:center;justify-content:space-between;gap:10px}.eyebrow{display:block;color:#9db8a9;font-size:9px;font-weight:700;letter-spacing:.16em}.live-dot{color:#d6e9dc;font-size:10px;font-weight:600}.live-dot:first-letter{color:#b4dfbc}.spend-card h1{margin:15px 0 3px;color:#e6f0e9;font-size:14px;line-height:1.5;font-weight:500}.spend-amount{position:relative;z-index:1;font-size:clamp(34px,10vw,43px);line-height:1.12;font-weight:700;letter-spacing:-.055em;font-variant-numeric:tabular-nums}.spend-note{margin:9px 0 0;color:#b5cbc0;font-size:10px}.add-button{min-height:58px;width:100%;border:0;border-radius:18px;margin:15px 0 25px;padding:0 17px;display:flex;align-items:center;gap:11px;background:#d9eddf;color:#1b4b3d;box-shadow:0 6px 17px #1b4b3d14;font-size:15px;font-weight:700;transition:transform .16s,background .16s}.add-button:active{transform:scale(.985);background:#cbe5d3}.add-plus{width:29px;height:29px;border-radius:10px;background:#2c684f;color:#fff;display:grid;place-items:center;font-size:22px;font-weight:400;line-height:1}.add-hint{margin-left:auto;font-size:10px;font-weight:500;color:#587968}.card-plan-section{background:#fff;border-radius:22px;padding:20px 18px 16px;margin-bottom:21px;border:1px solid #e9eeea;box-shadow:0 8px 24px #1c322709}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:13px}.section-heading .eyebrow{color:#889b90;font-size:8px}.section-heading h2{margin:4px 0 0;color:var(--ink);font-size:17px;letter-spacing:-.035em;line-height:1.35}.section-icon{width:30px;height:30px;flex:0 0 30px;border-radius:10px;background:#f0f4f0;color:#668477;display:grid;place-items:center;font-size:16px}.plan-total{display:flex;align-items:center;justify-content:space-between;background:#f1f6f1;border-radius:14px;padding:12px 13px;margin:0 0 14px;color:#62766c;font-size:11px}.plan-total strong{color:#20483b;font-size:18px;font-variant-numeric:tabular-nums;letter-spacing:-.03em}.due-group{padding:11px 1px 10px;border-top:1px solid #edf1ed}.due-date{display:flex;align-items:center;gap:8px;margin-bottom:7px}.calendar-glyph{color:#719381;font-size:14px}.due-date strong{color:#35594a;font-size:13px;font-variant-numeric:tabular-nums}.planned-label{margin-left:auto;color:#91a098;font-size:9px}.card-row{min-height:34px;display:flex;align-items:center;gap:9px;padding:1px}.card-dot{width:8px;height:8px;border-radius:3px;flex:0 0 8px;background:#557b6a}.card-dot.ana{background:#29867e}.card-dot.docomo{background:#a25b63}.card-dot.lumine{background:#bc8b52}.card-name{color:#576d62;font-size:12px}.card-row strong{margin-left:auto;color:#243d33;font-size:13px;font-weight:700;font-variant-numeric:tabular-nums}.text-button{display:inline-flex;align-items:center;justify-content:center;border:0;background:transparent;color:#668675;padding:6px 2px;font-size:10px;font-weight:600}.due-edit{margin-left:16px}.holiday-note{margin:9px 0 3px;padding:10px;border-radius:11px;background:#fbf7ef;color:#8d795c;font-size:10px;line-height:1.6}.estimate-note{margin:5px 0 0;color:#91a098;font-size:9px;line-height:1.55}.summary-section{padding:4px 2px 19px}.summary-section .section-heading{margin-bottom:10px}.breakdown-list{border-top:1px solid #e1e8e2}.breakdown-row{min-height:42px;display:flex;align-items:center;justify-content:space-between;gap:14px;border-bottom:1px solid #e7ece7}.breakdown-label{display:flex;align-items:center;gap:9px;color:#556a60;font-size:12px}.breakdown-row strong{color:#293f35;font-size:12px;font-weight:650;font-variant-numeric:tabular-nums}.mini-icon{display:grid;place-items:center;width:23px;height:23px;border-radius:8px;color:#628071;background:#e9f0ea;font-size:12px}.method-badge{display:grid;place-items:center;width:24px;height:24px;border-radius:8px;background:#eef0eb;color:#6d7568;font-size:10px;font-weight:700}.method-badge.paypay{background:#f8e9e8;color:#be4f4c}.method-badge.suica{background:#e4f1e8;color:#3a7b54}.method-badge.jal{background:#f6e8e8;color:#a23f4c}.method-badge.ana{background:#e4f0ef;color:#26796d}.method-badge.docomo{background:#f6ebeb;color:#b34f58}.method-badge.lumine{background:#f6efe5;color:#a77c3b}.empty-hint,.muted{margin:0;border-radius:14px;background:#edf2ed;padding:14px;color:#7a8b82;font-size:11px;line-height:1.7}.expand-button{padding-top:12px}.payment-section{padding-top:10px;border-top:1px solid #e3eae4}.history-section{padding-top:9px;border-top:1px solid #e3eae4}.history-list{border-top:1px solid #e1e8e2}.history-row{min-height:58px;display:flex;align-items:flex-start;gap:11px;padding:11px 0;border-bottom:1px solid #e7ece7}.history-date{flex:0 0 60px;color:#82928a;font-size:10px;padding-top:3px}.history-main{display:grid;min-width:0;gap:3px}.history-main strong{color:#2c4339;font-size:12px;font-variant-numeric:tabular-nums}.history-main span,.history-main small{color:#77877f;font-size:10px;overflow-wrap:anywhere}.app-footer{display:flex;justify-content:space-between;color:#a1ada6;font-size:9px;padding:14px 2px 0}.bottom-action{display:none}.sheet-backdrop{position:fixed;inset:0;z-index:20;display:flex;align-items:flex-end;justify-content:center;background:#14261f5c;opacity:0;visibility:hidden;transition:opacity .18s,visibility .18s;padding-top:env(safe-area-inset-top)}.sheet-backdrop.open{opacity:1;visibility:visible}.sheet{width:min(100%,620px);max-height:min(93vh,860px);overflow-y:auto;overscroll-behavior:contain;border-radius:26px 26px 0 0;background:#fbfcfa;padding:9px 20px calc(20px + env(safe-area-inset-bottom));transform:translateY(25px);transition:transform .22s cubic-bezier(.23,1,.32,1);box-shadow:0 -10px 40px #162d222e}.sheet-backdrop.open .sheet{transform:translateY(0)}.sheet-handle{width:37px;height:4px;border-radius:9px;background:#d7dfd8;margin:0 auto 16px}.sheet-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}.sheet-header .eyebrow{color:#83978b;font-size:8px}.sheet-header h2{margin:3px 0 0;font-size:20px;letter-spacing:-.04em}.close-sheet{font-size:23px;font-weight:300}.field-label{display:block;color:#4c6257;font-size:11px;font-weight:700}.amount-input-wrap{display:flex;align-items:center;gap:7px;border-bottom:1.5px solid #ccd8ce;margin:1px 0 0}.amount-input-wrap input{width:100%;min-width:0;padding:3px 0 1px;border:0;outline:0;background:transparent;color:#23493a;font-size:32px;line-height:1.35;font-weight:700;letter-spacing:-.05em;font-variant-numeric:tabular-nums}.amount-input-wrap input::placeholder{color:#c3cdc6}.amount-input-wrap span{color:#74877c;font-size:14px}.amount-preview{height:17px;color:#7c9686;font-size:10px;text-align:right;padding-top:2px}.field-head{display:flex;justify-content:space-between;align-items:baseline;margin:13px 0 7px}.field-caption{color:#a0aaa4;font-size:9px}.choice-grid{display:grid;gap:6px}.payment-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.category-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.choice{min-width:0;min-height:42px;border:1px solid #e5ebe5;border-radius:12px;background:#fff;color:#596e63;display:flex;align-items:center;justify-content:flex-start;gap:7px;padding:5px 8px;text-align:left;font-size:10px;font-weight:600;line-height:1.25;transition:background .12s,border .12s,transform .12s}.choice:active{transform:scale(.975)}.choice.selected{border-color:#4c8068;background:#eaf3ec;color:#234b3c;box-shadow:inset 0 0 0 1px #4c8068}.choice-icon{display:grid;place-items:center;flex:0 0 25px;width:25px;height:25px;border-radius:8px;background:#f0f2ee;color:#607268;font-size:9px;font-weight:700}.choice-icon.jal{background:#f8e9e8;color:#a23f4c}.choice-icon.ana{background:#e4f0ef;color:#26796d}.choice-icon.docomo{background:#f6ebeb;color:#b34f58}.choice-icon.lumine{background:#f6efe5;color:#a77c3b}.choice-icon.paypay{background:#f9e7e5;color:#be4f4c}.choice-icon.suica{background:#e7f1e8;color:#397755}.category-grid .choice{justify-content:center;gap:4px;padding:5px 3px;text-align:center;font-size:10px}.category-mark{color:#769282;font-size:12px;font-weight:700}.category-head{margin-top:14px}.optional-row{display:flex;align-items:center;justify-content:space-between;margin:14px 0 5px;border-top:1px solid #edf0ec;padding-top:12px}.optional-row input{max-width:150px;border:1px solid #e3e9e3;border-radius:10px;background:#fff;color:#52685c;padding:7px 8px;font-size:11px}.memo-toggle{border-top:1px solid #edf0ec;padding:11px 0 0;margin-top:9px}.memo-toggle summary{list-style:none;cursor:pointer;color:#63796d;font-size:11px;font-weight:600}.memo-toggle summary::-webkit-details-marker{display:none}.memo-toggle summary:after{content:"+";float:right;font-size:15px;color:#7c9787}.memo-toggle[open] summary:after{content:"−"}.memo-toggle summary span{margin-left:5px;color:#9ba8a0;font-size:9px;font-weight:400}.memo-toggle textarea{width:100%;resize:vertical;border:1px solid #dfe7e0;border-radius:12px;margin-top:9px;padding:10px;color:#304a3e;background:#fff;font-size:12px}.button{min-height:50px;width:100%;border:0;border-radius:15px;font-size:13px;font-weight:700;transition:transform .15s,opacity .15s}.button:active{transform:scale(.99)}.button.primary{background:#234f43;color:#f4faf5;box-shadow:0 8px 18px #234f432b}.button.ghost{background:#eef2ee;color:#586e63}.save-button{margin-top:14px}.settings-sheet{padding-bottom:calc(18px + env(safe-area-inset-bottom))}.settings-intro{margin:0 0 13px;color:#7b8a82;font-size:11px;line-height:1.7}.card-setting{padding:13px 0 12px;border-top:1px solid #e7ece7}.setting-card-title{display:flex;align-items:center;gap:8px;color:#3b594a;font-size:13px}.setting-inputs{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}.setting-inputs label{color:#708178;font-size:10px}.setting-number{display:flex;align-items:center;gap:5px;margin-top:5px}.setting-number input{width:100%;border:1px solid #e0e7e0;border-radius:10px;background:#fff;color:#304a3e;padding:9px;font-size:13px}.setting-number span{color:#8a9990;font-size:10px}.setting-save{margin-top:3px}.override-label{margin:2px 0 0;color:#a18058;font-size:9px}.logout-button{margin-top:15px}.toast{position:fixed;z-index:60;left:50%;bottom:calc(28px + env(safe-area-inset-bottom));transform:translate(-50%,12px);opacity:0;pointer-events:none;border-radius:13px;background:#203d33;color:#f5faf5;padding:12px 17px;max-width:calc(100vw - 36px);box-shadow:var(--shadow);font-size:12px;white-space:nowrap;transition:opacity .18s,transform .18s}.toast.show{transform:translate(-50%);opacity:1}.auth-screen{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:calc(25px + env(safe-area-inset-top)) 22px calc(25px + env(safe-area-inset-bottom))}.auth-brand{position:absolute;top:calc(23px + env(safe-area-inset-top));left:max(22px,calc((100vw - 620px)/2 + 22px));display:flex;align-items:center;gap:9px;color:#4d6659;font-size:11px;font-weight:600}.auth-card{width:min(100%,400px);border:1px solid #e5ebe5;border-radius:25px;background:#fff;box-shadow:var(--shadow);padding:26px 23px 22px;text-align:center}.auth-icon{display:grid;place-items:center;width:56px;height:56px;margin:0 auto 17px;border-radius:18px;background:#e8f2e9;color:#3e765b;font-size:24px}.auth-card .eyebrow{color:#8ba092;font-size:8px}.auth-card h1{margin:7px 0 9px;color:#213c31;font-size:22px;letter-spacing:-.05em}.auth-copy{margin:0 auto 21px;max-width:300px;color:#7c8a82;font-size:12px;line-height:1.8}.auth-action{max-width:300px}.auth-error{min-height:18px;margin:12px 0 0;color:#a3544e;font-size:10px;line-height:1.5}.auth-foot{margin:16px 0 0;color:#a1aca5;font-size:9px}@media(min-width:700px){.shell{padding-top:18px}.spend-card{padding:25px 27px 23px}.bottom-action{display:none}}@media(max-width:380px){.shell{padding-left:13px;padding-right:13px}.sheet{padding-left:14px;padding-right:14px}.choice{gap:4px;padding-left:5px;padding-right:5px;font-size:9px}.category-grid{gap:5px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}