.wireguard-layout{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(360px,.9fr);gap:22px}.wireguard-form,.wireguard-output{padding:24px}.wireguard-form-head,.wireguard-output-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:20px}.wireguard-form-head h2,.wireguard-output-head h2{margin:0 0 5px}.wireguard-form-head p,.wireguard-output-head p{margin:0;color:var(--muted)}.wireguard-badge{border-radius:999px;background:#dff8f1;color:#087b65;font-weight:800;padding:7px 11px;white-space:nowrap}.wireguard-notice{margin-bottom:20px;border-left:4px solid #1aa8ca;background:#eaf8fc;padding:13px 15px;color:#285866}.wireguard-section{border:1px solid var(--line);border-radius:10px;padding:18px;margin-top:16px}.wireguard-section legend{padding:0 8px;font-weight:900;color:var(--ink)}.wireguard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.wireguard-grid .wide{grid-column:1/-1}.wireguard-form label{display:grid;gap:7px;font-weight:800;color:var(--ink)}.wireguard-form input,.wireguard-form select{width:100%;border:1px solid var(--line);border-radius:7px;background:var(--card);color:var(--ink);padding:12px 13px;font:inherit}.wireguard-checks{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}.wireguard-checks label{display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:8px;padding:11px 13px}.wireguard-checks input{width:auto}.wireguard-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.wireguard-output{position:sticky;top:18px;align-self:start}.wireguard-output textarea{width:100%;min-height:560px;resize:vertical;border:1px solid #35525c;border-radius:8px;background:#0c1b21;color:#cef4df;padding:17px;font:13px/1.55 ui-monospace,SFMono-Regular,Menlo,monospace;tab-size:2}.wireguard-errors{margin-top:12px;border-radius:8px;background:#fff0ed;color:#aa2f25;padding:12px 14px}.wireguard-help{margin-top:14px;color:var(--muted);font-size:13px;line-height:1.55}.wireguard-help b{color:var(--ink)}.wireguard-archive{margin-top:22px;padding:24px}.wireguard-archive-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.wireguard-archive-head h2{margin:0 0 5px}.wireguard-archive-head p{margin:0;color:var(--muted)}.wireguard-archive-head>span{background:#e5f6fb;color:#167691;border-radius:999px;padding:7px 11px;font-weight:800}.wireguard-archive-filter{display:grid;grid-template-columns:minmax(260px,1fr) minmax(220px,.35fr);gap:14px;margin:20px 0}.wireguard-archive-filter label{display:grid;gap:7px;font-weight:800}.wireguard-archive-filter input,.wireguard-archive-filter select{border:1px solid var(--line);border-radius:7px;background:var(--card);color:var(--ink);padding:12px 13px;font:inherit}.wireguard-table td small{display:block;color:var(--muted);margin-top:4px}.wireguard-row-actions{display:flex;gap:6px}.wireguard-row-actions button{border:1px solid var(--line);border-radius:6px;background:var(--card);color:var(--ink);padding:7px 9px;font-weight:800}.wireguard-row-actions .danger{color:#c44438;border-color:#e6a7a1}
html[data-theme="dark"] .wireguard-badge{background:#133a34;color:#75e0c3}html[data-theme="dark"] .wireguard-notice{background:#142c34;color:#b7d7df}html[data-theme="dark"] .wireguard-errors{background:#3a201f;color:#ffaaa2}html[data-theme="dark"] .wireguard-form input,html[data-theme="dark"] .wireguard-form select,html[data-theme="dark"] .wireguard-archive-filter input,html[data-theme="dark"] .wireguard-archive-filter select{background:#102127;color:#e7f1f3}html[data-theme="dark"] .wireguard-archive-head>span{background:#14333c;color:#7edcf4}
@media(max-width:1100px){.wireguard-layout{grid-template-columns:1fr}.wireguard-output{position:static}.wireguard-output textarea{min-height:420px}}@media(max-width:680px){.wireguard-grid,.wireguard-archive-filter{grid-template-columns:1fr}.wireguard-grid .wide{grid-column:auto}.wireguard-form,.wireguard-output,.wireguard-archive{padding:17px}.wireguard-archive-head{display:block}.wireguard-archive-head>span{display:inline-block;margin-top:10px}}