.dhcp-runtime{margin-top:var(--space-7);font-family:var(--font-sans);color:#e7f8f5}.dhcp-runtime *{box-sizing:border-box}
.dhcp-runtime__shell{display:grid;gap:1rem;padding:clamp(.85rem,2vw,1.4rem);overflow:hidden;border:1px solid #274d55;border-radius:24px;background:radial-gradient(circle at 10% 0%,rgba(45,212,191,.14),transparent 32rem),linear-gradient(145deg,#071319,#0b1e25 58%,#0c252a);box-shadow:0 26px 70px rgba(0,0,0,.28)}
.dhcp-runtime__header,.dhcp-runtime__panel-head,.dhcp-runtime__actions,.dhcp-runtime__journal>div{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}.dhcp-runtime h2,.dhcp-runtime h3,.dhcp-runtime p{margin:0}.dhcp-runtime__header h2{margin-top:.2rem;font-size:clamp(1.8rem,4vw,3.25rem);color:#fff}.dhcp-runtime__header p{margin-top:.35rem;max-width:68ch;color:#9fc0c4}.dhcp-runtime__eyebrow{font:800 .7rem var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:#5eead4}
.dhcp-runtime__state,.dhcp-runtime__counter{padding:.45rem .7rem;border:1px solid #315c62;border-radius:999px;font:800 .72rem var(--font-mono);letter-spacing:.06em;color:#9fc0c4}.dhcp-runtime__state[data-complete=true]{border-color:#34d399;color:#6ee7b7}
.dhcp-runtime__progress{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.35rem;margin:0;padding:0;list-style:none}.dhcp-runtime__progress li{display:flex;align-items:center;gap:.45rem;min-width:0;padding:.55rem;border-bottom:2px solid #244148;color:#78979b;font-size:.78rem}.dhcp-runtime__progress li[data-active=true]{border-color:#2dd4bf;color:#d9fffa}.dhcp-runtime__progress b{color:#5eead4;font-family:var(--font-mono)}
.dhcp-runtime__topology{position:relative;display:grid;grid-template-columns:1fr .45fr .8fr 1fr 1fr;gap:.75rem;align-items:center;min-height:190px;padding:1.2rem;overflow:hidden;border:1px solid #274d55;border-radius:18px;background:linear-gradient(rgba(42,80,86,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(42,80,86,.14) 1px,transparent 1px),#09181e;background-size:22px 22px}
.dhcp-runtime__node,.dhcp-runtime__switch{position:relative;display:grid;gap:.2rem;min-width:0;padding:.8rem;border:1px solid #315c62;border-radius:12px;background:linear-gradient(150deg,#14313a,#0c2027);box-shadow:0 10px 0 #061015,0 16px 28px rgba(0,0,0,.25)}.dhcp-runtime__node small,.dhcp-runtime__switch small{font:800 .65rem var(--font-mono);letter-spacing:.07em;color:#5eead4}.dhcp-runtime__node strong,.dhcp-runtime__switch strong{overflow-wrap:anywhere;color:#fff}.dhcp-runtime__node span{font-size:.68rem;color:#9fc0c4}.dhcp-runtime__node[data-conflict=true]{border-color:#fb7185;box-shadow:0 10px 0 #3d1018,0 0 24px rgba(251,113,133,.24)}.dhcp-runtime__node[data-conflict=true] span{color:#fda4af}
.dhcp-runtime__link{position:relative;height:3px;background:#315c62}.dhcp-runtime__link:after{content:"";position:absolute;inset:-2px auto -2px 0;width:35%;background:#2dd4bf;opacity:0}.dhcp-runtime__link[data-active=true]:after{opacity:1;animation:dhcp-packet 1.2s ease-in-out infinite}.dhcp-runtime__link span{position:absolute;left:50%;bottom:.5rem;transform:translateX(-50%);font:700 .62rem var(--font-mono);color:#5eead4}.dhcp-runtime__clients,.dhcp-runtime__statics{display:grid;gap:.65rem}
.dhcp-runtime__workspace{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(260px,.7fr);gap:1rem;align-items:start}.dhcp-runtime__panel,.dhcp-runtime__journal{padding:clamp(.85rem,2vw,1.25rem);border:1px solid #274d55;border-radius:18px;background:rgba(7,20,25,.84)}.dhcp-runtime__panel h3{margin-top:.25rem;color:#fff}.dhcp-runtime__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;margin:1rem 0}.dhcp-runtime label{display:block;color:#c5dcde;font-weight:700}
.dhcp-runtime input,.dhcp-runtime select{display:block;width:100%;min-height:44px;margin-top:.3rem;padding:.65rem .7rem;border:1px solid #315c62;border-radius:9px;background:#071319;color:#fff;font:600 .9rem var(--font-mono)}.dhcp-runtime input:focus-visible,.dhcp-runtime select:focus-visible,.dhcp-runtime button:focus-visible{outline:3px solid #fbbf24;outline-offset:3px}
.dhcp-runtime__status{margin-top:.8rem;padding:.75rem .85rem;border-left:3px solid #2dd4bf;border-radius:0 8px 8px 0;background:rgba(45,212,191,.08);color:#c5dcde}.dhcp-runtime__status[data-kind=error]{border-color:#fb7185;background:rgba(251,113,133,.1);color:#fecdd3}.dhcp-runtime__status[data-kind=success]{border-color:#34d399;color:#a7f3d0}.dhcp-runtime__actions{justify-content:flex-start;margin-top:1rem}.dhcp-runtime button{min-height:44px}.dhcp-runtime button:disabled{opacity:.45;cursor:not-allowed}
.dhcp-runtime .btn--ghost{border-color:#315c62!important;background:#143740!important;color:#fff!important;opacity:1}.dhcp-runtime .btn--ghost:hover{border-color:#5eead4!important;background:#1a4650!important;color:#fff!important}
.dhcp-runtime__dora{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.55rem;margin-top:1rem}.dhcp-runtime__dora div{display:grid;gap:.2rem;min-width:0;padding:.65rem;border:1px solid #294a50;border-radius:10px;color:#78979b;background:#09181e}.dhcp-runtime__dora div[data-state=done]{border-color:#2dd4bf;color:#d9fffa}.dhcp-runtime__dora div[data-state=next]{border-color:#fbbf24;color:#fef3c7}.dhcp-runtime__dora small{font:700 .6rem var(--font-mono)}.dhcp-runtime__dora strong{color:inherit}.dhcp-runtime__dora span{font-size:.7rem;overflow-wrap:anywhere}
.dhcp-runtime__choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;margin-top:1rem}.dhcp-runtime__choices button{display:grid;gap:.3rem;text-align:left;padding:1rem;border:1px solid #315c62;border-radius:12px;background:#0b2027;color:#c5dcde}.dhcp-runtime__choices button[aria-pressed=true]{border-color:#fbbf24;box-shadow:inset 0 0 0 1px #fbbf24}.dhcp-runtime__choices small{color:#5eead4;font:700 .68rem var(--font-mono);text-transform:uppercase}.dhcp-runtime__choices strong{color:#fff}
.dhcp-runtime__pings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem;margin-top:1rem}.dhcp-runtime__pings span{display:grid;gap:.2rem;padding:.65rem;border:1px solid #315c62;border-radius:9px;font-size:.75rem}.dhcp-runtime__pings span[data-ok=true] strong{color:#6ee7b7}.dhcp-runtime__pings span[data-ok=false] strong{color:#fda4af}
.dhcp-runtime__journal ol{display:grid;gap:.55rem;margin:.8rem 0 0;padding:0;list-style:none}.dhcp-runtime__journal li{display:grid;grid-template-columns:auto 1fr;gap:.55rem;padding-top:.55rem;border-top:1px solid #203a40}.dhcp-runtime__journal time{font:700 .68rem var(--font-mono);color:#5eead4}.dhcp-runtime__journal li span{display:grid;gap:.1rem;font-size:.72rem;color:#9fc0c4;overflow-wrap:anywhere}.dhcp-runtime__journal li b{color:#e7f8f5}.dhcp-runtime__journal li[data-kind=error] b{color:#fda4af}
.dhcp-runtime__summary{display:grid;gap:1rem}.dhcp-runtime__summary h2{max-width:26ch;color:#fff}.dhcp-runtime__summary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem}.dhcp-runtime__summary-grid div{display:grid;gap:.15rem;padding:.75rem;border-left:2px solid #2dd4bf;background:rgba(45,212,191,.06)}.dhcp-runtime__summary-grid small{color:#5eead4;font:700 .65rem var(--font-mono)}.dhcp-runtime__summary-grid strong{color:#fff;overflow-wrap:anywhere}.dhcp-runtime__summary-grid span{color:#9fc0c4;font-size:.75rem}.dhcp-runtime pre{max-height:300px;overflow:auto;white-space:pre-wrap;padding:.85rem;border:1px solid #274d55;border-radius:10px;background:#061015;color:#bfe7e3;font-size:.72rem}
@keyframes dhcp-packet{from{transform:translateX(0)}to{transform:translateX(190%)}}@keyframes dhcp-packet-y{from{transform:translateY(0)}to{transform:translateY(190%)}}@media(prefers-reduced-motion:reduce){.dhcp-runtime__link:after{animation:none!important;width:100%}}
.dhcp-runtime__actions button.dhcp-fx-good{animation:dhcp-btn-good .55s ease-out}
.dhcp-runtime__actions button.dhcp-fx-bad{animation:dhcp-btn-bad .55s ease-out}
@keyframes dhcp-btn-good{0%{filter:brightness(1)}40%{filter:brightness(1.35)}100%{filter:brightness(1)}}
@keyframes dhcp-btn-bad{0%{filter:brightness(1)}40%{filter:brightness(.7) saturate(2)}100%{filter:brightness(1)}}
.dhcp-runtime__choices button.dhcp-fx-good{animation:dhcp-btn-good .55s ease-out}
.dhcp-runtime__choices button.dhcp-fx-bad{animation:dhcp-btn-bad .55s ease-out}
.dhcp-runtime__header.dhcp-fx-complete{animation:dhcp-hud-complete 1.1s ease-out}
@keyframes dhcp-hud-complete{0%{box-shadow:inset 0 0 0 rgba(45,212,191,0)}30%{box-shadow:inset 0 0 46px rgba(45,212,191,.5)}100%{box-shadow:inset 0 0 0 rgba(45,212,191,0)}}
.dhcp-runtime__sound{min-height:32px;padding:.3rem .65rem;border:1px solid #315c62;border-radius:999px;background:#0b2027;color:#78979b;font:800 .65rem var(--font-mono);letter-spacing:.06em;cursor:pointer}
.dhcp-runtime__sound[data-on=true]{border-color:#2dd4bf;color:#5eead4}
@media(prefers-reduced-motion:reduce){.dhcp-runtime__actions button.dhcp-fx-good,.dhcp-runtime__actions button.dhcp-fx-bad,.dhcp-runtime__choices button.dhcp-fx-good,.dhcp-runtime__choices button.dhcp-fx-bad,.dhcp-runtime__header.dhcp-fx-complete{animation:none}}
@media(max-width:900px){.dhcp-runtime__workspace{grid-template-columns:1fr}.dhcp-runtime__journal{order:2}.dhcp-runtime__topology{grid-template-columns:1fr .35fr .8fr 1fr}.dhcp-runtime__statics{grid-column:1/-1;grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.dhcp-runtime__shell{margin-inline:-.55rem;border-radius:16px}.dhcp-runtime__progress{grid-template-columns:repeat(2,minmax(0,1fr))}.dhcp-runtime__topology{grid-template-columns:1fr;text-align:center}.dhcp-runtime__link{width:3px;height:28px;margin:0 auto}.dhcp-runtime__link:after{inset:0 -2px auto -2px;width:auto;height:35%}.dhcp-runtime__link[data-active=true]:after{animation:dhcp-packet-y 1.2s ease-in-out infinite}.dhcp-runtime__link span{left:.75rem;bottom:50%;transform:translateY(50%)}.dhcp-runtime__clients,.dhcp-runtime__statics,.dhcp-runtime__grid,.dhcp-runtime__dora,.dhcp-runtime__choices,.dhcp-runtime__pings,.dhcp-runtime__summary-grid{grid-template-columns:1fr}.dhcp-runtime__actions>*{width:100%;justify-content:center}}