:root{--bg:#f7f8f4;--surface:#fff;--ink:#28332a;--muted:#79816f;--line:#e8ebe4;--yellow:#e5f47c;--yellow-deep:#c5dc4c;--green:#648252;--soft:#f1f5e8;--radius:15px;--sans:'DM Sans','PingFang SC','Microsoft YaHei',sans-serif;--display:'Manrope','PingFang SC',sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.6 var(--sans);-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit}button:disabled{cursor:wait;opacity:.5}a{color:inherit;text-decoration:none}input,select,textarea{min-width:0}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #a9bf47;outline-offset:3px}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:var(--display)}h1{font-size:27px;letter-spacing:-1px;line-height:1.4;font-weight:700}h2{font-size:16px;font-weight:700}h3{font-size:15px}.icon{width:20px;height:20px;flex-shrink:0;vertical-align:middle}.brand{display:flex;align-items:center;gap:10px;font-size:20px;font-weight:800;letter-spacing:-.8px;line-height:1.2;white-space:nowrap}.brand-icon{display:grid;place-items:center;flex-shrink:0;width:40px;height:43px;border-radius:13px;background:var(--yellow);transform:rotate(-5deg)}.brand-icon .icon{width:26px;height:26px;fill:var(--ink);stroke-width:.6;transform:rotate(5deg)}.brand-sub{display:block;font-size:10px;letter-spacing:2px;margin-top:5px;font-weight:500}.sidebar{width:230px;background:#fff;position:fixed;inset:0 auto 0 0;border-right:1px solid var(--line);padding:29px 19px 20px;z-index:20;display:flex;flex-direction:column}.sidebar .brand{padding-left:13px}.workspace-label{display:flex;align-items:center;justify-content:space-between;border:1px solid var(--line);border-radius:10px;margin:32px 4px 24px;padding:10px 11px;color:#636d60;font-size:12px}.workspace-label span{display:flex;gap:8px;align-items:center}.workspace-label .icon{width:16px;height:16px}.nav-title{font-size:10px;color:#a0a69b;letter-spacing:1.8px;padding:0 16px;margin:10px 0}.nav-item{height:45px;display:flex;align-items:center;gap:12px;padding:0 15px;color:#798171;border-radius:9px;margin:4px 0;font-size:13px}.nav-item .icon{width:18px;height:18px}.nav-item:hover{background:#f5f7ef;color:var(--ink)}.nav-item.active{background:#f0f6cf;color:#414e28;font-weight:600}.nav-item.active:after{content:'';margin-left:auto;width:5px;height:5px;background:#758d2c;border-radius:50%}.nav-spacer{height:20px}.side-bottom{margin-top:auto;padding-top:24px}.help-card{background:#f8f9f2;border:1px solid #eef0e6;border-radius:12px;padding:15px;margin:0 3px 17px}.help-card h3{font-size:12px;margin:8px 0 3px}.help-card p{font-size:11px;color:var(--muted);margin-bottom:9px}.help-card a{font-size:11px;font-weight:600;display:flex;align-items:center;gap:5px}.help-card .icon{width:16px;height:16px}.side-user{display:flex;gap:10px;align-items:center;padding:9px 10px;border-top:1px solid var(--line)}.avatar{display:grid;place-items:center;width:33px;height:33px;border-radius:50%;background:#eef2df;color:#7e885b;font-size:12px;font-weight:600;flex-shrink:0}.avatar.admin-avatar{background:#e5ece7;color:#456757}.user-name{font-size:12px;font-weight:600}.user-email{font-size:10px;color:var(--muted)}.shell{margin-left:230px}.topbar{height:76px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.8);display:flex;align-items:center;justify-content:space-between;padding:0 37px;gap:15px}.breadcrumbs{font-size:12px;color:#a0a69b;display:flex;align-items:center;gap:11px}.breadcrumbs .icon{width:12px;height:12px}.breadcrumbs strong{font-weight:500;color:#596451}.top-actions{display:flex;align-items:center;gap:21px}.top-actions>a{font-size:12px;color:#7d8676}.demo-indicator{display:inline-flex;align-items:center;gap:7px;color:#8e995e;font-size:11px;background:#f1f5df;border:1px solid #e7edcd;padding:4px 9px;border-radius:6px;white-space:nowrap}.demo-indicator i,.dot{display:inline-block;width:5px;height:5px;background:#a1b84a;border-radius:50%}.icon-button{border:0;background:none;display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:7px;color:#87907d}.icon-button:hover{background:#eff2e7;color:var(--ink)}.icon-button .icon{width:18px;height:18px}.notification{position:relative}.notification:after{content:'';position:absolute;width:5px;height:5px;border-radius:50%;background:#a8bc53;top:6px;right:8px;border:1px solid white}.main{max-width:1530px;margin:auto;padding:31px 37px 20px}.page-head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:25px}.page-head p{color:var(--muted);font-size:12px;margin-top:6px}.eyebrow{font-size:10px;letter-spacing:2px;color:#95a078;font-weight:600;margin-bottom:7px}.head-actions{display:flex;align-items:center;gap:10px}.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:8px;padding:10px 16px;line-height:1.4;font-size:12px;font-weight:500;transition:background .15s,transform .15s;white-space:nowrap}.button .icon{width:16px;height:16px}.primary{background:var(--yellow);border-color:var(--yellow);color:#354123}.primary:hover{background:#d9ec67}.secondary{background:#fff;border-color:var(--line);color:#69725f}.secondary:hover{background:#fafbf7}.dark{background:#2c382b;color:white}.dark:hover{background:#44513a}.danger{background:#fff1ee;color:#b76050;border-color:#f9ded8}.small{font-size:11px;padding:7px 11px}.text-button{border:0;background:transparent;color:#7d8b51;font-size:11px;padding:3px 0;display:inline-flex;align-items:center;gap:5px}.text-button .icon{width:14px;height:14px}.welcome{border:1px solid #e8edcf;border-radius:var(--radius);background:linear-gradient(100deg,#f0f5d9 0%,#f2f6df 50%,#edf3d4 100%);height:137px;padding:24px 27px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}.welcome h2{font-size:20px;letter-spacing:-.5px}.welcome p{font-size:12px;color:#87916d;margin:6px 0 13px}.welcome a{font-size:11px;display:flex;align-items:center;gap:6px}.welcome a .icon{width:14px;height:14px}.charge-art{width:225px;height:170px;position:relative;display:grid;place-items:center;margin-right:10px}.orbit{position:absolute;width:214px;height:85px;border:1px solid #cfdba3;border-radius:50%;transform:rotate(-25deg)}.orbit:nth-child(2){transform:rotate(29deg);width:175px;height:110px;border-color:#d8e3b5}.charge-cube{position:relative;width:77px;height:83px;border-radius:21px;background:linear-gradient(135deg,#f4ffac,#d3e85b 60%,#b9cc45);box-shadow:10px 14px 28px #a3b5633b,inset 2px 3px 5px #ffffb6;transform:rotate(-13deg);display:grid;place-items:center;border:1px solid #d2e475}.charge-cube .icon{width:46px;height:46px;fill:#5e742b;stroke:none}.spark{position:absolute;font-size:17px;color:#a5b64f;right:14px;top:38px}.spark.small-spark{right:auto;left:28px;top:100px;font-size:11px}.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:23px}.metric{border:1px solid var(--line);border-radius:12px;padding:18px 21px;background:white;min-height:122px}.metric-label{color:#8b9383;font-size:11px;display:flex;align-items:center;justify-content:space-between}.metric-label .icon{width:16px;height:16px;color:#a1aa92}.metric strong{font:700 27px/1.8 var(--display);letter-spacing:-1px;display:block;color:#303a2b}.metric>span{font-size:10px;color:#9ba18f}.metric .positive{color:#80964a}.metric.accent{background:#f8faed;border-color:#e4eacb}.metric small{font-weight:400;font-size:12px;color:#9ba18f;letter-spacing:0}.dashboard-grid{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:20px;margin-bottom:22px}.panel{background:white;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:21px 23px 15px}.panel-head h2{font-size:13px}.panel-head p{font-size:10px;color:var(--muted);margin-top:3px}.segmented{display:flex;background:#f6f7f2;border-radius:6px;padding:3px;gap:2px}.segmented button{border:0;background:none;font-size:10px;padding:4px 11px;color:#939b87;border-radius:4px}.segmented button.active{background:#fff;color:#56643e;box-shadow:0 1px 4px #23301e0d}.chart-summary{padding:0 23px;display:flex;align-items:baseline;gap:12px}.chart-summary strong{font:700 23px var(--display)}.chart-summary span{font-size:10px;color:#9ba18f}.chart{display:flex;gap:14px;padding:19px 25px 20px 22px;height:224px}.chart-y{font-size:9px;color:#a5ac9a;display:flex;flex-direction:column;justify-content:space-between;padding-bottom:23px;width:25px}.chart-main{flex:1;min-width:0}.chart-main svg{width:100%;height:173px;overflow:visible}.chart-x{display:flex;justify-content:space-between;color:#a5ac9a;font-size:9px;margin-top:9px}.quickstart{padding:20px 22px}.quickstart h2{font-size:13px;margin-bottom:5px}.quickstart>p{font-size:10px;color:var(--muted);margin-bottom:20px}.step{display:flex;gap:11px;position:relative;padding-bottom:20px}.step:not(:last-of-type):before{content:'';position:absolute;top:25px;left:11px;height:30px;border-left:1px dashed #dde4c8}.step-number{width:23px;height:23px;border-radius:50%;background:#f0f5db;display:grid;place-items:center;font-size:10px;color:#889b49;flex-shrink:0}.step-number .icon{width:12px;height:12px}.step h3{font-size:11px;font-weight:500}.step p{font-size:9px;color:#a1a78f;margin-top:2px}.quickstart .button{width:100%;font-size:11px;margin-top:0}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;text-align:left;white-space:nowrap}th{font-size:10px;color:#98a08e;font-weight:400;background:#fcfdf9;padding:12px 23px;border-block:1px solid #f0f2eb}td{font-size:11px;padding:16px 23px;border-bottom:1px solid #f0f2eb;color:#6c7661}tbody tr:last-child td{border-bottom:0}tbody tr:hover{background:#fdfef9}td strong{font-weight:500;color:#45513a}td .model-cell{display:flex;align-items:center;gap:9px}.model-logo{width:27px;height:27px;border-radius:8px;display:inline-grid;place-items:center;font-size:14px;font-weight:600;background:#f3f4f0;color:#505e4c;flex-shrink:0}.model-logo.purple{background:#f1eef9;color:#9484ba}.model-logo.blue{background:#edf2fc;color:#748bc5}.model-logo.peach{background:#faf0e9;color:#c49a7c}.model-logo.green{background:#ecf3e9;color:#7b9a6f}.badge{display:inline-flex;align-items:center;gap:5px;font-size:9px;padding:3px 8px;border-radius:5px;background:#eff5e7;color:#7b935c}.badge i{width:4px;height:4px;border-radius:50%;background:currentColor}.badge.amber{background:#faf3e4;color:#b39759}.badge.gray{background:#f0f2ed;color:#9aa38e}.badge.red{background:#fcefeb;color:#be8a79}.badge.blue{background:#eff3fb;color:#8096bd}.page-footer{display:flex;justify-content:space-between;color:#acb29f;font-size:9px;padding:23px 1px 1px;gap:15px}.page-footer span:last-child{display:flex;gap:6px;align-items:center}.toolbar{padding:18px 23px;display:flex;align-items:center;justify-content:space-between;gap:15px;border-bottom:1px solid var(--line)}.search{display:flex;align-items:center;gap:9px;background:#f9faf5;border:1px solid var(--line);padding:7px 11px;border-radius:7px;min-width:220px}.search .icon{width:16px;height:16px;color:#a5ad98}.search input{border:0;background:none;outline:none;font-size:11px;color:#5c6a4f;width:100%}.filter{border:1px solid var(--line);background:white;border-radius:7px;padding:7px 10px;font-size:11px;color:#828c76}.toolbar-right{display:flex;gap:8px;align-items:center}.notice{font-size:11px;color:#8e977b;background:#f4f6ea;border:1px solid #e9edda;border-radius:9px;padding:12px 16px;display:flex;gap:9px;align-items:center;margin-bottom:20px}.notice .icon{width:16px;height:16px}.count-note{font-size:10px;color:#a6ad9b;padding:14px 23px;border-top:1px solid var(--line)}.row-actions{display:flex;gap:12px}.row-actions button{font-size:10px;border:0;background:none;color:#839656;padding:2px 0}.row-actions .muted-action{color:#a0a791}.row-actions .danger-text{color:#bf8a77}.mono{font-family:'SFMono-Regular',Consolas,monospace;font-size:11px}.model-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.model-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:21px}.model-card-top{display:flex;align-items:center;gap:12px}.model-card-top .model-logo{width:39px;height:39px;font-size:22px}.model-card h3{font-size:14px}.model-card .provider{font-size:10px;color:var(--muted);margin-top:2px}.model-card>p{color:#99a18e;font-size:11px;min-height:38px;margin:16px 0}.tags{display:flex;gap:6px;flex-wrap:wrap}.tag{font-size:9px;color:#8b947d;background:#f5f7ef;padding:3px 7px;border-radius:4px}.model-price{display:flex;justify-content:space-between;padding:17px 0;margin-top:16px;border-top:1px solid var(--line);font-size:10px;color:#9da58f}.model-price strong{font-size:14px;color:#5c6a47;font-weight:500}.model-price small{font-size:9px;font-weight:400}.model-card .button{width:100%}.page-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}.page-tabs button{background:white;border:1px solid var(--line);border-radius:7px;font-size:11px;padding:8px 14px;color:#8b967b}.page-tabs button.active{border-color:#d5e39e;background:#f3f7df;color:#7d8d4b}.billing-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:20px;margin-bottom:24px}.balance-card{padding:25px;background:#eaf2c2;border:1px solid #dee8ae;border-radius:15px;position:relative;overflow:hidden}.balance-card>p{font-size:12px;color:#83935b}.balance-card>strong{font:700 40px var(--display);display:block;margin:10px 0 20px;letter-spacing:-1px}.balance-card .charge-art{position:absolute;right:0;bottom:10px;opacity:.55;transform:scale(.85)}.balance-card .button{position:relative;z-index:1}.billing-info{padding:24px}.billing-info h2{margin-bottom:18px}.info-line{display:flex;justify-content:space-between;align-items:center;padding:10px 0;font-size:12px;color:#96a084}.info-line strong{font-weight:500;color:#66734e}.empty{text-align:center;padding:55px 20px;color:#a0aa90}.empty>.icon{width:35px;height:35px;opacity:.5}.empty p{margin:10px 0;font-size:12px}.docs-grid{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:20px}.prose-panel{padding:27px}.prose-panel h2{font-size:17px;margin-bottom:12px}.prose-panel h3{font-size:13px;margin:25px 0 12px}.prose-panel p{color:#8a967b;font-size:12px;line-height:1.9}.endpoint{display:flex;justify-content:space-between;gap:10px;background:#f5f7ee;border:1px solid var(--line);border-radius:8px;padding:11px 14px;margin-top:13px;align-items:center;overflow-wrap:anywhere}.code-panel{background:#29352c;border-radius:11px;padding:18px 20px;margin-top:15px;position:relative;overflow:auto}.code-panel pre{color:#c9d4bf;font:11px/1.9 'SFMono-Regular',Consolas,monospace;margin:0;white-space:pre-wrap;overflow-wrap:anywhere}.code-panel .icon-button{position:absolute;right:10px;top:8px;color:#cad5c0}.code-label{color:#7e8e74;font-size:9px;letter-spacing:2px;margin-bottom:12px}.settings-grid{display:grid;grid-template-columns:minmax(0,1.3fr) 1fr;gap:21px}.settings-form{padding:25px}.field{display:block;margin:0 0 16px}.field>span{display:block;font-size:11px;color:#778368;margin-bottom:7px}.field input,.field select,.field textarea{width:100%;padding:10px 12px;border:1px solid #e3e8da;border-radius:7px;background:#fcfdf8;color:#59684b;font-size:12px;transition:border .15s}.field input:focus,.field textarea:focus{border-color:#b8cc6e;outline:none}.field small{display:block;font-size:10px;color:#a4ad95;margin-top:5px}.settings-form h2{margin-bottom:23px}.settings-form .button{margin-top:4px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:15px}.form-error{color:#b75e4b;font-size:11px;min-height:18px;margin:9px 0}.modal-open{overflow:hidden}.modal-overlay{position:fixed;inset:0;z-index:100;background:#23301e50;backdrop-filter:blur(4px);display:grid;place-items:center;padding:20px}.modal{background:white;width:470px;max-width:100%;max-height:90vh;overflow:auto;border-radius:17px;padding:25px;box-shadow:0 20px 70px #29331d25}.modal header{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}.modal header h2{font-size:18px}.modal p{font-size:12px;color:#8c977d;line-height:1.8}.modal .notice{font-size:11px;margin-top:15px}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.secret{background:#f4f7e8;border:1px dashed #c5d68c;border-radius:8px;padding:16px;overflow-wrap:anywhere;user-select:all;margin:17px 0;font:12px/1.7 monospace;color:#60743b}.toast{position:fixed;bottom:28px;left:50%;transform:translate(-50%,15px);padding:12px 22px;background:#303e2e;color:#f3f8e7;border-radius:10px;font-size:12px;box-shadow:0 5px 22px #303c2c22;z-index:150;opacity:0;pointer-events:none;transition:.2s;max-width:90vw}.toast.show{opacity:1;transform:translate(-50%,0)}.auth-page{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;background:white}.auth-art{background:#eaf1ce;display:flex;flex-direction:column;padding:45px 60px;position:relative;overflow:hidden}.auth-art .brand{align-self:flex-start}.auth-copy{margin:auto 0}.auth-copy h1{font-size:47px;line-height:1.4;max-width:400px}.auth-copy p{color:#92a06d;margin-top:20px}.auth-art .charge-art{position:absolute;right:5%;bottom:10%;transform:scale(1.6)}.auth-content{padding:60px;display:flex;align-items:center;justify-content:center}.auth-content form{width:350px;max-width:100%}.auth-content h1{font-size:26px}.auth-content .subtitle{font-size:12px;color:var(--muted);margin:8px 0 29px}.auth-content .button{width:100%}.auth-links{margin:20px 0;font-size:11px;color:#8d9a75;text-align:center}.auth-links a{color:#6c8148}.mobile-menu{display:none}.landing{background:#fafbf5;min-height:100vh}.landing-nav{max-width:1240px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:27px 36px;gap:30px}.landing-links{display:flex;align-items:center;gap:32px;font-size:12px;color:#7c886a}.landing-actions{display:flex;align-items:center;gap:15px}.landing-actions>a:first-child{font-size:12px;color:#74805f}.hero{max-width:1240px;margin:auto;min-height:570px;display:grid;grid-template-columns:1.1fr 1fr;align-items:center;padding:40px 36px 65px;gap:20px}.hero .eyebrow{letter-spacing:2.4px;font-size:11px;display:flex;align-items:center;gap:8px}.hero h1{font-size:58px;letter-spacing:-2.5px;line-height:1.3;margin:23px 0}.hero h1 em{font-style:normal;color:#8ca33d;position:relative}.hero h1 em:after{content:'';position:absolute;left:0;right:0;bottom:3px;height:7px;background:#ddea9a;z-index:0;opacity:.6}.hero p{font-size:14px;color:#96a182;max-width:430px;line-height:2}.hero-actions{display:flex;gap:12px;margin:28px 0 20px}.hero-actions .button{padding:13px 21px}.hero-note{font-size:10px;color:#a4ad93;display:flex;align-items:center;gap:7px}.hero-note .icon{width:13px;height:13px}.hero-visual{height:440px;position:relative;display:grid;place-items:center}.hero-glow{position:absolute;inset:0;background:radial-gradient(ellipse,#eaf4bf 0%,#f4f8e6 50%,transparent 72%)}.hero-visual .charge-art{transform:scale(2.1);margin:0}.hero-visual .charge-cube{box-shadow:14px 25px 35px #a3b56340,inset 2px 3px 5px #ffffb6}.float-card{position:absolute;z-index:3;border:1px solid #e7ecd5;background:#ffffffd9;backdrop-filter:blur(6px);border-radius:11px;box-shadow:0 7px 22px #52602a08;padding:13px 17px;display:flex;gap:10px;align-items:center}.float-card .model-logo{width:31px;height:31px}.float-card strong{font-size:11px;display:block;font-weight:500}.float-card span{font-size:9px;color:#a0aa8c}.float-one{top:35px;left:55px;transform:rotate(-5deg)}.float-two{right:8px;top:170px;transform:rotate(5deg)}.float-three{left:25px;bottom:30px;transform:rotate(-2deg)}.landing-strip{border-block:1px solid #e9eddc;display:flex;justify-content:space-between;gap:20px;max-width:1168px;margin:0 auto;padding:25px 15px;color:#8c987a;font-size:12px}.landing-strip span{display:flex;align-items:center;gap:10px}.landing-strip .icon{color:#a7b777;width:18px;height:18px}.landing-section{max-width:1240px;margin:auto;padding:70px 36px}.section-intro{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:30px;gap:20px}.section-intro h2{font-size:27px;letter-spacing:-.7px}.section-intro p{font-size:12px;color:#9ba68b;margin-top:10px}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:21px}.feature-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:29px}.feature-icon{width:42px;height:42px;border-radius:12px;background:#f0f5dc;display:grid;place-items:center;color:#8ea552;margin-bottom:22px}.feature-card h3{font-size:16px;margin-bottom:10px}.feature-card p{font-size:12px;line-height:1.9;color:#99a48a}.landing-cta{max-width:1168px;margin:0 auto 60px;background:#eaf2c9;border:1px solid #e1eab8;border-radius:18px;padding:37px 43px;display:flex;align-items:center;justify-content:space-between;gap:20px}.landing-cta h2{font-size:25px}.landing-cta p{color:#94a271;font-size:12px;margin-top:8px}.landing-footer{max-width:1240px;margin:auto;padding:25px 36px 40px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;color:#a5ae96;font-size:10px;gap:20px}.admin-shell .nav-item.active{background:#eaf0e5;color:#527041}.admin-shell .sidebar .brand-icon{background:#dfe9cc}.admin-welcome{height:105px;background:#edf2e8;border-color:#e2e9da}.admin-welcome p{margin:7px 0 0}.admin-welcome .shield-mark{width:58px;height:58px;color:#a1b692;background:#e1ebd7;border-radius:16px;display:grid;place-items:center}.shield-mark .icon{width:33px;height:33px}.horizontal-bars{padding:8px 23px 22px}.bar-row{margin:15px 0}.bar-label{display:flex;justify-content:space-between;font-size:10px;color:#899779;margin-bottom:8px}.bar-track{height:6px;background:#f2f5eb;border-radius:9px;overflow:hidden}.bar-fill{height:100%;background:#b7cc77;border-radius:9px}.audit-event{display:flex;gap:11px;padding:14px 23px;border-bottom:1px solid #f0f2eb}.audit-event:last-child{border:0}.audit-event .avatar{width:28px;height:28px;font-size:10px}.audit-event strong{font-size:11px;font-weight:500}.audit-event p{font-size:10px;color:#a2ad93;margin-top:3px}.audit-event time{font-size:9px;color:#acb59e;margin-left:auto;white-space:nowrap}.toggle{position:relative;width:32px;height:18px;border:0;border-radius:20px;background:#dfe5d5;padding:0}.toggle.on{background:#adc76d}.toggle:before{content:'';position:absolute;top:3px;left:3px;width:12px;height:12px;border-radius:50%;background:#fff;transition:left .2s}.toggle.on:before{left:17px}.health-row{display:flex;align-items:center;gap:10px;padding:16px 23px}.health-row p{font-size:11px}.health-row small{font-size:9px;color:var(--muted)}.health-row .badge{margin-left:auto}.danger-zone{border:1px solid #f0e3dc;background:#fffdfb;border-radius:12px;padding:20px;margin-top:20px}.danger-zone p{font-size:11px;color:#a89783;margin:8px 0 14px}.loading{min-height:70vh;display:grid;place-items:center;color:#8fa269;font-size:13px}.mobile-overlay{display:none}.full{width:100%}.spaced{margin-top:20px}.muted{color:var(--muted)}.inline-gap{display:flex;align-items:center;gap:8px}.table-note{padding:13px 23px;color:#a0a98f;font-size:10px;border-top:1px solid var(--line)}
@media(min-width:1500px){.main{padding:38px 50px}.topbar{padding-inline:50px}.dashboard-grid{grid-template-columns:minmax(0,1fr) 330px}.metric{padding:22px 25px}.welcome{height:151px}.metrics{gap:20px}.chart{height:245px}.chart-main svg{height:193px}}
@media(max-width:1150px){.sidebar{width:206px;padding-inline:14px}.shell{margin-left:206px}.topbar{padding-inline:25px}.main{padding:25px}.dashboard-grid{grid-template-columns:minmax(0,1fr) 250px;gap:15px}.metric{padding:15px}.metric strong{font-size:24px}.model-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero h1{font-size:47px}.hero-visual .charge-art{transform:scale(1.7)}.hero-visual .float-one{left:10px}.hero-visual .float-three{left:0}.hero-visual .float-two{right:-10px}.top-actions{gap:12px}.docs-grid{grid-template-columns:1fr}.docs-grid>aside{display:none}.settings-grid{grid-template-columns:1fr 1fr}th,td{padding-inline:17px}}
@media(max-width:900px){.sidebar{width:185px;padding:25px 10px}.sidebar .brand{font-size:18px;padding-left:10px}.brand-icon{width:35px;height:38px}.shell{margin-left:185px}.topbar{height:66px;padding-inline:20px}.main{padding:23px 20px}.metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.dashboard-grid{grid-template-columns:1fr}.quickstart{display:none}.welcome{height:133px;padding:20px}.welcome .charge-art{margin-right:-38px;transform:scale(.8)}.top-actions>a{display:none}.page-head h1{font-size:24px}.billing-grid,.settings-grid{grid-template-columns:1fr}.hero{min-height:460px;gap:0}.hero h1{font-size:38px}.hero p{font-size:12px}.hero-visual{height:350px}.hero-visual .charge-art{transform:scale(1.4)}.float-card{padding:10px}.float-two{display:none}.landing-links{gap:20px}.landing-section{padding-block:50px}.feature-card{padding:22px}.landing-cta{margin-inline:25px}.landing-strip{margin-inline:25px}.auth-art{padding:35px}.auth-copy h1{font-size:35px}.auth-art .charge-art{transform:scale(1.1)}.auth-content{padding:35px}.toolbar{flex-wrap:wrap}.search{min-width:170px}.head-actions .button{padding:9px 12px}}
@media(max-width:680px){.sidebar{transform:translateX(-100%);width:230px;transition:transform .2s;z-index:60}.shell{margin-left:0}.sidebar.open{transform:translateX(0)}.mobile-overlay.open{display:block;position:fixed;inset:0;z-index:50;background:#25301d44}.mobile-menu{display:inline-flex}.topbar{height:60px;padding:0 17px}.breadcrumbs{gap:7px;font-size:11px}.breadcrumbs>span:first-of-type{display:none}.top-actions{gap:6px}.top-actions .avatar{display:none}.top-actions .demo-indicator{font-size:9px;padding:3px 6px}.main{padding:23px 16px}.page-head{align-items:flex-start;margin-bottom:20px}.page-head h1{font-size:23px}.page-head p{font-size:11px}.head-actions .secondary{display:none}.head-actions .button{padding:9px 11px;font-size:11px}.eyebrow{font-size:9px}.welcome{height:123px;padding:19px}.welcome h2{font-size:17px}.welcome p{font-size:10px;max-width:220px}.welcome .charge-art{width:100px;margin-right:-20px;transform:scale(.65)}.welcome .charge-art .orbit{width:180px}.metric{padding:15px 16px;min-height:116px}.metric strong{font-size:24px}.metric-label{font-size:10px}.metric>span{font-size:9px}.metrics{gap:10px;margin-bottom:18px}.dashboard-grid{margin-bottom:18px}.panel-head{padding:18px 17px 13px}.chart-summary{padding-inline:17px}.chart{padding-inline:16px;height:211px}.chart-main svg{height:160px}.chart-y{font-size:8px}.chart-x{font-size:8px}.page-footer{font-size:8px;flex-direction:column;gap:5px;padding-top:22px}.model-grid{grid-template-columns:1fr}.toolbar{padding:16px}.toolbar .search{width:100%}.toolbar-right{width:100%;justify-content:space-between}.notice{font-size:10px;align-items:flex-start}.billing-grid{gap:15px}.balance-card>strong{font-size:35px}.prose-panel{padding:20px}.settings-form{padding:21px}.form-row{grid-template-columns:1fr;gap:0}.modal{padding:22px}.landing-nav{padding:20px}.landing-nav .brand{font-size:19px}.landing-links{display:none}.landing-actions{gap:10px}.landing-actions .button{padding:9px 11px;font-size:10px}.landing-actions>a:first-child{font-size:11px}.hero{display:flex;flex-direction:column;padding:38px 23px 25px;gap:0;align-items:flex-start}.hero h1{font-size:42px;margin-top:20px}.hero p{font-size:13px;max-width:360px}.hero-visual{height:300px;width:100%;margin:15px 0 5px}.hero-visual .charge-art{transform:scale(1.55)}.hero-visual .float-one{left:4%;top:15px}.hero-visual .float-three{left:auto;right:0;bottom:15px}.landing-strip{margin:0 20px;display:grid;grid-template-columns:1fr 1fr;padding:20px 0;gap:17px;font-size:10px}.landing-strip span:last-child{grid-column:1/-1}.landing-section{padding:43px 20px}.section-intro h2{font-size:23px}.section-intro p{font-size:11px}.section-intro>.text-button{white-space:nowrap;font-size:10px}.feature-grid{grid-template-columns:1fr;gap:13px}.feature-card{padding:23px}.feature-icon{margin-bottom:15px}.landing-cta{margin:0 20px 35px;padding:27px;display:block}.landing-cta h2{font-size:22px}.landing-cta .button{margin-top:20px}.landing-footer{margin:0 20px;padding:25px 0 30px;flex-direction:column;align-items:flex-start;gap:17px;font-size:9px}.auth-page{grid-template-columns:1fr}.auth-art{padding:25px;min-height:200px}.auth-copy{margin-top:35px}.auth-copy h1{font-size:27px;max-width:270px}.auth-copy p{font-size:11px;margin-top:10px}.auth-art .charge-art{right:-40px;bottom:10px;transform:scale(.8)}.auth-content{padding:35px 25px}.auth-content form{width:100%}.auth-content h1{font-size:23px}.balance-card .charge-art{right:-30px}.mobile-overlay{cursor:pointer}.admin-welcome{height:auto;min-height:104px}.admin-welcome .shield-mark{width:42px;height:42px;margin-left:12px;flex-shrink:0}.admin-welcome .shield-mark .icon{width:24px;height:24px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;scroll-behavior:auto!important}}

/* Keep secondary UI readable on both bright and dim displays. */
.page-head p,.metric-label,.quickstart>p,.panel-head p,.model-card>p,.prose-panel p{color:#7e886f}.metric>span,.chart-summary span,.welcome p{color:#7f8b69}.nav-title,.page-footer,.user-email{color:#8b967d}

.sidebar{overflow-y:auto;overscroll-behavior:contain}.sidebar .brand,.workspace-label{flex-shrink:0}@media(max-width:680px){.sidebar{visibility:hidden}.sidebar.open{visibility:visible}}

/* Server-rendered customer and operations screens share the console components. */
.account-workspace .workspace-label{justify-content:flex-start;gap:9px}
.account-workspace [data-icon]{display:inline-flex;align-items:center}
.account-workspace .brand-icon{display:grid}
.account-workspace nav .nav-title:not(:first-child){margin-top:22px}
.account-workspace .shell,.account-workspace .main{min-width:0}
.account-workspace .account-form{display:flex;align-items:flex-end;gap:12px 16px;flex-wrap:wrap;padding:20px 22px;margin:0 0 20px}
.account-form .field{flex:1 1 140px;margin:0;font-size:12px;color:var(--ink)}
.account-form .field input{display:block;margin-top:6px;min-height:40px}
.account-form .button{min-height:40px}
.account-form a:not(.button),.account-pager a,.account-workspace td a{color:#50672c;text-decoration:underline;text-underline-offset:3px}
.account-form a:not(.button){align-self:center}
.reconciliation-actions{display:flex;align-items:stretch;gap:8px}
.reconciliation-actions .button{margin:0}
@media(max-width:680px){
 .reconciliation-actions{width:100%}
 .reconciliation-actions .button{flex:1}
}
.account-workspace .account-summary{display:flex;flex-wrap:wrap;gap:16px 36px;margin:0 0 20px;padding:18px 22px;font-variant-numeric:tabular-nums}
.account-summary dt{color:#606c58;font-size:12px}.account-summary dd{margin:3px 0 0;font-weight:650;overflow-wrap:anywhere}
.account-workspace .table-wrap{max-width:100%}
.account-workspace table{font-variant-numeric:tabular-nums}
.account-workspace td,.account-workspace th{white-space:nowrap}
.account-workspace caption{padding:16px 20px;text-align:left;font-weight:600}
.account-workspace td small{display:block}
.account-workspace code{font-family:ui-monospace,monospace;font-size:12px}
.cost-table td:nth-child(2){min-width:190px;max-width:270px;white-space:normal;overflow-wrap:anywhere}
.cost-table td:nth-child(n+5):nth-child(-n+7),.cost-table th:nth-child(n+5):nth-child(-n+7){text-align:right}
.account-workspace .account-empty{text-align:center;padding:32px 16px;color:var(--muted)}
.account-pager{display:flex;align-items:center;justify-content:flex-end;gap:15px;padding:12px 20px;color:#626e59;border-top:1px solid var(--line);font-size:12px}
.account-error{color:#943b36}
.workspace-mobile{display:none}
@media(max-width:680px){
 .account-workspace .topbar{justify-content:flex-start;position:relative;z-index:2}
 .workspace-mobile{display:block}
 .workspace-mobile summary{list-style:none;cursor:pointer}
 .workspace-mobile summary::-webkit-details-marker{display:none}
 .workspace-mobile nav{position:absolute;top:100%;left:0;width:min(280px,94vw);max-height:72vh;overflow:auto;background:var(--surface);padding:14px;border:1px solid var(--line);border-radius:0 0 var(--radius) 0;box-shadow:0 12px 28px #27342518}
 .account-workspace .account-form,.account-workspace .account-summary{padding:15px;gap:12px}
 .account-form .field{flex-basis:100%}
}


.wallet-heading,.wallet-actions{display:flex;align-items:center;gap:10px}
.wallet-heading{justify-content:space-between;gap:16px;margin-bottom:20px}
.wallet-heading h1{font-size:clamp(23px,2.5vw,30px);line-height:1.25;letter-spacing:-.04em}
.wallet-actions .button{min-height:40px}
.wallet-summary{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);overflow:hidden;border:1px solid var(--line);border-radius:16px;background:white;margin-bottom:22px}
.wallet-funds,.wallet-statement{padding:clamp(20px,2.4vw,34px);min-width:0}
.wallet-summary h2{font-size:15px;line-height:1.4;color:var(--ink);margin:0}
.wallet-funds h2{display:flex;gap:8px;align-items:center}
.wallet-funds h2::before{content:"";width:4px;height:15px;background:#b4cc38;border-radius:2px}
.wallet-total{display:block;margin:9px 0 19px;font:650 clamp(30px,3.4vw,52px)/1.15 var(--display);letter-spacing:-.035em;color:#293625;overflow-wrap:anywhere}
.wallet-summary dl,.wallet-summary dd{margin:0}
.wallet-summary dd,.wallet-total{font-variant-numeric:tabular-nums}
.wallet-split{border-top:1px solid var(--line);padding-top:14px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.wallet-summary dt,.wallet-note{color:#626c5b;font-size:12px}
.wallet-split dd{margin-top:4px;font-size:18px;font-weight:600;overflow-wrap:anywhere}
.wallet-note{margin:12px 0 0;font-size:11px}
.wallet-statement{background:#f8f9f4;border-left:1px solid var(--line)}
.wallet-statement dl{margin-top:12px}
.wallet-statement dl>div{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:11px 0}
.wallet-statement dl>div+div{border-top:1px solid var(--line)}
.wallet-statement dd{font-size:13px;font-weight:550;text-align:right;overflow-wrap:anywhere}
.wallet-statement dl>div:first-child dd{font-size:19px}
.wallet-summary+.settings-form{margin:0 0 22px}
@media(max-width:680px){
 .wallet-heading{align-items:flex-start;flex-wrap:wrap}
 .wallet-summary{grid-template-columns:1fr}
 .wallet-statement{border-left:0;border-top:1px solid var(--line)}
}
@media(max-width:480px){
 .wallet-actions{width:100%}
 .wallet-actions .button{flex:1}
}

.model-distribution{align-self:start;min-width:0;--distribution-inset:23px}
.model-distribution .panel-head{padding-inline:var(--distribution-inset)}
.model-shares{display:grid;gap:17px;list-style:none;margin:0;padding:6px var(--distribution-inset) 22px}
.model-share-label{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:7px;font-size:12px;color:var(--ink)}
.model-share-label span{min-width:0;overflow-wrap:anywhere}
.model-share-label strong{flex:none;font-size:11px;font-weight:500;font-variant-numeric:tabular-nums;color:#58664f}
@media(max-width:680px){.model-distribution{--distribution-inset:17px}}

.order-overview{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:5px 16px;padding:14px 18px;background:#f4f7ea;border-radius:10px}
.order-overview>span:first-child{font-size:12px;color:#5f6b51}
.order-overview>strong{grid-column:1;font-size:26px;line-height:1.2;color:var(--ink);overflow-wrap:anywhere}
.order-overview>.badge{grid-column:2;grid-row:1/3}
.order-group{margin:16px 0 0}
.order-group h3{margin:0 0 6px;padding-bottom:6px;border-bottom:1px solid var(--line);font-size:13px}
.order-group dl,.order-group dd{margin:0}
.order-group dl>div{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:16px;padding:4px 0;font-size:12px;line-height:1.5}
.order-group dt{color:#64705b;white-space:nowrap}
.order-group dd{text-align:right;overflow-wrap:anywhere;color:var(--ink);font-variant-numeric:tabular-nums}

.order-number{max-width:100%;display:inline-flex;align-items:center;gap:6px;border:0;background:transparent;color:inherit;padding:3px 0;font:inherit;font-variant-numeric:tabular-nums;cursor:pointer}
.order-number span{min-width:0;overflow-wrap:anywhere}
.order-number .icon{flex:none;width:13px;height:13px;color:var(--muted)}
.order-number:hover{color:#50672c}

.model-logo img{display:block;width:100%;height:100%;object-fit:contain;border-radius:inherit}
.model-logo-editor{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.model-logo-editor .model-logo{flex:none}
.model-logo-editor input{max-width:100%;min-width:0}

.model-description{white-space:pre-line;overflow-wrap:anywhere}

/* Form selectors and compact table filters share the same disclosure treatment. */
.field select, select.filter, .field input[list], .field input[role="combobox"] {
  --select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2366745c' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E");
  appearance: none;
  box-sizing: border-box;
  min-height: 40px;
  max-width: 100%;
  padding: 8px 36px 8px 12px;
  border: 1px solid #d8ded2;
  border-radius: 8px;
  background: #fff var(--select-chevron) no-repeat right 10px center;
  color: var(--ink);
  font: 400 13px/1.45 var(--sans);
  text-overflow: ellipsis;
}
.field select, select.filter {cursor: pointer}
select.filter {min-height: 35px; min-width: 98px; width: auto; font-size: 12px}
.toolbar-right {min-width: 0; max-width: 100%}
.toolbar-right select.filter {min-width: 0; flex: 0 1 auto}
.field select:hover, select.filter:hover, .field input[role="combobox"]:hover {border-color: #9cae90}
.field select:focus-visible, select.filter:focus-visible, .field input[role="combobox"]:focus-visible {
  outline: 2px solid #82994d;
  outline-offset: 2px;
}
select:disabled {opacity: .58; cursor: default}
@supports (appearance: base-select) {
  .field select, select.filter, .field select::picker(select), select.filter::picker(select) {appearance: base-select}
  .field select::picker-icon, select.filter::picker-icon {display: none}
  .field select::picker(select), select.filter::picker(select) {
    margin-block: 4px; padding: 4px; border: 1px solid #d8ded2; border-radius: 10px;
    background: white; box-shadow: 0 8px 24px #24311e1c;
    max-height: min(280px, 45dvh); overflow: auto; overscroll-behavior: contain;
  }
  .field select option, select.filter option {
    display: flex; align-items: center; gap: 12px; justify-content: space-between;
    min-height: 34px; padding: 6px 10px; border-radius: 5px; cursor: pointer;
    color: var(--ink); font: 400 13px/1.45 var(--sans); overflow-wrap: anywhere;
  }
  option::checkmark {order: 1; color: #576e35}
  .field select option:checked, select.filter option:checked {background: #edf3df}
  .field select option:is(:hover,:focus-visible), select.filter option:is(:hover,:focus-visible) {background: #f3f5ef; outline: 1px solid #c7d3b7; outline-offset: -1px}
}
.suggestion-field {position: relative}
.suggestion-field .suggest-toggle {
  position: absolute; bottom: 1px; right: 1px; width: 35px; height: 38px;
  background: transparent; border: 0; border-radius: 7px; cursor: pointer;
}
.suggestion-list {
  position: fixed; inset: auto; margin: 0; padding: 4px; max-height: min(240px, 40dvh);
  overflow: auto; overscroll-behavior: contain; border: 1px solid #d8ded2;
  border-radius: 10px; background: white; box-shadow: 0 8px 24px #24311e1c;
}
.suggestion-list [role="option"] {
  padding: 7px 10px; border-radius: 5px; font-size: 13px; cursor: pointer; overflow-wrap: anywhere;
}
.suggestion-list [aria-selected="true"] {background: #edf3df}
.suggestion-list [role="option"]:hover {background: #f3f5ef}
@media (forced-colors: active) {
  .field select, select.filter {appearance: auto; background-image: none}
  .suggest-toggle::after {content: '▾'}
}
.modal-overlay {grid-template-columns: minmax(0, 1fr)}

.period-form{display:flex;flex-wrap:wrap;align-items:end;gap:12px;padding:14px 20px;border-bottom:1px solid var(--line)}
.period-form label{display:grid;gap:4px;font-size:12px;color:#52614c}
.period-form input{font:inherit;font-size:14px;color:var(--ink);background:white;border:1px solid #dce2d6;border-radius:7px;padding:6px 10px}
.period-form .text-button{align-self:center}
.catalog-layout{display:grid;grid-template-columns:170px minmax(0,1fr);align-items:start;gap:20px;margin-top:20px}
.catalog-layout .model-grid{margin:0}
.catalog-filters{display:grid;gap:16px;padding:16px;background:white;border:1px solid var(--line);border-radius:12px}
.catalog-filters label{display:grid;gap:6px;font-size:13px}
.catalog-filters .filter{width:100%;min-width:0}
@media(max-width:760px){.catalog-layout{grid-template-columns:minmax(0,1fr)}.catalog-filters{grid-template-columns:1fr 1fr}}

.recharge-records .panel-head{padding:20px 22px 8px}
.recharge-records .panel-head .muted{font-size:12px}
.recharge-period{display:grid;grid-template-columns:repeat(2,minmax(0,1fr)) auto;align-items:end;gap:12px 16px;padding:12px 22px 20px;border-bottom:1px solid var(--line)}
.recharge-period .field{min-width:0;margin:0;color:var(--ink);font-size:12px}
.recharge-period input{display:block;min-width:0;height:40px;margin-top:6px}
.recharge-period-actions{display:flex;align-items:center;gap:12px}
.recharge-period-actions .button{min-height:40px;padding-inline:22px}
.recharge-period-actions [hidden]{display:none}
@media(max-width:640px){
  .recharge-records .panel-head{padding:16px 16px 6px}
  .recharge-period{grid-template-columns:repeat(2,minmax(0,1fr));padding:10px 16px 16px;gap:12px}
  .recharge-period-actions{grid-column:1/-1}
}

.catalog-filters fieldset{min-width:0;margin:0;padding:0;border:0}
.catalog-filters legend{padding:0;margin-bottom:8px;font-size:13px;font-weight:600}
.catalog-options{display:flex;flex-wrap:wrap;gap:6px}
.catalog-options button{background:transparent;border:1px solid var(--line);color:#49563f;border-radius:7px;padding:5px 9px;cursor:pointer}
.catalog-options button[aria-pressed=true]{background:#eff4d0;border-color:#b6c76b;color:#35422a}
.catalog-results{min-width:0}
.catalog-results:has(.catalog-row){background:white;border:1px solid var(--line);border-radius:14px}
.catalog-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(170px,.6fr) auto;align-items:center;gap:22px;padding:20px 22px}
.catalog-row+.catalog-row{border-top:1px solid var(--line)}
.catalog-info{display:flex;align-items:flex-start;gap:12px;min-width:0}
.catalog-name{min-width:0;display:grid;gap:4px;overflow-wrap:anywhere}
.catalog-name strong{font-size:16px}
.catalog-name small,.catalog-name p,.catalog-prices small,.catalog-prices span{font-size:12px;color:#59644f}
.catalog-name p{line-height:1.5;margin:2px 0 0}
.catalog-prices{display:grid;gap:6px}
.catalog-prices>div{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.catalog-prices strong{font-size:15px;font-variant-numeric:tabular-nums}
.catalog-row .button{white-space:nowrap;justify-self:end}
.modal:has(.catalog-details){width:660px}
.catalog-details{min-width:0;overflow-wrap:anywhere}
.catalog-details p{line-height:1.6;margin:8px 0 16px}
.catalog-details table{width:100%;min-width:0}
.catalog-details caption{text-align:left;font-weight:600;padding:12px 0}
.catalog-details h3{margin:18px 0 6px}
.catalog-details .code-panel{margin-top:12px}
@media(max-width:960px){.catalog-row{grid-template-columns:minmax(0,1fr) auto;gap:14px}.catalog-info{grid-column:1/-1}}
@media(max-width:480px){.catalog-row{padding:16px;gap:12px}.catalog-row .button{padding:8px 10px}.catalog-prices>div{gap:4px}}

.brand-mark{display:block;width:40px;height:40px;object-fit:contain;flex:none}
.catalog-layout{grid-template-columns:184px minmax(0,1fr);gap:24px}
.catalog-filters{padding:18px 14px;gap:20px}
.catalog-filters legend{font-size:12px;color:#54614d;margin:0 0 8px 8px}
.catalog-filters fieldset+fieldset{border-top:1px solid var(--line);padding-top:12px}
.catalog-options{display:grid;gap:2px}
.catalog-options button{display:flex;align-items:center;justify-content:space-between;min-height:34px;padding:6px 10px;border:0;text-align:left;font-size:13px}
.catalog-options button:hover{background:#f5f6ee}
.catalog-options button[aria-pressed=true]{background:#edf2d6;font-weight:600}
.catalog-options button[aria-pressed=true]::after{content:'✓';color:#536425}
.catalog-results:has(.catalog-row){display:grid;gap:14px;border:0;background:none}
.catalog-row{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px 24px;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) auto}
.catalog-info{align-items:center;gap:16px}
.catalog-name small{display:flex;align-items:center;gap:8px}
.catalog-name strong{font-size:clamp(18px,1.5vw,23px);font-weight:600;letter-spacing:-.025em}
.catalog-prices{border-left:1px solid var(--line);padding-left:22px;gap:8px}
.catalog-prices strong{font-size:18px;font-weight:600;color:#2e4128}
.catalog-row .button{background:#f6f8ef;color:#33472d}
@media(max-width:1050px){.catalog-row{grid-template-columns:minmax(0,1fr) auto}.catalog-info{grid-column:1/-1}.catalog-prices{border:0;padding:0}}
@media(max-width:760px){.catalog-layout{grid-template-columns:minmax(0,1fr);gap:14px}.catalog-filters{display:flex;flex-wrap:wrap;padding:12px;gap:14px}.catalog-filters fieldset+fieldset{border:0;padding:0}.catalog-options{display:flex;flex-wrap:wrap}.catalog-options button{gap:6px}.catalog-filters legend{margin-left:4px}.catalog-row{padding:16px}}

.catalog-list{min-width:0}
.catalog-list .model-cell{align-items:center}
.catalog-summary{max-width:32ch;margin-top:3px;color:#606d58;white-space:normal;line-height:1.45;font-size:12px;overflow-wrap:anywhere}
.catalog-list .catalog-vendor{color:#555555;font-size:13px;font-weight:550}
.catalog-kind{box-sizing:border-box;display:inline-grid;grid-template-columns:14px 3em;align-items:center;justify-content:center;text-align:center;width:74px;gap:5px;padding:3px 0;border-radius:20px;white-space:nowrap;font-size:12px;font-weight:600;line-height:1.6}
.catalog-kind .icon{width:14px;height:14px}
.catalog-kind.kind-video{color:#52632c;background:#eef3dc}
.catalog-kind.kind-image{color:#805c27;background:#faf1df}
.catalog-kind.kind-text{color:#36614e;background:#eaf3ec}
.catalog-rate{display:grid;grid-template-columns:max-content auto;gap:4px 9px;align-items:baseline;font-variant-numeric:tabular-nums}
.catalog-rate-line{display:grid;grid-template-columns:subgrid;grid-column:1/-1;align-items:baseline}
.catalog-rate .rate-label,.catalog-rate .rate-unit{font-size:12px;color:#626262}
.catalog-list .catalog-rate strong{font-weight:650;font-size:16px;color:#292929}
.catalog-rate-line>span:last-child{white-space:nowrap}
.catalog-list th,.catalog-list td{padding-inline:16px}

.catalog-option-label{display:inline-flex;align-items:center;gap:9px}
.catalog-option-label img,.catalog-option-label .icon{width:18px;height:18px;flex:none;object-fit:contain}

.playground-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:20px}
.playground-layout h2{margin:0 0 18px}.playground-layout textarea,.try-output{font-family:ui-monospace,monospace;line-height:1.55}
.try-output{white-space:pre-wrap;overflow-wrap:anywhere;max-height:540px;overflow:auto}
.playground-layout [data-result-status]{overflow-wrap:anywhere}
@media(max-width:820px){.playground-layout{grid-template-columns:minmax(0,1fr)}}

/* Workspace typography: headings, figures, reading text and supporting labels. */
:root {
  --ink: #233025;
  --muted: #606c5e;
  --section-title: clamp(16px, 1.25vw, 19px);
  --page-title: clamp(26px, 2.6vw, 38px);
}
.page-head h1, .wallet-heading h1, .account-workspace .main h1 {
  font-size: var(--page-title);
  font-weight: 720;
  line-height: 1.2;
  letter-spacing: -.035em;
}
.page-head p, .welcome p {font-size:14px;line-height:1.65;color:var(--muted)}
.eyebrow {color:#66774d;letter-spacing:.15em}
.panel-head h2, .settings-form h2, .wallet-summary h2, .quickstart h2,
.prose-panel h2, .account-workspace caption {
  font-size:var(--section-title);font-weight:650;line-height:1.4;color:var(--ink)
}
.panel-head p, .metric>span, .wallet-note, .field small {font-size:12px;color:var(--muted)}
.nav-item {font-size:14px;color:#51604f}
.nav-item.active {font-weight:650}
.nav-title, .workspace-label {color:#61705a}
.metric-label, .wallet-summary dt, .account-summary dt {font-size:13px;color:#55634f}
.metric strong {
  margin:7px 0 5px;font-size:clamp(24px,2.15vw,34px);font-weight:700;
  line-height:1.22;font-variant-numeric:tabular-nums;overflow-wrap:anywhere
}
.wallet-total {font-size:clamp(34px,4vw,60px);font-weight:720}
.wallet-split dd, .account-summary dd {font-size:clamp(18px,1.6vw,24px);font-weight:650}
th {background:#f5f7f1;font-size:12px;font-weight:600;color:#53614d}
td {font-size:14px;font-weight:400;line-height:1.5;color:#394838;font-variant-numeric:tabular-nums}
td strong, .catalog-rate strong {font-weight:650;color:var(--ink)}
.catalog-summary, td .muted {font-size:12px;color:#5e6a5a}
.badge {font-size:11px;font-weight:550;color:#466338}
.badge.amber {color:#78541e}.badge.red {color:#944b3b}.badge.gray {color:#596353}.badge.blue {color:#415e8c}
.field>span, .field>label {font-size:13px;font-weight:550;color:#41513d}
.field input, .field select, .field textarea, .search input, select.filter {font-size:14px;color:var(--ink)}
.info-line {font-size:14px;color:var(--muted)}
.info-line strong {font-weight:600;color:var(--ink)}
.button {font-size:13px}.button.primary, .button.dark {font-weight:650}
.modal header h2, .benefit-dialog h2 {font-size:22px;font-weight:680}
.text-button, .row-actions button {font-size:13px;color:#4e6531}
.row-actions button.danger {color:#974b39}
.try-output {font-size:13px}
@media(max-width:680px){
  .page-head {flex-wrap:wrap}
  .page-head p, .welcome p {font-size:13px}
  .metric strong {font-size:clamp(20px,5.5vw,28px)}
  .field input, .field select, .field textarea {font-size:16px}
  .table-wrap {max-width:100%;overflow-x:auto}
}
.notice, .count-note, .table-note {color:#58654d;font-size:12px;line-height:1.6}
.row-actions .danger-text {color:#974b39}
.row-actions .muted-action {color:#626e5b}
.landing-links {font-size:14px;color:#52604d}
.hero h1 em {color:#68812d}
.hero p, .auth-copy p, .auth-content .subtitle {color:var(--muted)}
.auth-content h1 {font-size:clamp(26px,2.2vw,34px);font-weight:700}

@keyframes dialog-arrive {
  from { opacity:0; transform:translateY(16px) scale(.975) }
  to { opacity:1; transform:translateY(0) }
}
@keyframes surface-fade { from { opacity:0 } to { opacity:1 } }
@keyframes filter-confirm {
  from { opacity:.4; transform:scale(.8) }
  to { opacity:1; transform:scale(1) }
}
@media (prefers-reduced-motion:no-preference) {
  html[data-motion="page"] .main,
  html[data-motion="catalog"] .catalog-list,
  html[data-motion="guide"] .guide-example,
  html[data-motion="range"] .panel:has([data-range]) { view-transition-name:workspace-surface }
  html[data-motion]::view-transition-group(root) { animation:none }
  html[data-motion]::view-transition-old(root) { display:none }
  html[data-motion]::view-transition-new(root) { animation:none }
  :root {
    --enter-distance:clamp(18px,2.6vw,40px);
    --exit-distance:-12px;
    --enter-scale:.982;
    --exit-scale:.985;
    --enter-duration:360ms;
    --exit-duration:190ms;
  }
  :root[data-motion]:not([data-motion="page"]) {
    --enter-distance:10px;
    --exit-distance:-4px;
    --enter-scale:.997;
    --exit-scale:.998;
    --enter-duration:230ms;
    --exit-duration:130ms;
  }
  html[data-motion]::view-transition { pointer-events:none }
  ::view-transition-group(workspace-surface) { animation:none }
  ::view-transition-old(workspace-surface), ::view-transition-new(workspace-surface) {
    transform-origin:12% 0;
    object-position:top left;
    object-fit:none;
  }
  ::view-transition-old(workspace-surface) { animation:surface-out var(--exit-duration) cubic-bezier(.36,0,.74,.48) both }
  ::view-transition-new(workspace-surface) { animation:surface-in var(--enter-duration) cubic-bezier(.18,.76,.22,1) both }
  .modal-overlay, .mobile-overlay.open, .benefit-dialog[open]::backdrop {
    animation:surface-fade 120ms ease-out;
  }
  .modal-overlay>.modal, .benefit-dialog[open] { animation:dialog-arrive 260ms cubic-bezier(.16,1,.3,1) }
  .nav-item, .page-tabs button, .catalog-options button {
    transition:background-color 130ms ease-out,color 130ms ease-out,border-color 130ms ease-out;
  }
  .catalog-options button.filter-confirmed::after { animation:filter-confirm 150ms ease-out }
  .button:not(:disabled) { transition:transform 140ms ease-out,box-shadow 140ms ease-out,background-color 140ms ease-out }
  .button:not(:disabled):active { transform:translateY(1px) scale(.98) }
  .text-button .icon { transition:transform 140ms ease-out }
}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  .button:not(:disabled):hover:not(:active) { transform:translateY(-2px);box-shadow:0 3px 8px #26351e1c }
  .text-button:hover .icon { transform:translateX(2px) }
}

@keyframes surface-out {
  from { opacity:1; transform:none }
  to { opacity:0; transform:translateX(var(--exit-distance)) scale(var(--exit-scale)) }
}
@keyframes surface-in {
  from { opacity:0; transform:translateX(var(--enter-distance)) scale(var(--enter-scale)) }
  to { opacity:1; transform:translateX(0) }
}

/* Account and operations reports navigate between separate documents. */
@view-transition { navigation:auto }
@media (prefers-reduced-motion:no-preference) {
  html:not([data-motion]) .main { view-transition-name:workspace-surface }
  html:has(.main)::view-transition-old(root) { display:none }
  html:has(.main)::view-transition-new(root) { animation:none }
}
@media (prefers-reduced-motion:reduce) {
  ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation:none }
}

.transfer-quote {margin:8px 0 18px;padding:12px;border:1px solid var(--line);border-radius:10px;background:#f7f9ef;color:var(--muted);font-size:13px;overflow-x:auto}
.transfer-quote table {width:100%;min-width:0;border-collapse:collapse;font-variant-numeric:tabular-nums}
.transfer-quote caption {text-align:left;font-weight:650;color:var(--ink);padding-bottom:6px}
.transfer-quote :is(th,td) {white-space:normal;padding:7px 3px;text-align:right;font-size:12px}
.transfer-quote :is(th,td):first-child {text-align:left}
.quote-total {display:grid;gap:4px;padding-top:10px;font-variant-numeric:tabular-nums}
.quote-total strong {color:var(--ink);font-size:15px}

@keyframes charge-hover {
  from { transform:translateY(3px) rotate(-15deg) }
  to { transform:translateY(-5px) rotate(-9deg) }
}
@keyframes charge-orbit {
  to { offset-distance:100% }
}
@media (prefers-reduced-motion:no-preference) {
  :is(.welcome, .hero-visual, .auth-art) .charge-cube { animation:charge-hover 2.8s ease-in-out infinite alternate }
  @supports (offset-path:ellipse(50% 50% at 50% 50%)) {
    :is(.welcome, .hero-visual, .auth-art) .spark { visibility:hidden }
    :is(.welcome, .hero-visual, .auth-art) .orbit::after {
      content:'✧';
      position:absolute;
      top:0;
      left:0;
      offset-path:ellipse(50% 50% at 50% 50%);
      offset-rotate:0deg;
      color:#8a9d38;
      font-size:16px;
      line-height:1;
      animation:charge-orbit 12s linear infinite;
    }
    :is(.welcome, .hero-visual, .auth-art) .orbit:nth-child(2)::after {
      content:'✦';
      font-size:10px;
      animation-duration:17s;
      animation-delay:-8s;
      animation-direction:reverse;
    }
  }
}

[data-video-prices]{min-width:0;margin:12px 0;padding:12px;border:1px solid #dfe5d7;border-radius:10px}
[data-video-prices] legend{font-weight:600;padding:0 6px}
.spec-table-wrap{overflow-x:auto}
.spec-table-wrap th,.spec-table-wrap td{padding:6px 4px}
.spec-table-wrap input{width:100%;min-width:5em;padding:6px}

.benefit-dialog{box-sizing:border-box;width:min(440px,92vw);max-height:90vh;margin:auto;padding:24px;border:1px solid #dce3d5;border-radius:16px;color:#263521;background:white}
.benefit-dialog::backdrop{background:rgb(25 38 23 / 45%)}
.benefit-dialog h2{margin:0 0 16px;font-size:22px}
.benefit-dialog p{margin:0 0 16px;overflow-wrap:anywhere}
.benefit-dialog img{display:block;width:100%;border-radius:10px}
.dialog-buttons,.coupon-actions{display:flex;align-items:center;gap:10px}
.dialog-buttons{justify-content:flex-end;margin-top:20px}
.admin-shell:is([data-view="channels"],[data-view="models"]) .panel td{font-size:14px;font-weight:400;color:#334431;font-variant-numeric:tabular-nums}
.admin-shell:is([data-view="channels"],[data-view="models"]) .panel th{font-size:13px;font-weight:600;color:#445340}
.admin-shell:is([data-view="channels"],[data-view="models"]) .panel td strong{font-size:15px;font-weight:650}
.admin-shell:is([data-view="channels"],[data-view="models"]) .panel td .muted{font-size:13px;color:#586654;font-weight:400}
.admin-shell:is([data-view="channels"],[data-view="models"]) .panel .row-actions button{font-size:14px;font-weight:400}

.logo-settings{min-width:0;margin:12px 0 18px;padding:14px;border:1px solid #dce3d5;border-radius:12px}
.logo-settings legend{padding:0 6px;font-weight:600}
.logo-settings [hidden]{display:none}
.logo-summary,.logo-buttons,.logo-crop{display:flex;align-items:center;gap:12px}
.logo-summary small,.logo-tools small{display:block;color:#586554;margin-top:4px}
.logo-buttons{margin-top:12px;flex-wrap:wrap}
.logo-crop{flex-wrap:wrap;margin-top:14px;padding-top:14px;border-top:1px solid #e2e7dc}
.logo-crop canvas{width:152px;height:152px;max-width:100%;border-radius:6px;outline:1px solid #d5dccf;touch-action:none;cursor:grab;background:repeating-conic-gradient(#ecede8 0 25%,white 0 50%) 0 0/16px 16px}
.logo-crop canvas:focus-visible{outline:2px solid #66843d}
.logo-crop canvas:active{cursor:grabbing}
.logo-tools{flex:1 1 145px}
.logo-tools label{display:block;font-weight:500}
.logo-tools output{float:right;font-variant-numeric:tabular-nums}
.logo-tools input{display:block;width:100%;margin:8px 0;accent-color:#607d3c}
.logo-tools button{margin-top:8px}

.tier-editor {min-width:0;margin:16px 0;padding:0;border:0}
.tier-editor legend {font-weight:650}
.tier-editor p,.tier-row output {color:var(--muted);font-size:13px}
.tier-row {display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:6px 12px;border-top:1px solid var(--line);padding:12px 0;align-items:center}
.tier-row .field {margin:0}
.tier-row input {width:100%;min-width:0}
.tier-row output {grid-column:1;white-space:normal}
.tier-row [data-remove-tier] {justify-self:end}

@media screen {
  table > thead {
    position: relative;
    z-index: 1;
    transform: translateY(var(--header-scroll-y, 0px));
    background: var(--surface);
    box-shadow: 0 1px var(--line);
  }
}
