.cell-copy{display:none!important}

/* The base shell initially marks IPv4 active. Dynamic v2 routes are injected by
   enhancements.js before DOMContentLoaded; hide the fallback panel meanwhile so
   a deep link never flashes the IPv4 tool. */
body[data-route="overlap"] #panel-ipv4.active,
body[data-route="eui64"] #panel-ipv4.active,
body[data-route="dns"] #panel-ipv4.active,
body[data-route="asn"] #panel-ipv4.active,
body[data-route="mac"] #panel-ipv4.active{display:none}

.res-cell.copy-card{position:relative;cursor:pointer;transition:border-color .15s,background-color .15s,transform .08s}
.res-cell.copy-card:hover,.res-cell.copy-card:focus-visible{border-color:var(--accent);background:rgba(88,166,255,.055)}
[data-theme="retro"] .res-cell.copy-card:hover,[data-theme="retro"] .res-cell.copy-card:focus-visible{border-color:var(--green);background:rgba(0,255,136,.045)}
.res-cell.copy-card:active{transform:translateY(1px)}
.res-cell.copy-card::after{content:attr(data-copy-hint);position:absolute;right:7px;top:6px;padding:2px 6px;border:1px solid var(--border2);border-radius:3px;background:var(--surface);color:var(--text2);font-size:9px;line-height:1.4;letter-spacing:.03em;opacity:0;pointer-events:none;transform:translateY(-3px);transition:opacity .12s,transform .12s;white-space:nowrap;z-index:3}
.res-cell.copy-card:hover::after,.res-cell.copy-card:focus-visible::after,.res-cell.copy-card.is-copied::after{opacity:1;transform:none}
.res-cell.copy-card.is-copied{border-color:var(--green);background:rgba(63,185,80,.06)}

.v2-header-actions{margin-left:auto;display:inline-flex;gap:6px;align-items:center}
.v2-mini-btn{font-family:var(--font);font-size:9px;padding:2px 7px;border:1px solid var(--border2);border-radius:3px;background:transparent;color:var(--text2);cursor:pointer;white-space:nowrap}
.v2-mini-btn:hover{border-color:var(--accent);color:var(--accent)}
[data-theme="retro"] .v2-mini-btn:hover{border-color:var(--green);color:var(--green)}

.cidr-quick{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}
.cidr-chip{font-family:var(--font);font-size:9px;padding:2px 7px;border:1px solid var(--border);border-radius:3px;background:var(--surface3);color:var(--text3);cursor:pointer}
.cidr-chip:hover,.cidr-chip:focus-visible{border-color:var(--accent);color:var(--accent)}

.related-tools{margin-top:12px;padding:9px 10px;border:1px solid var(--border);border-radius:var(--r);background:var(--surface2)}
.related-tools-title{font-size:9px;color:var(--text3);letter-spacing:.1em;text-transform:uppercase;margin-bottom:7px}
.related-tools-list{display:flex;flex-wrap:wrap;gap:6px}
.related-tool-btn{font-family:var(--font);font-size:10px;padding:4px 8px;border:1px solid var(--border2);border-radius:var(--r);background:transparent;color:var(--text2);cursor:pointer}
.related-tool-btn:hover{border-color:var(--accent);color:var(--accent);background:rgba(88,166,255,.05)}
[data-theme="retro"] .related-tool-btn:hover{border-color:var(--green);color:var(--green);background:rgba(0,255,136,.04)}

.v2-info{margin:8px 0 12px;padding:8px 10px;border-left:3px solid var(--accent);background:var(--surface2);color:var(--text2);font-size:11px;line-height:1.6}
.v2-info.ok{border-left-color:var(--green)}
.v2-info.warn{border-left-color:var(--amber)}
.v2-info.error{border-left-color:var(--red)}

.v2-options{display:flex;flex-wrap:wrap;gap:7px 12px;margin-top:9px}
.v2-check{display:flex;align-items:center;gap:5px;color:var(--text2);font-size:11px;cursor:pointer}
.t-field .v2-check{text-transform:none;letter-spacing:0}
.v2-check input{accent-color:var(--accent)}

