:root{color-scheme:light;--bg:#f5f7fb;--surface:#fff;--surface-alt:#f8fafc;--text:#1b263b;--muted:#68768b;--border:#e2e8f0;--accent:#3f62d8;--accent-hover:#3151bc;--accent-soft:#edf1ff;--green:#16805d;--green-soft:#e9f7f0;--red:#c83d48;--red-soft:#fff0f1;--amber:#a06a18;--amber-soft:#fff8e8;--shadow:0 8px 30px #1c2b4b07;--radius:16px;--font:Inter,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif}
:root[data-theme=dark]{color-scheme:dark;--bg:#10151f;--surface:#181f2c;--surface-alt:#1d2636;--text:#e8edf6;--muted:#9caac0;--border:#2b3548;--accent:#94aaff;--accent-hover:#b0bfff;--accent-soft:#283451;--green:#79d7b2;--green-soft:#203c35;--red:#ff9da7;--red-soft:#412830;--amber:#e7bf77;--amber-soft:#3e3425;--shadow:0 8px 30px #00000012}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.6 var(--font);-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}a{color:var(--accent)}h1,h2,h3,p{margin:0}h1{font-size:27px;line-height:1.4;letter-spacing:-.6px}h2{font-size:17px;line-height:1.5}h3{font-size:15px}small{font-size:12px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--accent);outline-offset:3px}input,select,textarea{width:100%;min-width:0;min-height:43px;padding:9px 12px;border:1px solid var(--border);border-radius:9px;background:var(--surface);color:var(--text)}textarea{resize:vertical;min-height:120px}input[type=checkbox]{width:17px;min-height:17px;accent-color:var(--accent)}input:disabled{background:var(--surface-alt);color:var(--muted)}code,.mono{font-family:"SFMono-Regular",Consolas,monospace;font-size:.92em;overflow-wrap:anywhere}.muted{color:var(--muted)}.small{font-size:12px}.hidden,[hidden]{display:none!important}.skip-link{position:fixed;top:-80px;left:16px;z-index:100;background:var(--surface);padding:12px;border-radius:8px}.skip-link:focus{top:12px}.initial-state{min-height:100vh;display:grid;place-content:center;justify-items:center;gap:20px}.noscript{margin:24px;text-align:center}
.app-header{height:78px;background:var(--surface);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 max(28px,calc((100vw - 1320px)/2));gap:20px}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--text)}.brand-mark{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:var(--accent);color:var(--surface);font-weight:800;letter-spacing:-1px;font-size:15px}.brand-name{font-weight:700;font-size:16px}.brand-sub{display:block;color:var(--muted);font-size:11px;letter-spacing:1px}.header-tools{display:flex;align-items:center;gap:13px}.theme-control{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:12px}.theme-control select{min-height:34px;padding:5px 25px 5px 9px;font-size:12px;width:auto}.user-label{display:flex;align-items:center;gap:7px;font-size:13px;max-width:230px}.user-label .username{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.shell{max-width:1320px;margin:0 auto;display:grid;grid-template-columns:218px minmax(0,1fr);gap:38px;padding:36px 28px 60px}.sidebar{align-self:start;position:sticky;top:28px}.nav-caption{font-size:11px;color:var(--muted);letter-spacing:1.5px;padding:0 14px;margin:8px 0 9px}.nav-caption.admin{margin-top:30px}.nav-button{width:100%;display:flex;align-items:center;gap:12px;border:0;background:transparent;color:var(--muted);border-radius:10px;padding:12px 14px;text-align:left;margin:3px 0;font-weight:550}.nav-button:hover{background:var(--surface)}.nav-button[aria-current=page]{background:var(--accent-soft);color:var(--accent);font-weight:700}.nav-icon{width:19px;height:19px;display:grid;place-items:center;font-size:18px}.sidebar-note{margin:25px 13px 0;padding-top:20px;border-top:1px solid var(--border);font-size:12px;color:var(--muted)}.content{min-width:0}.page-heading{margin-bottom:26px;display:flex;align-items:center;justify-content:space-between;gap:18px}.page-heading p{color:var(--muted);margin-top:6px}.eyebrow{font-size:11px;font-weight:700;letter-spacing:1.5px;color:var(--accent);margin-bottom:6px}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:26px;margin-bottom:20px}.card-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}.card-heading p{color:var(--muted);font-size:13px;margin-top:4px}.button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:9px 17px;border-radius:9px;border:1px solid var(--border);background:var(--surface);color:var(--text);font-weight:600;white-space:nowrap;text-decoration:none;line-height:1.4}.button:hover{background:var(--surface-alt)}.button.primary{border-color:var(--accent);background:var(--accent);color:var(--surface)}.button.primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}.button.danger{color:var(--red);background:var(--red-soft);border-color:transparent}.button.quiet{background:transparent;border-color:transparent;color:var(--muted)}.button.compact{min-height:32px;padding:6px 10px;font-size:12px}.button-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.badge{display:inline-flex;align-items:center;gap:5px;border-radius:99px;padding:3px 9px;font-size:11px;font-weight:600;white-space:nowrap;background:var(--surface-alt);color:var(--muted)}.badge.good{background:var(--green-soft);color:var(--green)}.badge.warning{background:var(--amber-soft);color:var(--amber)}.badge.bad{background:var(--red-soft);color:var(--red)}.badge.accent{background:var(--accent-soft);color:var(--accent)}.status-dot{width:6px;height:6px;border-radius:50%;background:currentColor}.ip-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.ip-panel{border:1px solid var(--border);border-radius:12px;padding:20px;background:var(--surface-alt);min-height:146px}.ip-panel-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:17px}.ip-family{font-size:12px;font-weight:700;letter-spacing:1px;color:var(--muted)}.ip-address{font-family:Consolas,monospace;font-size:20px;line-height:1.6;overflow-wrap:anywhere;font-weight:600}.ip-panel p{margin-top:5px;font-size:12px;color:var(--muted)}.authorize-actions{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-top:23px;margin-top:23px;border-top:1px solid var(--border)}.authorize-actions p{font-size:12px;color:var(--muted)}.authorize-actions .button{min-width:155px}.info-strip{display:flex;gap:12px;padding:15px 17px;margin-top:18px;border-radius:10px;background:var(--accent-soft);color:var(--accent);font-size:13px;overflow-wrap:anywhere}.info-strip.warning{background:var(--amber-soft);color:var(--amber)}.info-strip.good{background:var(--green-soft);color:var(--green)}.info-strip.bad{background:var(--red-soft);color:var(--red)}.details-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:0}.detail dt{color:var(--muted);font-size:12px;margin-bottom:7px}.detail dd{margin:0;font-size:17px;font-weight:650}.detail dd.small-value{font-size:13px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px}.field{display:block;margin-bottom:17px}.form-grid .field{margin-bottom:0}.field-label{display:block;font-weight:600;font-size:13px;margin-bottom:7px}.field-hint{display:block;color:var(--muted);font-size:12px;margin-top:6px}.checkbox-label{display:flex;align-items:center;gap:8px;margin:18px 0}.form-error{color:var(--red);font-size:13px;margin:13px 0;overflow-wrap:anywhere}.password-form{max-width:480px}.divider{height:1px;border:0;background:var(--border);margin:24px 0}.empty-state{text-align:center;padding:35px 15px;color:var(--muted)}.empty-state .empty-title{color:var(--text);font-weight:650;margin-bottom:7px}.table-wrap{overflow-x:auto;margin:0 -2px}.data-table{width:100%;border-collapse:collapse;text-align:left;font-size:13px}.data-table th{padding:11px 13px;background:var(--surface-alt);color:var(--muted);font-weight:550;font-size:12px;white-space:nowrap}.data-table td{padding:15px 13px;border-bottom:1px solid var(--border);vertical-align:middle}.data-table tr:last-child td{border-bottom:0}.data-table td.address{max-width:310px;overflow-wrap:anywhere}.cell-sub{display:block;color:var(--muted);font-size:11px;margin-top:3px}.row-actions{display:flex;gap:4px;flex-wrap:wrap}.countdown{color:var(--green);font-weight:600}.countdown.expired{color:var(--muted)}.header-rule{display:grid;grid-template-columns:minmax(110px,1fr) 100px minmax(150px,1.5fr) 35px;gap:10px;align-items:start;margin-bottom:12px}.header-rule .button{min-width:35px;padding:9px 5px}.rules-labels{display:grid;grid-template-columns:minmax(110px,1fr) 100px minmax(150px,1.5fr) 35px;gap:10px;color:var(--muted);font-size:12px;margin-bottom:8px}.section-footer{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-top:20px;padding-top:19px;border-top:1px solid var(--border)}
.auth-layout{max-width:1040px;margin:0 auto;min-height:calc(100vh - 78px);display:grid;grid-template-columns:1fr 440px;align-items:center;gap:80px;padding:56px 28px}.auth-intro h1{font-size:40px;line-height:1.4;letter-spacing:-1px;margin-bottom:18px}.auth-intro>p{color:var(--muted);font-size:15px;max-width:350px;line-height:1.9}.auth-note{display:flex;gap:12px;align-items:flex-start;margin-top:32px;max-width:340px;color:var(--muted);font-size:13px}.auth-note .note-symbol{color:var(--green);background:var(--green-soft);padding:4px 9px;border-radius:8px}.auth-card{padding:32px}.auth-card h2{font-size:23px;margin-bottom:6px}.auth-description{color:var(--muted);font-size:13px;margin-bottom:25px}.auth-card .button.primary{width:100%;margin-top:5px}.auth-foot{margin-top:20px;color:var(--muted);font-size:12px;text-align:center}.notifications{position:fixed;right:24px;bottom:24px;width:min(420px,calc(100vw - 32px));z-index:70;display:grid;gap:10px;pointer-events:none}.toast{background:var(--surface);border:1px solid var(--border);border-left:4px solid var(--green);box-shadow:0 8px 35px #0002;border-radius:10px;padding:14px 15px;display:flex;gap:12px;align-items:flex-start;pointer-events:auto;font-size:13px}.toast.error{border-left-color:var(--red)}.toast-message{flex:1;overflow-wrap:anywhere}.toast-close{border:0;background:transparent;color:var(--muted);padding:0 3px;font-size:18px;line-height:1.2}.modal{width:min(530px,calc(100vw - 32px));max-height:calc(100dvh - 48px);padding:0;border:1px solid var(--border);border-radius:17px;background:var(--surface);color:var(--text);box-shadow:0 20px 90px #0003;overflow:auto}.modal::backdrop{background:#0b142080;backdrop-filter:blur(3px)}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:23px 25px 0}.modal-body{padding:20px 25px 25px}.modal-body>p{color:var(--muted);margin-bottom:20px}.modal-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:24px}.loading-line{height:3px;border-radius:3px;background:var(--accent-soft);overflow:hidden;margin:15px 0}.loading-line:after{content:"";display:block;width:30%;height:100%;background:var(--accent);animation:loading 1.3s infinite ease-in-out}.spin{display:inline-block;width:12px;height:12px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@keyframes loading{from{transform:translateX(-100%)}to{transform:translateX(430%)}}
.space-top{margin-top:18px}.space-bottom{margin-bottom:18px}.space-block{margin:16px 0}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}
@media(max-width:1000px){.shell{grid-template-columns:185px minmax(0,1fr);gap:23px;padding:28px 22px}.app-header{padding:0 22px}.card{padding:21px}.auth-layout{gap:35px;grid-template-columns:1fr 400px}.auth-intro h1{font-size:34px}.header-rule,.rules-labels{grid-template-columns:minmax(95px,1fr) 85px minmax(100px,1fr) 35px}}
@media(max-width:760px){.app-header{height:69px;padding:0 17px;gap:10px}.brand-mark{width:34px;height:34px;border-radius:10px}.brand-sub{display:none}.brand-name{font-size:14px}.header-tools{gap:6px}.theme-control>span{display:none}.user-label{display:none}.header-tools>.button{font-size:12px;padding:6px 8px;min-height:33px}.shell{display:block;padding:0 16px 35px}.sidebar{position:static;margin:0 -16px 24px;padding:12px 16px;background:var(--surface);border-bottom:1px solid var(--border)}.sidebar nav{display:flex;overflow-x:auto;gap:6px;padding-bottom:2px}.nav-caption,.sidebar-note{display:none}.nav-button{width:auto;white-space:nowrap;padding:9px 13px;gap:7px;margin:0}.nav-icon{font-size:16px}.nav-caption.admin{display:none}.page-heading{margin-bottom:20px;align-items:flex-start}h1{font-size:23px}.page-heading p{font-size:12px}.eyebrow{font-size:10px}.page-heading>.button{padding:8px 11px;min-height:36px;font-size:12px}.card{padding:20px 17px;border-radius:13px}.card-heading{align-items:flex-start}.card-heading h2{font-size:16px}.ip-grid{gap:12px}.ip-panel{padding:15px;min-height:135px}.ip-address{font-size:17px}.ip-panel-top{gap:5px;flex-wrap:wrap;margin-bottom:12px}.ip-panel .badge{font-size:10px;padding:2px 6px}.authorize-actions{gap:13px;align-items:flex-start}.authorize-actions .button{min-width:125px;padding:10px 12px}.details-grid{gap:12px}.detail dd{font-size:16px}.detail dd.small-value{font-size:11px}.auth-layout{min-height:calc(100dvh - 69px);display:flex;flex-direction:column;justify-content:center;gap:22px;padding:32px 20px}.auth-intro{width:min(100%,440px)}.auth-intro h1{font-size:29px;margin-bottom:8px}.auth-intro>p{font-size:13px;max-width:none}.auth-note{display:none}.auth-card{width:min(100%,440px);padding:25px;margin-bottom:0}.auth-card h2{font-size:21px}.data-table.responsive thead{display:none}.data-table.responsive,.data-table.responsive tbody,.data-table.responsive tr,.data-table.responsive td{display:block;width:100%;max-width:none}.data-table.responsive tr{padding:9px 0 13px;border-bottom:1px solid var(--border)}.data-table.responsive tr:last-child{border:0}.data-table.responsive td{border:0;padding:6px 0;display:grid;grid-template-columns:80px minmax(0,1fr);gap:12px}.data-table.responsive td:before{content:attr(data-label);color:var(--muted);font-size:12px;padding-top:2px}.data-table.responsive .row-actions{justify-content:flex-start}.header-rule{grid-template-columns:minmax(0,1fr) 95px 35px;gap:8px;margin-bottom:19px;padding-bottom:17px;border-bottom:1px solid var(--border)}.header-rule .rule-value{grid-row:2;grid-column:1/3}.header-rule .rule-remove{grid-row:1;grid-column:3}.rules-labels{display:none}.notifications{bottom:16px;right:16px}.modal-header{padding:20px 20px 0}.modal-body{padding:18px 20px 20px}.form-grid{grid-template-columns:1fr}.section-footer{align-items:flex-start}}
@media(max-width:390px){.ip-grid{grid-template-columns:1fr}.ip-panel{min-height:115px}.authorize-actions{flex-direction:column}.authorize-actions .button{width:100%}.details-grid{grid-template-columns:1fr 1fr}.detail:last-child{grid-column:1/-1}.brand{gap:8px}}
