:root{color-scheme:light;--canvas:oklch(97.2% .006 168);--surface:oklch(99.2% .003 168);--surface-2:oklch(94.8% .012 168);--ink:oklch(21% .025 174);--muted:oklch(49% .02 174);--line:oklch(87% .014 174);--teal:oklch(40% .09 174);--teal-soft:oklch(91% .035 174);--amber:oklch(68% .14 73);--red:oklch(55% .17 28);--font:"Avenir Next","PingFang SC","Microsoft YaHei",system-ui,sans-serif}
*{box-sizing:border-box}html,body{margin:0;min-width:320px;min-height:100%;background:var(--canvas);color:var(--ink);font-family:var(--font)}body{font-size:14px;font-variant-numeric:tabular-nums}button,input,select{font:inherit}button{color:inherit}.auth-pending .shell{visibility:hidden}.shell{min-height:100vh;display:grid;grid-template-columns:230px minmax(0,1fr)}
.rail{display:flex;flex-direction:column;padding:28px 18px 22px;color:oklch(94% .01 168);background:oklch(20% .035 174)}.brand{height:44px;padding:0 10px;display:flex;gap:11px;align-items:center;color:inherit;text-decoration:none;font-size:18px}.mark{width:23px;height:23px;position:relative;border:1px solid oklch(78% .07 174);transform:rotate(45deg)}.mark:after{content:"";position:absolute;inset:5px;background:oklch(72% .12 174)}.rail-scope{margin:24px 10px 18px;color:oklch(64% .02 174);font-size:11px}.rail nav{display:grid;gap:3px}.rail nav button{min-height:43px;padding:0 12px;display:flex;align-items:center;gap:12px;color:oklch(76% .015 174);background:none;border:0;border-radius:4px;text-align:left;cursor:pointer}.rail nav button.active{color:oklch(98% .005 174);background:oklch(29% .045 174)}.rail nav button.active:before{content:"";width:3px;height:18px;margin-left:-12px;margin-right:-3px;background:oklch(72% .12 174)}.nav-icon{width:18px;text-align:center}.rail-foot{margin-top:auto;padding:18px 10px 2px;border-top:1px solid oklch(31% .025 174)}.rail-foot b,.rail-foot small{display:block}.rail-foot b{font-size:12px}.rail-foot small{margin-top:4px;color:oklch(60% .02 174);font-size:10px}
.workspace{min-width:0}.topbar{height:74px;padding:0 42px;display:flex;justify-content:space-between;align-items:center;background:var(--surface);border-bottom:1px solid var(--line)}.workspace-name{display:flex;align-items:center;gap:12px}.workspace-name>span{width:34px;height:34px;display:grid;place-items:center;color:var(--teal);background:var(--teal-soft);border-radius:50%;font-weight:700}.workspace-name b,.workspace-name small{display:block}.workspace-name b{font-size:13px}.workspace-name small{margin-top:2px;color:var(--muted);font-size:10px}.top-actions{display:flex;gap:22px;align-items:center}.top-actions button,.section-head button{padding:0;color:var(--teal);background:none;border:0;cursor:pointer;font-size:11px}.service-state{font-size:11px}.service-state:before{content:"";display:inline-block;width:7px;height:7px;margin-right:8px;border-radius:50%;background:var(--teal)}
main{padding:38px 42px 56px}.view{display:none}.view.active{display:block;animation:reveal .32s cubic-bezier(.16,1,.3,1)}@keyframes reveal{from{opacity:0;transform:translateY(8px)}}.page-head{margin-bottom:32px;display:flex;justify-content:space-between;align-items:end;gap:32px}.page-head h1{margin:0;font-size:28px;letter-spacing:-.035em}.page-head p{margin:8px 0 0;color:var(--muted);font-size:12px}.head-actions{display:flex;gap:10px;align-items:center}.period,.primary,.secondary{min-height:40px;padding:0 14px;border-radius:5px}.period,.secondary{background:var(--surface);border:1px solid var(--line)}.primary{color:oklch(98% .004 174);background:var(--teal);border:1px solid var(--teal);font-weight:650;cursor:pointer}.primary:hover{background:oklch(34% .09 174)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--amber);outline-offset:2px}
.ledger{display:grid;grid-template-columns:minmax(0,1.25fr) 230px 230px;background:var(--surface);border:1px solid var(--line);border-radius:5px;overflow:hidden}.ledger>div{min-height:142px;padding:24px 26px;border-right:1px solid var(--line)}.ledger>div:last-child{border:0}.ledger span{color:var(--muted);font-size:11px}.ledger strong{display:block;margin-top:24px;font-size:25px;letter-spacing:-.03em}.ledger small{display:block;margin-top:9px;color:var(--muted);font-size:10px}.ledger .spend p{display:flex;align-items:baseline;gap:9px;margin:12px 0 0}.ledger .spend strong{display:inline;margin:0;font-size:31px}.ledger em{color:var(--muted);font-style:normal}.meter{height:7px;margin-top:20px;overflow:hidden;background:var(--surface-2);border-radius:10px}.meter i{display:block;width:0;height:100%;background:var(--teal);transition:width .5s cubic-bezier(.16,1,.3,1)}
.overview-grid{margin-top:30px;display:grid;grid-template-columns:minmax(0,1.55fr) minmax(310px,.72fr);gap:30px}.overview-grid.lower{margin-top:34px}.section-head{min-height:41px;display:flex;justify-content:space-between;align-items:start;border-bottom:1px solid var(--ink)}.section-head h2{margin:0;font-size:16px}.table-wrap{overflow:auto}.table-wrap.full{border-top:1px solid var(--ink)}table{width:100%;border-collapse:collapse;min-width:650px}th{padding:13px 10px 11px 0;color:var(--muted);border-bottom:1px solid var(--line);text-align:left;font-size:10px;font-weight:500}td{padding:17px 10px 17px 0;border-bottom:1px solid var(--line);font-size:11px}.key-name b,.key-name small{display:block}.key-name small{margin-top:3px;color:var(--muted);font-size:9px}.tag{display:inline-flex;padding:4px 7px;color:var(--muted);background:var(--surface-2);border-radius:3px;font-size:9px}.tag.active{color:var(--teal);background:var(--teal-soft)}.row-actions{display:flex;gap:10px}.row-actions button{padding:0;color:var(--teal);background:none;border:0;font-size:10px;cursor:pointer}.row-actions button.danger{color:var(--red)}
.project-list{display:grid}.project{padding:17px 0;border-bottom:1px solid var(--line)}.project-head{display:flex;justify-content:space-between;gap:18px}.project b,.project small{display:block}.project b{font-size:11px}.project small{margin-top:5px;color:var(--muted);font-size:9px}.project strong{font-size:11px}.project .meter{height:4px;margin-top:12px}.project.warn .meter i{background:var(--amber)}.invoice-row{min-height:68px;display:grid;grid-template-columns:1fr 130px 90px;gap:18px;align-items:center;border-bottom:1px solid var(--line);font-size:11px}.invoice-row b,.invoice-row small{display:block}.invoice-row small{margin-top:4px;color:var(--muted);font-size:9px}.audit-list>div{display:grid;grid-template-columns:10px 1fr auto;gap:10px;padding:14px 0;border-bottom:1px solid var(--line)}.audit-list i{width:7px;height:7px;margin-top:4px;border-radius:50%;background:var(--teal)}.audit-list b,.audit-list small{display:block;font-size:10px}.audit-list small,.audit-list time{margin-top:4px;color:var(--muted);font-size:9px}.empty{padding:34px 0;color:var(--muted);font-size:11px}.project-ledger{border-top:1px solid var(--ink)}.project-ledger .project{padding:24px 0}.billing-summary{padding:24px 0 34px;border-top:1px solid var(--ink)}.billing-summary span,.billing-summary small{display:block;color:var(--muted);font-size:10px}.billing-summary strong{display:block;margin:12px 0 7px;font-size:34px}.audit-timeline{margin:0;padding:0;list-style:none;border-top:1px solid var(--ink)}.audit-timeline li{padding:18px 0;display:grid;grid-template-columns:150px 1fr auto;gap:24px;border-bottom:1px solid var(--line);font-size:11px}.audit-timeline time,.audit-timeline small{color:var(--muted)}
.login{position:fixed;inset:0;z-index:20;padding:6vw;display:grid;grid-template-columns:.6fr 1fr;gap:10vw;align-items:center;background:var(--canvas)}.login[hidden]{display:none}.login-brand{align-self:start;display:flex;align-items:center;gap:12px;font-size:21px}.login-brand small{display:block;color:var(--muted);font-size:10px;font-weight:400}.login form{max-width:560px;padding:48px 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}.login form>p{margin:0 0 22px;color:var(--teal);font-size:11px}.login h1{margin:0 0 32px;font-size:38px}.login label,dialog label{display:grid;gap:8px;font-size:11px}.login input,dialog input,dialog select{min-height:44px;padding:0 12px;background:var(--surface);border:1px solid var(--line);border-radius:3px}.form-help{display:block;margin:8px 0 20px;color:var(--muted);font-size:10px}.form-error{color:var(--red);font-size:10px}.login .primary{width:100%}
dialog{width:min(570px,calc(100vw - 32px));padding:0;background:var(--canvas);border:1px solid var(--ink);border-radius:6px;box-shadow:0 20px 80px color-mix(in oklch,var(--ink) 22%,transparent)}dialog::backdrop{background:color-mix(in oklch,var(--ink) 56%,transparent)}dialog form,dialog>div{padding:30px;display:grid;gap:20px}dialog header{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:18px}dialog header span{color:var(--teal);font-size:10px}dialog h2{margin:5px 0 0;font-size:24px}dialog header button{width:34px;height:34px;background:none;border:1px solid var(--line);font-size:22px;cursor:pointer}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}fieldset{display:flex;gap:16px;border:0;padding:0;margin:0}fieldset legend{margin-bottom:8px;color:var(--muted);font-size:10px}fieldset label{display:flex;align-items:center;gap:7px}fieldset input{min-height:auto}dialog footer{display:flex;justify-content:flex-end;gap:10px;padding-top:18px;border-top:1px solid var(--line)}.secret-dialog code{padding:16px;overflow-wrap:anywhere;color:var(--teal);background:var(--surface-2);border:1px solid var(--line)}.secret-dialog p{margin:0;color:var(--muted);line-height:1.7}.toast{position:fixed;left:50%;bottom:24px;z-index:50;padding:12px 18px;color:var(--surface);background:var(--ink);border-bottom:3px solid var(--teal);opacity:0;transform:translate(-50%,12px);transition:.2s;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:1050px){.shell{grid-template-columns:78px minmax(0,1fr)}.brand b,.rail-scope,.rail nav button:not(.active){font-size:0}.rail nav button{justify-content:center;padding:0}.nav-icon{font-size:16px}.rail-foot{display:none}.ledger{grid-template-columns:1fr 1fr}.ledger .spend{grid-column:1/-1}.overview-grid{grid-template-columns:1fr}.topbar,main{padding-left:28px;padding-right:28px}}
@media(max-width:680px){.shell{display:block}.rail{position:fixed;left:0;right:0;bottom:0;z-index:10;height:68px;padding:6px 10px;display:block}.brand,.rail-scope,.rail-foot{display:none}.rail nav{display:grid;grid-template-columns:repeat(5,1fr)}.rail nav button,.rail nav button:not(.active){min-height:54px;display:grid;place-items:center;gap:0;font-size:8px}.rail nav button.active:before{display:none}.topbar{height:64px;padding:0 18px}.service-state{display:none}main{padding:26px 18px 94px}.page-head{align-items:start}.page-head h1{font-size:24px}.ledger{grid-template-columns:1fr}.ledger .spend{grid-column:auto}.ledger>div{min-height:120px;border-right:0;border-bottom:1px solid var(--line)}.overview-grid{gap:24px}.login{padding:24px 18px;grid-template-columns:1fr;align-content:start}.login-brand{margin-top:12px}.login form{padding:34px 0}.field-row{grid-template-columns:1fr}}
.nav-icon{height:18px;display:grid;place-items:center}.nav-icon svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}dialog header button{width:auto;min-width:52px;padding:0 10px;font-size:10px}
@media(max-width:1050px){.rail nav button{font-size:0}}@media(max-width:680px){.rail nav button,.rail nav button:not(.active){font-size:8px}}
