/* Network Toolbox: a terminal on the tool-page design. The terminal stays dark in both themes. */
.term { --t-bg: #0b1220; --t-bar: #111a2e; --t-line: #1f2a44; --t-text: #d6deeb; --t-dim: #8b97ad; --t-ok: #7ee787; --t-warn: #e3b341;
  --t-err: #ff7b72; --t-head: #79c0ff; --t-key: #d2a8ff;
  background: var(--t-bg); color: var(--t-text); border: 1px solid var(--t-line); border-radius: 12px; overflow: hidden; margin: 0 0 14px;
  font-family: var(--mono); font-size: .88rem; box-shadow: 0 10px 30px -18px rgba(0, 0, 0, .6); }
.term-bar { display: flex; align-items: center; gap: 12px; padding: 8px 12px; background: var(--t-bar); border-bottom: 1px solid var(--t-line); }
.dots { display: flex; gap: 6px; }
.dots i { width: 11px; height: 11px; border-radius: 50%; background: #ff5f57; }
.dots i:nth-child(2) { background: #febc2e; }
.dots i:nth-child(3) { background: #28c840; }
.term-title { flex: 1; text-align: center; color: var(--t-dim); font-size: .8rem; }
.term-btn { background: transparent; color: var(--t-dim); border: 1px solid var(--t-line); border-radius: 6px; padding: 2px 10px; font: inherit; font-size: .75rem; cursor: pointer; }
.term-btn:hover { color: var(--t-text); border-color: var(--t-dim); }
.term-out { height: min(56vh, 520px); overflow: auto; padding: 14px 16px; scrollbar-width: thin; scrollbar-color: var(--t-line) transparent; }
.term-out p { margin: 0; }
.run + .run { margin-top: 16px; }
.run-cmd { color: var(--t-text); }
.run-cmd b { color: var(--t-ok); font-weight: 400; }
.run pre { margin: 4px 0 0; font: inherit; white-space: pre; tab-size: 8; overflow-x: auto; scrollbar-width: none; }
.run pre span { display: block; min-height: 1.35em; }
.run-meta { display: flex; gap: 10px; align-items: center; margin-top: 4px; color: var(--t-dim); font-size: .75rem; }
.run-meta button { background: none; border: 0; padding: 0; color: var(--t-dim); font: inherit; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.run-meta button:hover { color: var(--t-text); }
.t-ok { color: var(--t-ok); } .t-warn { color: var(--t-warn); } .t-err { color: var(--t-err); } .t-head { color: var(--t-head); }
.t-dim { color: var(--t-dim); } .t-key { color: var(--t-key); }
.term-in { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-top: 1px solid var(--t-line); background: var(--t-bar); }
.t-ps1 { color: var(--t-head); white-space: nowrap; margin: 0; font-size: inherit; font-weight: 400; }
.t-ps1 b { color: var(--t-ok); font-weight: 400; }
.term-in input { flex: 1; min-width: 0; background: transparent; border: 0; outline: 0; padding: 4px 0; color: var(--t-text); font: inherit; caret-color: var(--t-ok); box-shadow: none; }
.term-in input::placeholder { color: var(--t-dim); opacity: .6; }
.term-run { background: var(--t-ok); color: #0b1220; border: 0; border-radius: 6px; padding: 5px 14px; font: inherit; font-weight: 700; cursor: pointer; }
.term-run:disabled { opacity: .5; cursor: progress; }
.cursor { display: inline-block; width: .6em; height: 1.1em; vertical-align: text-bottom; background: var(--t-dim); animation: blink 1s steps(1) infinite; }
@keyframes blink { 50% { opacity: 0; } }
.tools-pick { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 20px; }
.examples, .rules { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.examples li { display: grid; gap: 2px; }
.examples button { justify-self: start; background: var(--input); border: 1px solid var(--border); border-radius: 6px; padding: 3px 10px; font: .85rem var(--mono); color: var(--fg); cursor: pointer; text-align: left; }
.examples button:hover { border-color: var(--fg); }
.examples span { color: var(--faint); font-size: .85rem; }
.rules li { font-size: .9rem; color: var(--soft); line-height: 1.5; }
.rules b { color: var(--soft); }
@media (max-width: 600px) {
  .term { font-size: .8rem; margin-inline: -4px; }
  .term-out { height: 60vh; padding: 12px; }
  .t-ps1 { display: none; }
}
@media (prefers-reduced-motion: reduce) { .cursor { animation: none; } }