body.pppoe-view .summary,body.pppoe-view #topTraffic { display:none; }
.pe { grid-column:1/-1; min-width:0; color:var(--text); }
.pe-heading,.pe-actions,.pe-tools,.pe-pages,.pe-form-actions,.pe-dialog-head { display:flex; align-items:center; gap:12px; }
.pe-heading,.pe-dialog-head { justify-content:space-between; flex-wrap:wrap; }
.pe h2 { font-size:22px; margin:0 0 8px; }.pe-updated { font-size:12px; color:var(--muted); }
.pe button,.pe-dialog button { border:1px solid var(--line); background:var(--panel); color:var(--text); border-radius:5px; min-height:38px; padding:8px 12px; cursor:pointer; }
.pe button:disabled,.pe-dialog button:disabled { opacity:.5; cursor:not-allowed; }
.pe button.pe-primary,.pe-dialog button.pe-primary { background:var(--nav-active); color:#fff; border-color:var(--nav-active); }
.pe [hidden] { display:none!important; }.pe-notice { margin:12px 0; font-size:13px; }.pe-notice:empty { display:none; }
.pe-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:18px 0; margin:20px 0; gap:16px; }
.pe-summary span { display:block; font-size:12px; color:var(--muted); }.pe-summary strong { display:block; margin-top:8px; font-size:24px; }
.pe-tabs { display:flex; gap:12px; overflow:auto; border-bottom:1px solid var(--line); }
.pe-tabs button { border:0; border-radius:0; border-bottom:2px solid transparent; background:none; white-space:nowrap; min-height:44px; }
.pe-tabs button.active { color:var(--accent); border-bottom-color:var(--accent); }
.pe-tools { margin:18px 0; flex-wrap:wrap; justify-content:space-between; }.pe-search { width:340px; max-width:100%; }
.pe input,.pe select,.pe-dialog input,.pe-dialog select { min-width:0; border:1px solid var(--line); background:var(--panel); color:var(--text); border-radius:5px; padding:10px; font:inherit; }
.pe-auto,.pe-check { display:flex!important; align-items:center; gap:8px; font-size:13px; }.pe-auto input,.pe-check input { width:18px; height:18px; }
.pe-scroll { max-width:100%; overflow:auto; }.pe table { border-collapse:collapse; width:100%; font-size:13px; white-space:nowrap; }
.pe th,.pe td { padding:12px; text-align:left; border-bottom:1px solid var(--line); }.pe th { background:var(--panel-2); color:var(--muted); font-size:11px; font-weight:600; }.pe-row-actions button+button { margin-left:6px; }
.pe-state { color:var(--muted); }.pe-state.online { color:var(--up); }.pe-pages { justify-content:flex-end; margin-top:16px; font-size:12px; }
.pe-dialog { box-sizing:border-box; width:min(680px,calc(100% - 24px)); max-height:90vh; max-height:90dvh; padding:20px; border:1px solid var(--line); border-radius:6px; background:var(--panel); color:var(--text); overscroll-behavior:contain; }
.pe-dialog::backdrop { background:#0008; }.pe-dialog-head { border-bottom:1px solid var(--line); padding-bottom:12px; }.pe-dialog h3 { font-size:18px; margin:0; }.pe-dialog [data-close] { font-size:22px; width:42px; height:42px; padding:4px; }
.pe-form { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:18px; }.pe-form label { display:grid; gap:8px; font-size:12px; min-width:0; }.pe-form input,.pe-form select { width:100%; box-sizing:border-box; }
.pe-form-actions,.pe-form-error { grid-column:1/-1; }.pe-form-actions { justify-content:flex-end; }.pe-form-error { color:var(--down); font-size:13px; overflow-wrap:anywhere; margin:0; }.pe-form-error:empty { display:none; }.pe-dialog-body p { line-height:1.6; overflow-wrap:anywhere; }
.pe-password { display:flex; gap:6px; }.pe-password input { flex:1; }.pe-password button { flex:0 0 42px; padding:6px; }.theme-dark .pe-password img { filter:invert(1); }
.pe-dialog [hidden] { display:none!important; }
.pe-mode { grid-column:1/-1; display:flex; gap:20px; flex-wrap:wrap; border:0; border-bottom:1px solid var(--line); margin:0; padding:0 0 16px; min-width:0; }
.pe-mode legend { font-size:12px; color:var(--muted); padding:0 0 10px; }
.pe-mode label { display:flex; align-items:center; gap:8px; min-height:32px; }
.pe-dialog .pe-mode input,.pe-dialog .pe-check input { flex:0 0 18px; width:18px; height:18px; min-height:18px; padding:0; margin:0; }
.pe-generator { grid-column:1/-1; display:grid; grid-template-columns:minmax(0,1fr) minmax(100px,.6fr) auto; gap:12px; align-items:end; padding-bottom:16px; border-bottom:1px solid var(--line); }
.pe-generator button { height:auto; min-height:42px; white-space:normal; }
.pe-generator > .pe-pool-choice { grid-column:1/-1; }
.pe-dialog .pe-form select,.pe-dialog .pe-form input:not([type=radio]):not([type=checkbox]) { height:44px; min-height:44px; line-height:22px; padding:10px 12px; }
.pe-form input[readonly] { background:var(--panel-2); color:var(--muted); }
@media(max-width:650px) { .pe-generator { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }.pe-generator button { grid-column:1/-1; }.pe-dialog .pe-mode label { min-height:44px; } }
@media(max-width:650px) { .pe h2 { font-size:20px; }.pe-summary { grid-template-columns:1fr 1fr; }.pe-form { grid-template-columns:1fr; }.pe input,.pe select,.pe-dialog input,.pe-dialog select { font-size:16px; }.pe-tabs { gap:2px; }.pe-search { width:100%; }.pe button,.pe-dialog button { min-height:44px; }.pe-dialog { padding:16px; } }
