@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}
