:root{--ink:#202324;--muted:#6c7275;--faint:#f7f8f8;--line:#e3e6e5;--green:#25704e;--green-bg:#eef7f1;--red:#b2453d;--red-bg:#fcf0ee;--amber:#9b6b16;--amber-bg:#fcf6e8;--sidebar:216px}
*{box-sizing:border-box}html{scroll-padding-bottom:90px}html,body{margin:0;min-height:100%;background:var(--faint);color:var(--ink);font:15px/1.5 -apple-system,BlinkMacSystemFont,"Helvetica Neue","PingFang SC","Microsoft YaHei",sans-serif}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit;background:#fff;border:1px solid var(--line);border-radius:7px;padding:9px 15px;min-height:40px;white-space:nowrap}button:hover{background:#f2f4f3}button:disabled{opacity:.45;cursor:default}button.primary{background:var(--ink);color:#fff;border-color:var(--ink);font-weight:500}button.primary:hover{background:#363a3b}button.ghost{border-color:transparent;background:transparent}button.ghost:hover{background:#f2f4f3}button.small{padding:6px 10px;font-size:13px;min-height:34px}button.icon{padding:8px;display:inline-flex;align-items:center;justify-content:center;background:transparent;border-color:transparent;min-width:36px;min-height:36px}button.icon:hover{background:#eef1ef}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--green);outline-offset:3px}a{color:inherit;text-decoration:none}svg{width:19px;height:19px;display:block;flex-shrink:0}input,select,textarea{width:100%;padding:10px 12px;background:#fff;color:var(--ink);border:1px solid #d7dcda;border-radius:7px;min-height:43px}input[type=checkbox]{width:18px;min-height:18px;height:18px;accent-color:var(--ink);margin:0}textarea{resize:vertical;line-height:1.75}label{display:flex;flex-direction:column;gap:8px;font-size:14px}label.checkbox{flex-direction:row;align-items:center;gap:10px;min-height:30px}h1,h2,h3,p{margin:0}h1{font-size:28px;font-weight:600;letter-spacing:-.6px;line-height:1.25}h2{font-size:21px;font-weight:600}h3{font-size:16px;font-weight:600}.muted{color:var(--muted)}.field-error{color:var(--red);font-size:14px;white-space:pre-line;overflow-wrap:anywhere}.field-error:empty{display:none}.field-hint{font-size:13px;color:var(--muted)}.brand-mark{width:34px;height:34px;flex-shrink:0}.wordmark{font-size:26px;letter-spacing:-1px;font-weight:650;line-height:1}.brand{display:flex;align-items:center;gap:11px;padding:0 12px;margin-bottom:42px;min-height:45px}.brand-type{display:grid;gap:6px}.brand-caption{font-size:12px;color:var(--muted);letter-spacing:.3px}.shell{display:flex;min-height:100vh}.sidebar{width:var(--sidebar);padding:28px 16px 20px;position:fixed;inset:0 auto 0 0;border-right:1px solid var(--line);background:var(--faint);display:flex;flex-direction:column;z-index:20}.sidebar nav{display:grid;gap:6px}.sidebar button{display:flex;align-items:center;gap:13px;border:0;background:none;padding:12px 14px;text-align:left;font-size:15px;width:100%;color:var(--muted);min-height:46px}.sidebar button:hover{background:#ebeeec}.sidebar button.active{background:#e8ece9;color:var(--ink);font-weight:600}.sidebar-bottom{margin-top:auto;display:flex;flex-direction:column;gap:8px}.account-label{font-size:13px;color:var(--muted);padding:0 14px 5px}.workspace{margin-left:var(--sidebar);width:calc(100% - var(--sidebar));min-width:0;background:#fff;min-height:100vh}.topbar{height:68px;border-bottom:1px solid #edf0ee;display:flex;align-items:center;justify-content:space-between;padding:0 40px;gap:20px;color:var(--muted);font-size:13px}.sync-state{display:flex;align-items:center;gap:7px;min-width:0;overflow-wrap:anywhere;color:var(--green)}.sync-state:before{content:"";width:6px;height:6px;background:currentColor;border-radius:50%;flex-shrink:0}.sync-state.error{color:var(--red)}.page{padding:38px 40px 56px;max-width:1700px;margin:auto}.page-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:30px}.page-heading p{margin-top:9px;color:var(--muted);font-size:14px}.heading-action{display:flex;align-items:center;gap:14px;flex-shrink:0}.save-state{font-size:13px;color:var(--green);max-width:240px;overflow-wrap:anywhere}.save-state.error{color:var(--red)}.save-state.pending{color:var(--amber)}.save-state:empty{display:none}.toolbar{display:flex;justify-content:space-between;gap:20px;margin-bottom:16px;align-items:center}.search{width:270px;max-width:100%;position:relative}.search input{padding-left:36px;font-size:14px;min-height:40px}.search svg{position:absolute;top:12px;left:12px;width:16px;height:16px;color:var(--muted)}.count-label{font-size:13px;color:var(--muted);white-space:nowrap}.table-wrap{width:100%;border:1px solid var(--line);border-radius:10px;overflow:hidden}table{width:100%;border-collapse:collapse;text-align:left;table-layout:fixed}th{font-size:13px;font-weight:500;color:var(--muted);background:var(--faint);padding:13px 14px;border-bottom:1px solid var(--line)}td{padding:22px 14px;border-bottom:1px solid #edf0ee;font-size:15px;overflow-wrap:anywhere}tr:last-child td{border-bottom:0}tbody tr:hover{background:#fcfdfc}th.order,td.order{width:66px;color:#8b9390;padding:14px 3px 14px 6px}.order-content{display:flex;align-items:center;gap:1px;font-size:13px}.drag-handle{cursor:grab;color:#9ba39e;touch-action:none;user-select:none}.drag-handle svg{width:12px;height:18px}.row-name{font-weight:600;font-size:15px;line-height:1.5;color:var(--ink);display:block;background:none;border:0;padding:0;text-align:left;min-height:30px;white-space:normal;overflow-wrap:anywhere}.row-secondary{font-size:13px;color:var(--muted);margin-top:4px;line-height:1.5}.usage-value{font-variant-numeric:tabular-nums;white-space:normal}.usage-track{width:115px;max-width:100%;height:4px;background:#edf0ee;margin-top:9px;border-radius:3px;overflow:hidden}.usage-track span{display:block;height:100%;background:var(--green)}.usage-track.warning span{background:var(--amber)}.usage-track.danger span{background:var(--red)}.badge{display:inline-flex;align-items:center;justify-content:center;gap:7px;font-size:13px;padding:5px 9px;border:1px solid transparent;border-radius:6px;color:var(--muted);background:#f0f2f1;white-space:nowrap}.badge:before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor}.badge.active{color:var(--green);background:var(--green-bg)}.badge.expired,.badge.depleted{color:var(--red);background:var(--red-bg)}button.badge{min-height:34px}button.badge:hover{border-color:currentColor;background:#e8f1eb}button.badge.paused:hover{background:#e4e8e5}button.badge.expired:hover,button.badge.depleted:hover{background:#f9e5e2}.status-cell{width:104px}.action-cell{width:150px}.row-actions{display:flex;align-items:center;justify-content:flex-end;gap:3px}.row-actions button{flex-shrink:0}.expiry-value{font-variant-numeric:tabular-nums}.extend-button{display:inline-flex;align-items:center;margin-top:4px;padding:3px 0!important;min-height:28px!important;color:var(--muted);text-decoration:underline;text-decoration-color:#c4ccc6;text-underline-offset:4px}.extend-button:hover{color:var(--green);background:transparent!important}.cell-end{text-align:right}.empty{padding:70px 25px;text-align:center;color:var(--muted)}.empty p{margin-bottom:15px}.table-footer{font-size:13px;color:var(--muted);display:flex;justify-content:space-between;margin-top:16px;gap:16px}.dragging{opacity:.35}.drop-target{box-shadow:inset 0 2px var(--ink)}.fixed-nodes{display:flex;flex-wrap:wrap;gap:9px;align-items:center;margin:0 0 24px;padding:15px 17px;border:1px solid var(--line);border-radius:8px;background:var(--faint);font-size:13px;color:var(--muted)}.fixed-nodes .label{margin-right:4px}.node-chip{padding:5px 10px;border:1px solid var(--line);border-radius:5px;background:#fff;color:var(--ink)}.rule-columns{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px}.rule-panel{border:1px solid var(--line);border-radius:10px;overflow:hidden;align-self:start;min-width:0}.rule-header{padding:19px 19px 15px;display:flex;gap:12px;align-items:center;justify-content:space-between}.rule-header p{font-size:13px;color:var(--muted);margin-top:4px}.rule-tools{display:flex;gap:0}.rule-search{padding:0 19px 16px}.rule-search input{font-size:14px;min-height:40px}.rule-list{border-top:1px solid #edf0ee;min-height:136px}.rule-row{padding:13px 8px;display:flex;align-items:center;gap:2px;border-bottom:1px solid #edf0ee;min-height:70px}.rule-row:last-child{border-bottom:0}.rule-text{min-width:0;flex:1;padding:0 5px}.rule-text strong{display:block;font-weight:500;font-size:14px;overflow-wrap:anywhere;line-height:1.5}.rule-text small{font-size:12px;color:var(--muted);display:block;margin-top:4px}.rule-destination{font-size:12px;max-width:190px;overflow-wrap:anywhere;white-space:normal;line-height:1.4;color:#53635b;background:#f1f5f2;padding:4px 7px;border-radius:4px;flex-shrink:0}.rule-destination.reject{color:var(--red);background:var(--red-bg)}.rule-destination.proxy{color:#526579;background:#f0f4f8}.rule-row.disabled{opacity:.5}.rule-pagination{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--line);padding:10px 17px;font-size:13px;color:var(--muted)}.rule-pagination>div{display:flex;gap:5px;align-items:center}.rule-add{padding:13px 17px;border-top:1px solid #edf0ee;display:flex;gap:5px}.rule-empty{padding:50px 18px;color:var(--muted);text-align:center;font-size:14px}.overlay{position:fixed;inset:0;background:#20232440;display:flex;justify-content:flex-end;z-index:40}.drawer{width:480px;max-width:100%;height:100%;height:100dvh;background:#fff;display:flex;flex-direction:column;box-shadow:-12px 0 35px #0000000a;animation:drawer-in .13s ease-out}.drawer-head{padding:23px 28px;display:flex;justify-content:space-between;gap:12px;align-items:center;border-bottom:1px solid var(--line)}.drawer-head h2{font-size:21px}.drawer-body{padding:26px 28px;overflow:auto;overscroll-behavior:contain;flex:1;display:flex;flex-direction:column;gap:22px}.drawer-body form{display:flex;flex-direction:column;gap:23px}.drawer-footer{border-top:1px solid var(--line);padding:18px 28px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px;align-items:center}.drawer-footer .actions{display:flex;gap:9px;margin-left:auto}.drawer-footer .field-error{width:100%}.form-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:15px}.form-divider{height:1px;background:var(--line);margin:2px 0}.inline-field{display:flex;gap:10px;align-items:center}.inline-field input{flex:1;min-width:0}.inline-field select{width:116px}.drawer-note{font-size:13px;color:var(--muted);line-height:1.8;overflow-wrap:anywhere}.result-block{background:var(--faint);padding:12px 14px;border-radius:6px;font-size:14px;color:var(--muted);line-height:1.8}.qr-block{text-align:center}.qr-block img{width:220px;height:220px;max-width:100%}.url-field{font-size:14px;word-break:break-all;background:var(--faint);border:1px solid var(--line);border-radius:6px;padding:12px 14px;color:var(--muted)}.link-buttons{display:grid;gap:9px}.link-buttons button{text-align:left;white-space:normal}.actions-divider{border-top:1px solid var(--line);padding-top:20px}.danger-action{color:var(--red)}.system-layout{max-width:900px}.settings-section{padding:28px 0;border-bottom:1px solid var(--line)}.settings-section:first-child{padding-top:0}.settings-section h3{margin-bottom:22px}.settings-row{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:22px;font-size:15px}.settings-row:last-child{margin-bottom:0}.settings-row .muted{font-size:13px;margin-top:5px}.settings-row>span:last-child{text-align:right}.status-bars{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:28px}.status-bars .usage-track{width:100%;height:5px;margin-top:12px}.status-number{display:flex;justify-content:space-between;font-size:14px;color:var(--muted)}.events{display:grid;gap:15px;font-size:14px}.event{display:flex;gap:24px}.event time{width:130px;flex-shrink:0;color:var(--muted);font-variant-numeric:tabular-nums}.event span{overflow-wrap:anywhere}dialog{border:1px solid var(--line);border-radius:12px;padding:28px;width:420px;max-width:calc(100% - 32px);box-shadow:0 15px 60px #0002}dialog::backdrop{background:#20232440}dialog h2{font-size:20px;margin-bottom:12px}dialog p{font-size:15px;line-height:1.75}.dialog-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:28px}.login-screen{min-height:100vh;min-height:100dvh;display:flex;justify-content:center;align-items:center;background:#fff;padding:32px 0}.login-form{width:350px;max-width:calc(100% - 48px);display:flex;flex-direction:column;gap:23px}.login-brand{display:flex;align-items:center;gap:12px;margin-bottom:16px}.login-brand .brand-mark{width:42px;height:42px}.login-brand .wordmark{font-size:34px}.login-form h1{font-size:24px;margin-bottom:8px}.login-form button{min-height:46px}.menu{position:fixed;background:#fff;border:1px solid var(--line);border-radius:9px;padding:6px;min-width:175px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow:auto;box-shadow:0 8px 28px #20232418;z-index:50}.menu button{display:flex;align-items:center;gap:9px;width:100%;text-align:left;background:none;border:0;border-radius:5px;padding:9px 12px;font-size:14px;min-height:39px}.menu button:hover{background:var(--faint)}.menu button[data-menu-action=delete],.menu button[data-menu-action=rotate],.menu button[data-menu-action=reset]{color:var(--red)}[hidden]{display:none!important}body:has(.overlay:not([hidden])){overflow:hidden}@keyframes drawer-in{from{transform:translateX(20px);opacity:.7}to{transform:translateX(0);opacity:1}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media(min-width:1600px){.page{padding-top:46px}.rule-row{padding-top:14px;padding-bottom:14px}}
@media(max-width:1199px) and (min-width:768px){:root{--sidebar:80px}.sidebar{padding:26px 10px 20px}.brand{padding:0;justify-content:center;margin-bottom:35px}.brand-type{display:none}.sidebar button{padding:11px 6px;justify-content:center;flex-direction:column;gap:6px;font-size:12px}.sidebar nav{gap:7px}.sidebar .account-label{display:none}.sidebar-bottom .nav-label{display:none}.sidebar button svg{width:21px;height:21px}.topbar{padding:0 28px}.page{padding:32px 28px 48px}.rule-columns{grid-template-columns:minmax(0,1fr);max-width:900px}.rule-destination{max-width:180px}th,td{padding-left:10px;padding-right:10px}.action-cell{width:122px}.status-cell{width:97px}th.order,td.order{width:55px}.order .icon{min-width:27px;padding:6px}.row-actions .small{padding-left:5px;padding-right:5px}}
@media(max-width:767px){:root{--sidebar:0px}html{scroll-padding-top:70px}.shell{display:block}.sidebar{position:sticky;top:0;width:100%;height:65px;flex-direction:row;align-items:center;border-right:0;border-bottom:1px solid var(--line);padding:10px 20px;background:#fff}.brand{margin:0;padding:0;min-height:40px;gap:9px}.brand-mark{width:29px;height:29px}.wordmark{font-size:25px}.brand-caption{display:none}.sidebar nav{position:fixed;inset:auto 0 0;display:grid;grid-template-columns:repeat(4,1fr);gap:2px;padding:7px 12px max(9px,env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--line);box-shadow:0 -3px 12px #20232404;z-index:30}.sidebar nav button{width:100%;flex-direction:column;justify-content:center;gap:4px;padding:6px;font-size:12px;min-height:50px;border-radius:8px}.sidebar nav button.active{background:#eef2ef}.sidebar nav svg{width:21px;height:21px}.sidebar-bottom{margin:0 0 0 auto;display:flex;flex-direction:row;align-items:center;gap:7px}.sidebar-bottom .account-label{padding:0;font-size:12px}.sidebar-bottom button{width:42px;height:42px;padding:10px;min-height:42px}.sidebar-bottom .nav-label{display:none}.workspace{margin:0;width:100%}.topbar{height:43px;padding:0 20px;font-size:12px;border-bottom:0;gap:10px}.topbar #breadcrumb{display:none}.topbar .sync-state{margin-left:auto;font-size:12px}.page{padding:16px 20px calc(100px + env(safe-area-inset-bottom));max-width:100%}.page-heading{margin-bottom:24px;gap:12px;align-items:center;flex-wrap:wrap}.page-heading h1{font-size:26px}.page-heading p{font-size:14px;margin-top:8px;max-width:260px}.heading-action{gap:8px;margin-left:auto;position:relative}.heading-action .primary{padding:9px 13px;min-height:44px;font-size:14px}.save-state{position:absolute;right:0;top:calc(100% + 4px);max-width:210px;font-size:12px;white-space:nowrap}.toolbar{gap:12px;margin-bottom:18px}.search{width:auto;flex:1}.search input{font-size:16px;min-height:44px}.search svg{top:14px}.count-label{font-size:13px}.table-wrap{border:0;border-radius:0;overflow:visible}.table-wrap table,.table-wrap tbody{display:block;width:100%}.table-wrap thead{display:none}.table-wrap tr{display:grid;grid-template-columns:40px minmax(0,1fr) auto;grid-template-areas:"order name status" ". primary secondary" ". actions actions";column-gap:8px;row-gap:15px;padding:20px 0 19px;border-top:1px solid var(--line);width:100%;background:#fff}.table-wrap tr:last-child{border-bottom:1px solid var(--line)}.table-wrap td{display:block;border:0;padding:0!important;width:auto;min-width:0;font-size:15px;align-self:start}.table-wrap .order{grid-area:order;align-self:center}.order-content{flex-direction:column;gap:0;font-size:12px}.order .icon{min-width:36px;min-height:30px;padding:5px}.table-wrap .name-cell{grid-area:name;align-self:center}.row-name{font-size:17px;line-height:1.5}.name-cell .row-secondary{display:block}.table-wrap .status-cell{grid-area:status;align-self:center}.table-wrap .primary-cell{grid-area:primary}.table-wrap .secondary-cell{grid-area:secondary}.table-wrap .primary-cell:before,.table-wrap .secondary-cell:before{content:attr(data-label);display:block;color:var(--muted);font-size:13px;margin-bottom:5px}.table-wrap .action-cell{grid-area:actions}.row-actions{justify-content:flex-start;gap:8px;margin-left:-10px}.row-actions button.small{min-height:42px;font-size:14px;padding:8px 10px}.row-actions button.icon{margin-left:auto;width:44px;min-height:42px}.row-secondary{font-size:13px;margin-top:3px}.badge{font-size:13px;gap:5px;padding:7px 9px}button.badge{min-height:42px}.expiry-value{display:inline}.extend-button{margin-top:0;margin-left:16px;min-height:36px!important;padding:4px 6px!important;vertical-align:baseline}.usage-track{width:100%;max-width:230px}.table-footer{font-size:12px;line-height:1.7;flex-direction:column;gap:5px;margin-top:15px}.fixed-nodes{padding:13px 14px;gap:8px;margin-bottom:22px}.fixed-nodes .label{width:100%;font-size:13px}.node-chip{font-size:12px;padding:5px 7px}.rule-columns{grid-template-columns:minmax(0,1fr);gap:24px}.rule-header{padding:16px 12px 12px;gap:4px;align-items:flex-start}.rule-header h3{font-size:16px}.rule-tools button.small{font-size:13px;padding:5px 7px;min-height:38px}.rule-search{padding:0 12px 14px}.rule-search input{font-size:16px;min-height:44px}.rule-row{display:grid;grid-template-columns:30px minmax(0,1fr) 40px;grid-template-areas:"drag text more" ". target more";gap:6px 3px;padding:14px 8px;min-height:88px}.rule-row .drag-handle{grid-area:drag;min-width:30px;padding:5px;align-self:start}.rule-row .rule-text{grid-area:text;padding:0 6px}.rule-text strong{font-size:15px}.rule-text small{font-size:12px}.rule-row>.icon:last-child{grid-area:more;min-height:44px;align-self:center}.rule-destination{grid-area:target;justify-self:start;max-width:100%;font-size:12px;margin-left:6px}.rule-pagination{padding:10px 12px;font-size:12px;gap:6px}.rule-pagination button.small{padding:5px 7px;min-height:40px}.rule-add{padding:10px 12px;gap:3px}.rule-add button.small{min-height:44px;font-size:14px}.drawer{width:100%;height:100dvh;box-shadow:none}.drawer-head{padding:14px 20px}.drawer-head h2{font-size:21px}.drawer-head .icon{min-height:44px;min-width:44px}.drawer-body{padding:24px 20px}.drawer-footer{padding:14px 20px max(16px,env(safe-area-inset-bottom))}.drawer-footer button{min-height:44px;padding:10px 20px}input,select,textarea{font-size:16px;min-height:46px}.drawer-body label{font-size:15px}.field-hint,.drawer-note{font-size:13px}.form-grid{gap:12px}.menu button{min-height:44px;font-size:15px}.settings-section{padding:26px 0}.settings-row{align-items:flex-start;gap:16px;font-size:15px}.settings-row .small{min-height:42px;flex-shrink:0}.settings-row>span:last-child{max-width:62%}.status-bars{grid-template-columns:1fr;gap:24px}.status-number{font-size:14px}.event{gap:15px;font-size:13px}.event time{width:114px}.login-form{max-width:calc(100% - 48px)}.login-form label{font-size:15px}.login-form h1{font-size:23px}}
@media(max-width:359px){.sidebar{padding-left:14px;padding-right:14px}.page{padding-left:14px;padding-right:14px}.topbar{padding-left:14px;padding-right:14px}.table-wrap tr{grid-template-columns:32px minmax(0,1fr) auto;column-gap:5px}.rule-tools button.small{padding-left:5px;padding-right:5px}.rule-header h3{font-size:15px}.page-heading h1{font-size:24px}.sidebar-bottom .account-label{display:none}.drawer-body,.drawer-head,.drawer-footer{padding-left:16px;padding-right:16px}}

@media(max-width:767px){.table-wrap tr{grid-template-columns:32px minmax(0,1fr) minmax(90px,34%);row-gap:18px}.table-wrap .status-cell{justify-self:end}.table-wrap tr[data-kind="isps"]{grid-template-areas:"order name status" ". primary primary" ". secondary secondary" ". actions actions"}.table-wrap .expiry-time{margin-top:3px}.extend-button{display:block;margin:3px 0 0 -6px}.table-wrap button.badge{min-height:44px}.rule-panel:last-child{order:-1}}

@media(max-width:767px){#page:has(.rule-columns) .page-heading{position:sticky;top:65px;z-index:10;background:#fff;padding:12px 0;margin-top:-12px}.rule-row .drag-handle{min-height:44px}.rule-text strong{padding-top:2px}}

.boot-screen{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;background:#fff;color:var(--muted);font-size:15px}.boot-screen .brand-mark{width:40px;height:40px}