.v2-table-note{margin-top:7px;color:var(--text3);font-size:10px}
.mac-status{display:inline-flex;align-items:center;gap:5px;padding:2px 6px;border-radius:3px;border:1px solid var(--border2);font-size:9px;white-space:nowrap}
.mac-status.ok{color:var(--green);border-color:rgba(63,185,80,.45)}
.mac-status.unknown{color:var(--amber);border-color:rgba(210,153,34,.45)}
.mac-status.local{color:var(--purple);border-color:rgba(188,140,255,.45)}
.mac-duplicate-row>td{background:rgba(210,153,34,.11)}
.mac-duplicate-row:hover>td{background:rgba(210,153,34,.17)}
[data-theme="retro"] .mac-duplicate-row>td{background:rgba(255,190,0,.09)}
[data-theme="retro"] .mac-duplicate-row:hover>td{background:rgba(255,190,0,.14)}
.mac-repeat-cell{text-align:center}
.mac-duplicate-badge{display:inline-flex;align-items:center;justify-content:center;min-width:78px;padding:2px 7px;border:1px solid rgba(210,153,34,.55);border-radius:999px;background:rgba(210,153,34,.12);color:var(--amber);font-size:9px;font-weight:700;white-space:nowrap}

.planner-projects{display:grid;grid-template-columns:minmax(190px,240px) minmax(220px,1fr) auto auto;gap:7px;margin:0 0 12px;align-items:end}
.planner-project-field{min-width:0}.planner-project-field label{display:block;color:var(--text3);font-size:9px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:4px}
.planner-project-field .t-input-wrap{height:34px}.planner-project-field select,.planner-project-field input{min-width:0}
.planner-projects .btn{height:34px;padding-top:4px;padding-bottom:4px}
.planner-save-state{grid-column:1/-1;min-height:13px;font-size:9px;color:var(--text3);margin:0}

.v2-toast{position:fixed;right:18px;bottom:18px;z-index:10020;padding:8px 11px;background:var(--surface);border:1px solid var(--border2);border-radius:var(--r);color:var(--text);font-size:11px;box-shadow:0 8px 26px rgba(0,0,0,.32);opacity:0;transform:translateY(7px);pointer-events:none;transition:opacity .15s,transform .15s}
.v2-toast.show{opacity:1;transform:none}

.v2-dynamic-panel h1,.v2-dynamic-panel h2{font-size:inherit;font-weight:inherit;display:inline}
.v2-empty{color:var(--text3);font-size:11px;padding:8px 0}
.v2-record-group{margin:9px 0 0}
.v2-record-title{font-size:10px;color:var(--accent);font-weight:600;margin-bottom:4px}
.v2-record{display:flex;gap:10px;padding:4px 0;border-bottom:1px solid var(--border);font-size:11px;align-items:flex-start}
.v2-record-ttl{width:70px;color:var(--text3);flex-shrink:0}
.v2-record-value{color:var(--text);word-break:break-all;cursor:pointer}
.v2-record-value:hover{color:var(--cyan)}

.v2-copy-cell{position:relative;cursor:pointer;transition:background-color .12s,color .12s}
.v2-copy-cell:hover,.v2-copy-cell:focus-visible{background:var(--surface3);color:var(--accent);outline:none}
.v2-copy-cell::after{content:attr(data-copy-hint);position:absolute;right:5px;top:3px;padding:1px 5px;border:1px solid var(--border2);border-radius:3px;background:var(--surface);color:var(--text3);font-size:8px;line-height:1.4;opacity:0;pointer-events:none;white-space:nowrap}
.v2-copy-cell:hover::after,.v2-copy-cell:focus-visible::after{opacity:1}

@media(max-width:768px){
  /* app.css hides the promotion banner on mobile; v2 deliberately restores it
     so the Telegram hand-off is available where it is most useful. Dismissed
     banners remain hidden because .promo-banner.hidden is more specific. */
  .promo-banner{display:flex;gap:6px;padding:6px 10px}
  .promo-banner-text{font-size:10px;min-width:0}
  .v2-telegram-link{font-size:9px;padding:3px 7px}
  .planner-projects{grid-template-columns:1fr 1fr}
  .v2-header-actions{gap:4px}
  .v2-mini-btn{min-height:32px;padding:4px 7px}
  .res-cell.copy-card::after{top:auto;bottom:5px}
}
@media(max-width:480px){
  .promo-banner-text{display:none}
  .v2-telegram-link{margin-right:auto}
  .planner-projects{grid-template-columns:1fr}
  .related-tool-btn{flex:1 1 45%;text-align:center}
}

@media(prefers-reduced-motion:reduce){
  .res-cell.copy-card,.res-cell.copy-card::after,.v2-toast{transition:none!important}
}

.related-tool-btn strong{display:block;font:inherit;font-weight:700}.related-tool-btn small{display:block;margin-top:3px;color:var(--text3);font-size:8px;line-height:1.35;font-weight:400}.related-tool-btn:hover small{color:var(--text2)}
