@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@500;600;700&family=Noto+Sans+JP:wght@400;500;600;700&display=swap";
:root{--ink:#252925;--muted:#83877f;--paper:#f5f4ef;--card:#fff;--green:#254c3d;--coral:#ef6b52}*{box-sizing:border-box}html,body{max-width:100%;overflow-x:hidden}body{color:var(--ink);background:#deded8;margin:0;font-family:Noto Sans JP,sans-serif}.shell{background:var(--paper);width:100%;max-width:440px;min-height:100vh;margin:auto;padding:0 20px 110px;position:relative;overflow:hidden;box-shadow:0 0 50px #7773}header{justify-content:space-between;align-items:center;height:78px;display:flex}.brand{align-items:center;gap:9px;font:700 19px DM Sans;display:flex}.brandmark{background:var(--green);color:#fff;border-radius:9px;place-items:center;width:29px;height:29px;display:grid}.avatar{color:var(--green);background:#e1dfd4;border:0;border-radius:50%;width:34px;height:34px;font-weight:700}.hero{text-align:center;padding:20px 0 25px}.eyebrow{color:var(--muted);letter-spacing:.08em;font-size:12px;font-weight:600}.total{letter-spacing:-2px;font:700 45px DM Sans}.total span{vertical-align:9px;margin-right:3px;font-size:24px}.change{color:var(--muted);margin-top:10px;font-size:11px}.change span{color:#327a59;background:#dfede3;border-radius:20px;align-items:center;margin-right:5px;padding:4px 8px;font-weight:700;display:inline-flex}.quick,.card,.transactions{background:var(--card);border-radius:20px;box-shadow:0 5px 22px #60695b0b}.quick{justify-content:space-around;padding:17px;display:flex}.quick div{text-align:center;flex-direction:column;gap:4px;display:flex}.quick small,.section-title small,.txmain small,.txamount small{color:var(--muted);font-size:10px}.quick strong{font:700 15px DM Sans}.quick i{background:#ecece7;width:1px}.card{margin-top:15px;padding:19px}.section-title{justify-content:space-between;align-items:center;display:flex}.section-title p{margin:0 0 3px;font-size:15px;font-weight:700}.section-title button{color:var(--green);background:0 0;border:0;align-items:center;font-size:10px;font-weight:700;display:flex}.chart{align-items:center;gap:18px;min-width:0;padding:20px 0 2px;display:flex}.donut{background:conic-gradient(#f06b51 0 38%,#e9ad55 38% 62%,#4d91a8 62% 80%,#716c91 80%);border-radius:50%;place-items:center;width:112px;height:112px;display:grid;position:relative}.donut:after{content:"";background:#fff;border-radius:50%;position:absolute;inset:15px}.donut div{z-index:1;text-align:center;flex-direction:column;display:flex}.donut strong{font:700 17px DM Sans}.donut small{color:var(--muted);font-size:9px}.legend{flex:1;gap:10px;min-width:0;display:grid}.legend div{grid-template-columns:8px 1fr auto;align-items:center;gap:7px;font-size:10px;display:grid}.legend span{border-radius:50%;width:7px;height:7px}.legend b{white-space:nowrap;font:600 10px DM Sans}.review{color:#9c583e;background:#fff0e5;border:1px solid #f4d5c0;border-radius:15px;align-items:center;gap:10px;margin:15px 0;padding:13px;display:flex}.review>span{background:#ffdcca;border-radius:10px;place-items:center;width:31px;height:31px;display:grid}.review div{flex-direction:column;flex:1;display:flex}.review strong{font-size:11px}.review small{margin-top:2px;font-size:9px}.transactions{padding:19px}.transactions article{border-bottom:1px solid #f0f0ec;align-items:center;padding:13px 0;display:flex}.transactions article:last-child{border:0}.txicon{border-radius:13px;place-items:center;width:40px;height:40px;margin-right:11px;display:grid}.coral{color:#d85842;background:#fde5df}.sand{color:#a9792e;background:#f8ecd5}.blue{color:#40788b;background:#deedf0}.purple{color:#6d6491;background:#e9e5f4}.txmain,.txamount{flex-direction:column;gap:4px;display:flex}.txmain{flex:1}.txmain strong,.txamount strong{font-size:12px}.txamount{text-align:right}.txamount strong{font-family:DM Sans}.notice{color:#96988f;justify-content:center;align-items:center;gap:7px;padding:19px 0;font-size:9px;display:flex}nav{width:min(440px,100vw);height:82px;padding-bottom:max(8px,env(safe-area-inset-bottom));z-index:3;background:#fff;border-top:1px solid #eaeae6;justify-content:space-around;align-items:center;margin-left:-20px;display:flex;position:fixed;bottom:0}nav a{color:#9a9c96;flex-direction:column;align-items:center;gap:3px;width:52px;font-size:9px;display:flex}nav svg{width:19px}.active{font-weight:700;color:var(--green)!important}nav button{background:var(--green);color:#fff;border:0;border-radius:18px;width:50px;height:50px;font-size:26px;box-shadow:0 7px 16px #254c3d44}@media (min-width:700px){body{padding:25px}.shell{border-radius:28px;min-height:calc(100vh - 50px);overflow:hidden}nav{border-radius:0 0 28px 28px;bottom:25px}}
.live{letter-spacing:.13em;color:#fff;background:#457761;border-radius:99px;padding:5px 9px;font-size:9px;font-weight:800}.legend.full{gap:10px;width:100%;display:grid}.legend.full>div{grid-template-columns:10px 1fr auto;align-items:center;gap:8px;display:grid}.legend.full span{border-radius:50%;width:8px;height:8px}.legend.full label,.legend.full b{font-size:11px}.empty{color:#898d86;margin:6px 0;font-size:11px;line-height:1.7}.importer{background:#fff;border:1px solid #ebece8;border-radius:18px;gap:13px;margin:12px 0;padding:16px;display:grid}.importer form{gap:9px;display:grid}.importer strong,.importer label{font-size:12px}.manual-row{grid-template-columns:1fr 1.4fr auto;gap:7px;display:grid}.manual-row input{min-width:0;font:inherit;border:1px solid #dedfd9;border-radius:10px;padding:10px;font-size:11px}.manual-row button{background:var(--green);color:#fff;border:0;border-radius:10px;padding:0 14px;font-weight:700}.importer label{justify-content:space-between;align-items:center;gap:10px;display:flex}.importer input[type=file]{max-width:190px;font-size:10px}.importer small{color:#6f756e;font-size:10px}nav a{text-decoration:none}.txicon{font-size:10px;font-weight:800}.login{background:#fff;border-radius:24px;width:min(400px,100% - 32px);margin:12vh auto;padding:28px;box-shadow:0 20px 60px #24372d22}.login h1{margin:32px 0 4px}.login p{color:var(--muted);font-size:13px}.login form{gap:10px;margin-top:28px;display:grid}.login input,.login button,.modal input,.modal select{font:inherit;border:1px solid #dfe2dc;border-radius:12px;padding:13px}.login button,.primary{border-radius:12px;padding:13px;font-weight:700;background:var(--green)!important;color:#fff!important;border:0!important}.login small{color:#b64f3c;margin-top:12px;display:block}.page-head{padding:18px 2px}.page-head h1,.settings h1{margin:0;font-size:24px}.page-head p{color:var(--muted);font-size:11px}.txrow{text-align:left;background:0 0;border:0;border-bottom:1px solid #f0f0ec;align-items:center;width:100%;padding:13px 0;display:flex}.settings{gap:16px;display:grid}.settings .primary{justify-content:center;align-items:center;gap:8px;display:flex}.setup{background:#fff;border-radius:18px;padding:18px}.setup h2{font-size:15px}.setup ol{padding-left:20px;font-size:12px;line-height:1.8}.setup p{color:var(--muted);font-size:11px;line-height:1.6}.setup code{word-break:break-all;font-size:10px}.status-message{color:var(--green);font-size:11px}.logout{color:#666;background:0 0;border:1px solid #d8dad5;border-radius:12px;padding:12px}nav button{color:#9a9c96;width:64px;box-shadow:none;background:0 0;border:0;flex-direction:column;align-items:center;gap:3px;height:auto;font-size:9px;display:flex}.modal{z-index:10;background:#17231d88;place-items:end center;padding:18px;display:grid;position:fixed;inset:0}.modal form{background:#fff;border-radius:24px;gap:13px;width:min(404px,100%);padding:24px;display:grid;position:relative}.modal h2{margin:0 0 6px}.modal label{color:var(--muted);gap:6px;font-size:11px;display:grid}.modal .close{background:#f0f1ed;border:0;border-radius:50%;place-items:center;width:34px;height:34px;display:grid;position:absolute;top:16px;right:16px}.modal .danger{color:#b64f3c;background:0 0;border:0;padding:8px}
.shell{background:linear-gradient(#f8f7f3 0,#f2f3ef 100%);padding-left:18px;padding-right:18px}header{height:72px}.brand>span:last-child{flex-direction:column;display:flex}.brand small{color:#999;letter-spacing:.12em;margin-top:1px;font:500 8px Noto Sans JP}.brandmark{background:linear-gradient(145deg,#183f31,#447660);box-shadow:0 6px 14px #254c3d35}.hero{padding:26px 0 28px}.hero .total{font-size:48px}.hero .change{color:#668074}.quick,.card,.transactions,.setting-card,.analysis-card{border:1px solid #e9ebe6;box-shadow:0 8px 30px #4352470b}.quick{border-radius:18px}.card,.transactions{border-radius:22px}.page-head{padding:19px 3px 12px}.page-head h1{letter-spacing:-.04em;font-size:25px}.page-head p{margin-bottom:0}.section-title button{cursor:pointer}.txrow{border-bottom:1px solid #eff0ec;align-items:center;transition:all .15s;display:flex}.txrow:last-child{border-bottom:0}.txrow.selected{background:#edf4ef;border-radius:12px;margin:0 -10px;padding:0 10px}.txcontent{text-align:left;cursor:pointer;background:0 0;border:0;align-items:center;width:100%;padding:13px 0;display:flex}.check{width:34px;color:var(--green);background:0 0;border:0;flex:0 0 34px;place-items:center;display:grid}.check span{border:1.5px solid #c9cdc7;border-radius:5px;width:18px;height:18px}.check svg{width:19px}.txicon{flex:0 0 40px}.txmain{min-width:0}.txmain strong{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.txamount{flex:none}.bulkbar{z-index:2;color:#fff;background:#244d3c;border-radius:16px;grid-template-columns:1fr 110px auto;align-items:center;gap:8px;margin:3px 0 12px;padding:10px 11px;display:grid;position:sticky;top:8px;box-shadow:0 10px 26px #244d3c35}.bulkbar strong{font-size:11px}.bulkbar select,.bulkbar button{font:inherit;border:0;border-radius:9px;padding:9px;font-size:10px}.bulkbar button{color:#33291c;background:#eab25f;font-weight:800}.analytics{gap:13px;display:grid}.month-picker{background:#fff;border:1px solid #e9ebe6;border-radius:16px;justify-content:space-between;align-items:center;padding:8px;display:flex}.month-picker button{width:38px;height:36px;color:var(--green);background:#f0f2ed;border:0;border-radius:10px;font-size:24px}.month-picker button:disabled{opacity:.3}.month-picker strong{align-items:center;gap:8px;font-size:13px;display:flex}.month-picker svg{width:16px}.analysis-card{background:#fff;border-radius:22px;padding:20px}.analysis-card>p{color:var(--muted);margin:0;font-size:10px}.analysis-card>h2{margin:5px 0;font:700 31px DM Sans}.analysis-card>small{color:var(--muted);font-size:10px}.analysis-card h3{margin:0 0 18px;font-size:14px}.bars{gap:13px;display:grid}.bars>div{grid-template-columns:55px 1fr 74px;align-items:center;gap:8px;font-size:9px;display:grid}.bars i{background:#eef0eb;border-radius:10px;height:8px;overflow:hidden}.bars b{background:linear-gradient(90deg,#315e49,#79a78f);border-radius:10px;height:100%;display:block}.bars strong{text-align:right;font:600 9px DM Sans}.settings{gap:13px}.setting-card{background:#fff;border-radius:20px;gap:11px;padding:19px;display:grid}.setting-card h2{margin:0;font-size:14px}.setting-card p{color:var(--muted);margin:0;font-size:10px;line-height:1.7}.setting-card code{word-break:break-all;background:#f4f5f1;border-radius:9px;padding:10px;font-size:9px}.upload{color:var(--green);cursor:pointer;background:#edf3ef;border:1px dashed #9bb2a5;border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:13px;font-size:11px;font-weight:700;display:flex}.upload svg{width:17px}.upload input{display:none}.primary:disabled{opacity:.65}.spin{animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}nav{padding-left:4px;padding-right:4px}nav button{width:58px}.notice{padding-bottom:15px}@media (min-width:700px){.shell{max-width:860px;padding-left:34px;padding-right:34px}.hero{padding:35px 0}.quick,.card,.transactions,.analytics,.settings{max-width:680px;margin-left:auto;margin-right:auto}nav{width:860px;margin-left:-34px}.transactions{padding-left:24px;padding-right:24px}}
