:root{--bg:oklch(.975 .004 250);--canvas:oklch(1 0 0);--surface:oklch(.955 .008 250);--surface-strong:oklch(.91 .014 250);--ink:oklch(.2 .025 255);--muted:oklch(.53 .025 255);--primary:oklch(.42 .14 245);--primary-hover:oklch(.35 .14 245);--accent:oklch(.69 .13 190);--line:oklch(.89 .012 250);--danger:oklch(.56 .2 25);--warning:oklch(.68 .15 75);--success:oklch(.54 .13 155);--sidebar:oklch(.15 .022 255);--sidebar-ink:oklch(.96 .005 250);--shadow:0 12px 34px oklch(.2 .025 255/.07)}
body[data-theme=jade]{--bg:oklch(.97 .009 175);--surface:oklch(.94 .018 175);--surface-strong:oklch(.88 .035 175);--ink:oklch(.19 .035 190);--muted:oklch(.49 .03 190);--primary:oklch(.39 .095 180);--primary-hover:oklch(.32 .09 180);--accent:oklch(.74 .13 95);--line:oklch(.87 .025 175);--sidebar:oklch(.18 .04 185)}
body[data-theme=nocturne]{--bg:oklch(.11 .018 255);--canvas:oklch(.15 .022 255);--surface:oklch(.19 .026 255);--surface-strong:oklch(.24 .03 255);--ink:oklch(.96 .006 255);--muted:oklch(.69 .025 255);--primary:oklch(.68 .12 235);--primary-hover:oklch(.74 .11 235);--accent:oklch(.72 .13 75);--line:oklch(.29 .027 255);--sidebar:oklch(.075 .012 255);--shadow:0 18px 45px #0006}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;background:var(--bg);color:var(--ink);font-family:Commissioner,'Noto Sans SC',sans-serif;font-weight:300;-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit}button{cursor:pointer}.hidden{display:none!important}.kicker{margin:0;color:var(--muted);font:500 10px/1.5 'IBM Plex Mono';letter-spacing:.15em}.logo-tile{width:48px;height:48px;display:grid;place-items:center;background:var(--ink);color:var(--canvas);border-radius:11px;font:600 14px 'IBM Plex Mono';letter-spacing:-.06em}.logo-tile.small{width:38px;height:38px;border-radius:9px;background:white;color:var(--sidebar)}.logo-mobile{display:none}.login-shell{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(430px,.92fr);background:var(--canvas)}.login-brand{background:var(--sidebar);color:white;padding:44px 5.5vw;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}.login-brand:after{content:'0.1.3';position:absolute;right:-.03em;bottom:-.22em;color:#ffffff08;font:600 min(30vw,430px)/1 'IBM Plex Mono';letter-spacing:-.12em}.login-top{display:flex;align-items:center;gap:14px;font:500 11px 'IBM Plex Mono';letter-spacing:.1em}.login-top .logo-tile{background:white;color:var(--sidebar)}.login-statement{position:relative;z-index:1;max-width:680px}.login-statement .kicker{color:#ffffff70}.login-statement h1{margin:18px 0 24px;font-size:clamp(48px,5.4vw,82px);font-weight:400;line-height:1.08;letter-spacing:-.055em}.login-statement>p:last-child{max-width:540px;color:#ffffff9c;font-size:15px;line-height:1.9}.login-status{position:relative;z-index:1;display:flex;gap:28px;flex-wrap:wrap;color:#ffffff86;font:400 10px 'IBM Plex Mono'}.login-status span{display:flex;align-items:center;gap:7px}.login-entry{display:grid;place-items:center;padding:45px}.login-card{width:min(390px,100%);display:grid;gap:23px}.login-card h2{margin:8px 0;font-size:30px;font-weight:500;letter-spacing:-.04em}.login-card p{margin:0;color:var(--muted)}.login-card label,.field label{display:grid;gap:8px;font-size:12px;color:var(--muted)}input,select,textarea,.table-input{width:100%;min-height:42px;border:1px solid var(--line);background:var(--canvas);color:var(--ink);padding:0 13px;border-radius:8px;outline:none;transition:border-color .18s,box-shadow .18s}textarea{min-height:96px;padding:11px 13px;line-height:1.55;resize:vertical}input:focus,select:focus,textarea:focus,.table-input:focus{border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in oklch,var(--primary) 13%,transparent)}input:disabled,select:disabled,textarea:disabled{background:var(--surface);color:var(--muted);cursor:not-allowed}.btn{min-height:36px;border:1px solid var(--line);background:var(--canvas);color:var(--ink);padding:0 12px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;gap:7px;font-weight:400;white-space:nowrap;transition:.18s}.btn:hover{border-color:color-mix(in oklch,var(--primary) 55%,var(--line));background:var(--surface)}.btn.primary{background:var(--primary);border-color:var(--primary);color:white}.btn.primary:hover{background:var(--primary-hover)}.btn.danger{color:var(--danger)}.btn.warning{color:var(--warning)}.btn.small{min-height:28px;padding:0 9px;font-size:11px}.btn.large{height:42px;min-height:42px;justify-content:space-between;padding:0 14px}.login-card small{color:var(--muted);line-height:1.7}.app-shell{min-height:100vh;display:grid;grid-template-columns:226px minmax(0,1fr)}.sidebar{height:100vh;position:sticky;top:0;background:var(--sidebar);color:var(--sidebar-ink);padding:22px 14px;display:flex;flex-direction:column;z-index:30}.product-lockup{display:flex;align-items:center;gap:12px;padding:2px 8px 28px}.product-lockup strong,.product-lockup span{display:block}.product-lockup strong{font-size:17px;font-weight:500}.product-lockup span{margin-top:3px;color:#ffffff66;font:500 8px 'IBM Plex Mono';letter-spacing:.13em}.sidebar nav{display:grid;gap:3px}.sidebar nav>p{margin:20px 11px 7px;color:#ffffff45;font:500 8px 'IBM Plex Mono';letter-spacing:.13em}.sidebar nav button,.nav-logout{width:100%;border:0;background:transparent;color:#ffffff9c;display:flex;align-items:center;gap:11px;padding:10px 11px;border-radius:8px;text-align:left;font-size:12px}.sidebar nav button i{font-size:17px}.sidebar nav button:hover,.sidebar nav button.active{background:#ffffff0d;color:white}.sidebar nav button.active{box-shadow:inset 2px 0 var(--accent)}.nav-badge{margin-left:auto;background:var(--danger);color:white;border-radius:10px;padding:2px 6px;font:500 9px 'IBM Plex Mono'}.sidebar-bottom{margin-top:auto}.theme-row{border-top:1px solid #ffffff14;padding:17px 10px 12px;display:flex;gap:9px}.theme-row button{width:16px;height:16px;border-radius:50%;border:2px solid var(--sidebar);outline:1px solid #ffffff40}.theme-row button:nth-child(1){background:#3676dd}.theme-row button:nth-child(2){background:#317d73}.theme-row button:nth-child(3){background:#7489b3}.main-shell{min-width:0}.topbar{height:82px;background:color-mix(in oklch,var(--canvas) 92%,transparent);backdrop-filter:blur(16px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 28px;position:sticky;top:0;z-index:20}.page-context h1{font-size:20px;font-weight:500;letter-spacing:-.025em;margin:4px 0 0}.top-actions,.user-menu{display:flex;align-items:center;gap:15px}.sync-state{color:var(--muted);font-size:10px}.user-menu>span{width:36px;height:36px;display:grid;place-items:center;border-radius:10px;background:var(--surface-strong);font-weight:600}.user-menu strong,.user-menu small{display:block}.user-menu strong{font-size:11px;font-weight:500}.user-menu small{margin-top:2px;color:var(--muted);font:500 8px 'IBM Plex Mono';letter-spacing:.08em}.content{max-width:1480px;margin:auto;padding:28px 30px 60px}.page-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:19px}.page-actions .group{display:flex;gap:8px;flex-wrap:wrap}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:22px}.metric{background:var(--canvas);border:1px solid var(--line);border-radius:12px;padding:20px;box-shadow:0 1px 1px oklch(.2 .02 255/.02)}.metric>span{color:var(--muted);font-size:11px}.metric strong{display:block;margin-top:15px;font:500 clamp(21px,2vw,29px) 'IBM Plex Mono';letter-spacing:-.05em}.metric small{display:block;margin-top:8px;color:var(--muted)}.metric.alert{border-color:color-mix(in oklch,var(--danger) 30%,var(--line))}.panel{background:var(--canvas);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);overflow:hidden}.panel-head{min-height:58px;padding:15px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px}.panel-head h2{margin:0;font-size:14px;font-weight:500}.data-table{width:100%;border-collapse:collapse}.data-table th{padding:10px 13px;background:var(--surface);border-bottom:1px solid var(--line);color:var(--muted);text-align:left;font:500 9px 'IBM Plex Mono';letter-spacing:.07em}.data-table td{padding:12px 13px;border-bottom:1px solid var(--line);font-size:11px;vertical-align:middle}.data-table tr:last-child td{border-bottom:0}.data-table tbody tr:hover{background:color-mix(in oklch,var(--surface) 55%,transparent)}.mono{font-family:'IBM Plex Mono'}.amount{text-align:right!important;font-family:'IBM Plex Mono'}.status{display:inline-flex;padding:4px 7px;border-radius:6px;background:var(--surface-strong);font-size:9px}.status.processing{color:var(--primary)}.status.awaiting{color:var(--warning)}.status.settled{color:var(--success)}.danger-text{color:var(--danger)!important}.empty{padding:64px 20px;text-align:center;color:var(--muted)}.empty i{display:block;font-size:30px;margin-bottom:10px}.filters{display:grid;grid-template-columns:minmax(260px,1fr) 128px 68px;align-items:center;gap:8px}.search-wrap{position:relative}.search-wrap i{position:absolute;left:12px;top:50%;color:var(--muted);line-height:1;transform:translateY(-50%);pointer-events:none}.search-wrap input{padding-left:38px}.icon-btn{width:34px;height:34px;border:1px solid var(--line);border-radius:8px;background:var(--canvas);color:var(--ink);display:grid;place-items:center}.table-actions{display:flex;gap:5px}.editor-layout{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:16px;align-items:start}.form-stack{display:grid;gap:13px}.section-card{background:var(--canvas);border:1px solid var(--line);border-radius:12px;overflow:hidden}.section-title{padding:15px 17px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:10px}.section-title h2{margin:0;font-size:13px;font-weight:500}.section-title>span{color:var(--muted);font:500 8px 'IBM Plex Mono';letter-spacing:.1em}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;padding:17px}.field.wide{grid-column:1/-1}.field small{display:block;margin-top:3px;color:var(--muted);font:400 10px/1.55 'IBM Plex Mono'}.section-card .field label{color:color-mix(in oklch,var(--ink) 70%,var(--muted));font-weight:400}.section-card .data-table th{color:color-mix(in oklch,var(--ink) 58%,var(--muted))}.field textarea{min-height:82px;resize:vertical}.line-items{padding:12px 17px 17px;overflow:auto}.line-items table{min-width:700px}.line-items .data-table{border:1px solid var(--line);border-radius:9px;border-collapse:separate;border-spacing:0;overflow:hidden}.line-items .data-table th{padding:12px 14px}.line-items .data-table td{padding:10px 8px}.line-items .table-input{min-height:38px;font-size:10px;padding:0 11px;border-radius:6px}.summary-card{position:sticky;top:105px;background:var(--sidebar);color:white;border-radius:12px;padding:18px}.summary-card .kicker{color:#ffffff66}.summary-card h2{margin:6px 0 18px;font-size:22px;font-weight:500}.summary-list{display:grid;gap:10px}.summary-list div{display:flex;justify-content:space-between;gap:10px;padding-bottom:9px;border-bottom:1px solid #ffffff14}.summary-list span{color:#ffffff80;font-size:10px}.summary-list strong{font:500 10px 'IBM Plex Mono'}.summary-total{margin-top:17px;padding-top:15px;border-top:1px solid #ffffff50}.summary-total span{font-size:10px;color:#ffffff8c}.summary-total strong{display:block;margin-top:8px;font:500 21px 'IBM Plex Mono'}.summary-actions{display:grid;gap:8px;margin-top:18px}.summary-actions .btn{background:#ffffff0b;border-color:#ffffff25;color:white}.summary-actions .btn.primary{background:white;border-color:white;color:var(--sidebar)}.admin-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:16px}.form-panel{padding:19px}.form-panel h2{margin:0 0 17px;font-size:15px;font-weight:500}.form-panel form{display:grid;gap:12px}.tabs{display:flex;gap:4px;padding:5px;background:var(--surface);border-radius:10px;width:max-content;margin-bottom:15px}.tabs button{border:0;background:transparent;color:var(--muted);padding:7px 12px;border-radius:7px;font-size:11px}.tabs button.active{background:var(--canvas);color:var(--ink);box-shadow:0 1px 4px #0000000d}.request-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;padding:17px;border-bottom:1px solid var(--line)}.request-card:last-child{border:0}.request-card h3{font-size:13px;margin:0 0 6px}.request-card p{font-size:11px;color:var(--muted);margin:4px 0}.request-actions{display:flex;align-items:center;gap:7px}.permission-toggle{display:inline-flex;align-items:center;gap:7px}.permission-toggle input{width:auto}.readonly-note{padding:11px 14px;border:1px solid color-mix(in oklch,var(--primary) 25%,var(--line));background:color-mix(in oklch,var(--primary) 6%,var(--canvas));border-radius:9px;color:var(--primary);font-size:11px;margin-bottom:14px}.modal{position:fixed;inset:0;z-index:100}.modal-backdrop{position:absolute;inset:0;background:oklch(.1 .02 255/.72);backdrop-filter:blur(5px)}.modal-panel{position:absolute;right:0;top:0;width:min(610px,100%);height:100%;overflow:auto;background:var(--canvas);padding:24px;box-shadow:-20px 0 60px #0004}.modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}.modal-head h2{margin:5px 0 0;font-size:21px;font-weight:500}.audit-list{display:grid}.audit-item{display:grid;grid-template-columns:95px 1fr auto;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line);font-size:10px}.toast{position:fixed;right:22px;top:18px;z-index:200;background:var(--ink);color:var(--canvas);padding:10px 14px;border-radius:8px;box-shadow:var(--shadow);font-size:11px;opacity:0;transform:translateY(-8px);pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:none}.toast.error{background:var(--danger);color:white}.mobile-only{display:none}.ri-spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:1120px){.editor-layout{grid-template-columns:minmax(0,1fr) 250px}.metric-grid{grid-template-columns:repeat(2,1fr)}.admin-grid{grid-template-columns:1fr}}
@media(max-width:760px){.login-shell{display:block}.login-brand{min-height:42vh;padding:28px 25px}.login-top{margin-bottom:65px}.login-statement h1{font-size:43px}.login-status{display:none}.login-entry{padding:38px 24px}.app-shell{display:block}.sidebar{position:fixed;width:226px;left:-240px;transition:left .22s;box-shadow:20px 0 60px #0005}.sidebar.open{left:0}.mobile-only{display:grid}.topbar{height:70px;padding:0 14px;justify-content:flex-start;gap:12px}.top-actions{margin-left:auto}.sync-state,.user-menu div{display:none}.content{padding:18px 14px 45px}.page-actions{align-items:flex-start}.metric-grid{grid-template-columns:1fr 1fr;gap:8px}.metric{padding:15px}.metric strong{font-size:18px}.filters{grid-template-columns:1fr;align-items:stretch}.filters .btn{justify-self:start;min-width:68px}.panel{overflow:auto}.data-table{min-width:720px}.editor-layout{display:block}.summary-card{position:static;margin-top:13px}.form-grid{grid-template-columns:1fr}.admin-grid{display:block}.form-panel{margin-top:14px}.request-card{grid-template-columns:1fr}.request-actions{justify-content:flex-start}.audit-item{grid-template-columns:75px 1fr}.audit-item time{display:none}.login-brand:after{font-size:55vw}.topbar h1{font-size:17px}.logo-mobile{display:none}}
@media(max-width:420px){.metric-grid{grid-template-columns:1fr}.login-statement h1{font-size:37px}.page-actions{display:grid}.page-actions>.group,.page-actions>.btn{width:100%}.page-actions .group .btn{flex:1}}
@media print{.sidebar,.topbar,.page-actions,.summary-actions{display:none!important}.app-shell{display:block}.content{padding:0}.editor-layout{display:block}.summary-card{background:white;color:black;border:1px solid #aaa;position:static;margin-top:12px}.summary-list span,.summary-card .kicker{color:#555}.section-card{break-inside:avoid}}



.role-guide{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:16px}.role-guide>div{display:flex;gap:11px;padding:15px;background:var(--canvas);border:1px solid var(--line);border-radius:11px}.role-guide i{font-size:19px;color:var(--primary)}.role-guide span,.role-guide strong,.role-guide small{display:block}.role-guide strong{font-size:12px;font-weight:500;margin-bottom:5px}.role-guide small,.role-help{color:var(--muted);font-size:10px;line-height:1.65}.role-help{margin-top:1px}@media(max-width:900px){.role-guide{grid-template-columns:1fr}}
.auto-link-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 17px;border-top:1px solid var(--line);background:var(--surface)}.auto-link-bar label{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:11px}.auto-link-bar input{width:auto}.computed-cell{background:var(--surface)!important;color:var(--muted)}.line-footer{padding:11px 17px;border-top:1px solid var(--line);background:var(--surface);color:var(--muted);font:500 9px/1.6 'IBM Plex Mono'}.payment-summary{display:flex;gap:22px;flex-wrap:wrap;padding:11px 17px;background:var(--surface);border-bottom:1px solid var(--line);font-size:10px;color:var(--muted)}.payment-summary strong{color:var(--ink);font-family:'IBM Plex Mono'}.settlement-result-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.settlement-result-grid>div{padding:17px;border-radius:11px;background:var(--canvas);border:1px solid var(--line)}.settlement-result-grid span{display:block;color:var(--muted);font-size:10px;line-height:1.55}.settlement-result-grid strong{display:block;margin-top:11px;font:500 18px 'IBM Plex Mono'}@media(max-width:760px){.line-items{padding:10px 12px 14px}.auto-link-bar{align-items:flex-start;flex-direction:column}.settlement-result-grid{grid-template-columns:1fr}.payment-summary{display:grid;gap:7px}}
.panel-heading{display:grid;gap:4px}.panel-heading h2{margin:0;font-size:14px;font-weight:500}.panel-heading small{color:var(--muted);font-size:10px}.table-scroll{width:100%;overflow:auto}.picker-note{margin:0 0 16px;color:var(--muted);font-size:12px;line-height:1.7}.column-picker-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.column-option{min-height:58px;padding:10px 11px;border:1px solid var(--line);border-radius:9px;background:var(--surface);display:flex;align-items:center;gap:10px;cursor:pointer;transition:border-color .18s,background .18s}.column-option:hover{border-color:color-mix(in oklch,var(--primary) 45%,var(--line));background:color-mix(in oklch,var(--primary) 4%,var(--surface))}.column-option input{width:auto;min-height:auto;accent-color:var(--primary)}.column-option span{display:grid;gap:3px}.column-option strong{font-size:12px;font-weight:500}.column-option small{color:var(--muted);font:400 9px/1.45 'IBM Plex Mono'}.modal-actions{position:sticky;bottom:0;z-index:2;display:flex;justify-content:flex-end;gap:8px;margin-top:20px;padding:16px 0 2px;border-top:1px solid var(--line);background:var(--canvas);box-shadow:0 -12px 22px color-mix(in oklch,var(--canvas) 92%,transparent)}@media(max-width:760px){.column-picker-grid{grid-template-columns:1fr}.modal-actions{display:grid}.modal-actions .btn{width:100%}}
:where(button,a,input,select,textarea):focus-visible{outline:2px solid var(--primary);outline-offset:2px}
@media(max-width:820px){input,select,.table-input{min-height:44px}.btn{min-height:44px}.btn.small{min-height:44px}.icon-btn{width:44px;height:44px}.theme-row button{width:44px;height:44px;border-width:13px}.sidebar nav button,.nav-logout{min-height:44px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}


@media(max-width:900px){.page-actions{display:grid;grid-template-columns:minmax(0,1fr);align-items:stretch}.page-actions>.group{justify-content:flex-start}}
@media(max-width:820px){.tabs button{min-height:44px}}