/* Inherits the portal's graphite surfaces, fine borders and restrained accent. */
.connection-help-trigger{display:flex;align-items:center;gap:12px;width:100%;text-align:left;margin-top:18px;padding:15px 0 0;border:0;border-top:1px solid var(--line);border-radius:0;background:transparent;color:var(--text);transition:opacity .2s}
.connection-help-trigger>span:nth-child(2){flex:1}.connection-help-trigger strong{display:block;font-size:.76rem;font-weight:600}.connection-help-trigger small{display:block;font-size:.68rem;color:var(--muted);margin-top:4px}.connection-help-trigger svg{width:19px;height:19px;flex-shrink:0}.connection-help-trigger>svg{width:16px;color:var(--muted);transition:transform .2s}.connection-help-trigger:hover>svg{transform:translateX(4px);color:var(--text)}.ch-entry-icon{color:var(--muted)}
.connection-help-dialog{width:min(620px,calc(100vw - 28px));padding:0;max-height:calc(100dvh - 28px);border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);color:var(--text);box-shadow:0 30px 100px #0009;overflow-x:hidden}
.connection-help-dialog[open]{animation:ch-open .3s ease both}.connection-help-dialog::backdrop{background:#090c1066;backdrop-filter:blur(3px);animation:ch-backdrop .25s ease both}.connection-help-dialog.ch-closing{animation:ch-exit .18s ease both}.connection-help-dialog.ch-closing::backdrop{animation:ch-backdrop .18s ease reverse both}
.ch-top{padding:18px 24px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:var(--raised)}.ch-top>span{display:flex;align-items:center;gap:10px;font-size:.62rem;letter-spacing:.16em;color:var(--muted)}.ch-top svg{width:18px;height:18px}.ch-close{background:transparent;border:0;color:var(--muted);display:grid;place-items:center;width:30px;height:30px}.ch-close:hover{color:var(--text);background:var(--surface)}
.ch-stage{padding:24px 36px 28px}.ch-copy{animation:ch-open .3s ease both;text-align:center}.ch-copy h2{font-size:1.65rem;letter-spacing:-.04em;line-height:1.2;max-width:440px;margin:0 auto 12px}.ch-copy h2:focus{outline:none}.ch-copy p{font-size:.84rem;line-height:1.7;margin:0 auto 23px;max-width:450px}
.ch-orbit{position:relative;height:104px;width:160px;margin:0 auto 16px;display:grid;place-items:center;color:var(--muted)}.ch-orbit i{position:absolute;width:100px;height:100px;border:1px solid var(--line);border-radius:50%}.ch-orbit i:nth-child(2){width:74px;height:74px;opacity:.6}.ch-orbit>span{display:grid;place-items:center;width:48px;height:48px;border:1px solid var(--line);border-radius:50%;background:var(--raised);z-index:1}.ch-orbit svg{width:24px;height:24px}.ch-orbit.is-scanning i{animation:ch-pulse 2s ease-out infinite}.ch-orbit.is-scanning i:nth-child(2){animation-delay:.5s}.ch-orbit b{position:absolute;width:100px;height:100px;border:1px solid transparent;border-top-color:var(--accent);border-radius:50%;animation:ch-spin 1.8s linear infinite}.ch-orbit.is-success{color:var(--ok)}
.ch-guarantee{display:flex;align-items:center;justify-content:center;gap:12px;padding:16px;border-block:1px solid var(--line)}.ch-guarantee svg{width:22px;height:22px;color:var(--muted)}.ch-guarantee strong,.ch-guarantee small{display:block;font-size:.75rem}.ch-guarantee small{color:var(--muted);font-size:.71rem;margin-top:3px}
.ch-actions{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:24px;flex-wrap:wrap}.ch-actions .ch-primary{background:var(--raised);border:1px solid var(--line);color:var(--text);font-size:.8rem;gap:26px;padding:12px 18px;transition:background .2s,border-color .2s,transform .2s}.ch-actions .ch-primary:hover{background:var(--bg);border-color:var(--muted);transform:translateY(-1px)}.ch-actions svg,.ch-advance svg{width:17px;height:17px}.ch-actions .text-link{font-size:.75rem;color:var(--muted)}.ch-consent{font-size:.69rem;line-height:1.6;text-align:center;margin:18px auto 0;max-width:420px;color:var(--muted)}
.ch-demo{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 24px;border-top:1px solid var(--line);background:var(--bg)}.ch-demo>span{font-size:.53rem;letter-spacing:.1em;color:var(--soft)}.ch-demo small{display:block;letter-spacing:0;font-size:.62rem;margin-top:3px;color:var(--muted)}.ch-demo select{width:175px;max-width:100%;background:var(--surface);border:1px solid var(--line);padding:7px;font-size:.68rem}.ch-demo label{margin:0}.ch-demo .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.ch-journey{list-style:none;padding:0;margin:0}.ch-journey li{display:flex;gap:14px;position:relative;padding:0 0 19px;color:var(--soft);font-size:.78rem}.ch-journey li:last-child{padding-bottom:0}.ch-journey li:not(:last-child):before{content:'';position:absolute;left:14px;top:29px;bottom:0;width:1px;background:var(--line)}.ch-journey li>span{width:29px;height:29px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;flex-shrink:0;font-size:.6rem}.ch-journey li>div{padding-top:4px}.ch-journey small{display:block;margin-top:5px;font-size:.68rem;line-height:1.5;color:var(--muted)}.ch-journey .current{color:var(--text)}.ch-journey .current>span{border-color:var(--accent);color:var(--accent)}.ch-journey .done{color:var(--ok)}.ch-journey svg{width:15px;height:15px}.ch-advance{display:flex;align-items:center;gap:10px;font-size:.7rem;margin:20px auto 0;color:var(--muted)}
.ch-tip{border-left:2px solid var(--line);padding-left:16px}.ch-tip strong{font-size:.78rem}.ch-tip p{font-size:.77rem;line-height:1.65;margin:6px 0 0}.ch-scan-label{display:flex;justify-content:space-between;font-size:.65rem;color:var(--muted);margin:22px 0 10px}.ch-loading{height:2px;overflow:hidden;background:var(--line)}.ch-loading:after{content:'';display:block;width:35%;height:100%;background:var(--accent);animation:ch-sweep 1.8s ease-in-out infinite}
@keyframes ch-open{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}@keyframes ch-exit{to{opacity:0;transform:translateY(7px)}}@keyframes ch-backdrop{from{opacity:0}to{opacity:1}}@keyframes ch-pulse{0%{transform:scale(.75);opacity:0}30%{opacity:.8}100%{transform:scale(1.4);opacity:0}}@keyframes ch-spin{to{transform:rotate(360deg)}}@keyframes ch-sweep{from{transform:translateX(-100%)}to{transform:translateX(380%)}}
@media(max-width:600px){.ch-stage{padding:20px}.ch-copy h2{font-size:1.4rem}.ch-top{padding:14px 18px}.ch-demo{padding:12px 18px;flex-wrap:wrap}.ch-demo label,.ch-demo select{width:100%}.ch-orbit{height:84px;margin-bottom:20px}.ch-orbit i{width:80px;height:80px}.ch-actions{gap:16px}.ch-actions .ch-primary{justify-content:space-between;width:100%}}
@media(prefers-reduced-motion:reduce){.connection-help-dialog,.connection-help-dialog *,.connection-help-dialog::backdrop{animation:none!important;transition:none!important}}
/* Dialog lives outside .portal; explicitly inherit the portal's text-action reset. */
.connection-help-dialog .text-link{border:0;background:transparent;padding:4px 0;box-shadow:none;border-radius:0}.connection-help-dialog button:focus-visible{outline:2px solid var(--muted);outline-offset:4px}
/* Reserve the central wordmark: compact existing server metadata before it collides. */
@media(min-width:761px) and (max-width:1600px){.portal .topbar .server-text{display:none}.portal .topbar .server-identity{width:24px;max-width:24px}.portal .topbar .header-season{max-width:240px}}
/* Keep assistance visible first, without adding another tall section to the card. */
.overview-connect .connection-help-trigger{margin:0 0 14px;padding:11px 12px;border:1px solid var(--line);border-left:2px solid var(--accent);border-radius:6px;background:var(--raised)}
.overview-connect .connection-help-trigger:hover{border-color:var(--muted);background:var(--surface)}
.overview-connect .connection-help-trigger .ch-entry-icon{color:var(--accent)}
.overview-connect .access-steps:has(>span:last-child.is-current){display:none}
.overview-connect .access-description{margin-bottom:12px}
.overview-connect .access-footer{margin-top:10px;padding-top:8px}
.ch-journey .current:last-child{color:var(--ok)}.ch-journey .current:last-child>span{border-color:var(--ok);color:var(--ok)}
.ch-journey{margin-top:4px}.ch-stage:has(.ch-journey) .ch-orbit{height:56px;margin-bottom:10px}.ch-stage:has(.ch-journey) .ch-orbit i{width:54px;height:54px}.ch-stage:has(.ch-journey) .ch-orbit i:nth-child(2){display:none}
/* The season's warm accent marks the active step; sage marks completion. */
.connection-help-dialog .ch-top{background:linear-gradient(110deg,var(--raised),var(--surface));border-top:2px solid var(--accent)}
.ch-top>span>svg{color:var(--accent)}.ch-orbit>span{color:var(--accent);background:var(--accent-dim)}.ch-orbit.is-success>span{color:var(--ok);background:color-mix(in srgb,var(--ok) 12%,var(--surface))}
.ch-journey li.current{background:linear-gradient(90deg,var(--accent-dim),transparent);border-radius:6px;padding:10px;margin:-4px -10px 14px}.ch-journey li.current:before{left:24px;top:39px}.ch-journey li.current:last-child{background:color-mix(in srgb,var(--ok) 10%,transparent);margin-bottom:0}.ch-journey li.done>span{color:var(--ok);border-color:var(--ok);background:color-mix(in srgb,var(--ok) 10%,var(--surface))}
.ch-demo{flex-wrap:wrap}.ch-demo .ch-play{width:100%;justify-content:center;font-size:.72rem;padding:9px;background:var(--raised);color:var(--text);border:1px solid var(--line)}.ch-demo .ch-play:hover{border-color:var(--accent)}
.connection-help-dialog[data-state="ready"] .ch-top{border-top-color:var(--ok)}
/* Fixed geometry: changing the active step never moves its circle or connector. */
.ch-journey li,.ch-journey li.current{margin:0;min-height:65px;padding:9px 10px 9px;border-radius:6px;transition:color .3s,background-color .3s}
.ch-journey li:last-child,.ch-journey li.current:last-child{padding:9px 10px;min-height:58px;margin:0}
.ch-journey li:not(:last-child):before,.ch-journey li.current:not(:last-child):before{left:24px;top:38px;bottom:-9px;z-index:0}
.ch-journey li>span{position:relative;z-index:1;background:var(--surface);transition:background .35s,border-color .35s,color .35s;flex:0 0 29px}
.ch-journey li.current>span{box-shadow:0 0 0 4px var(--accent-dim);animation:ch-node-in .4s ease both}
.ch-journey li.done>span svg{animation:ch-node-check .35s ease both}
.ch-journey li small{min-height:20px;animation:ch-open .25s ease both}
.ch-journey li>div{min-width:0}.ch-progress-summary{display:flex;justify-content:space-between;font-size:.65rem;color:var(--muted);margin:0 0 9px}.ch-progress-summary b{font-weight:500;font-variant-numeric:tabular-nums}
.ch-progress-track{height:4px;background:var(--line);border-radius:8px;overflow:hidden;margin-bottom:17px}.ch-progress-track>span{display:block;height:100%;width:var(--progress);background:var(--accent);border-radius:inherit;animation:ch-fill .5s ease both;transform-origin:left}
[data-state="ready"] .ch-progress-track>span{background:var(--ok)}
.ch-cooldown{flex-basis:100%;text-align:center;font-size:.67rem;line-height:1.4;margin:0;color:var(--muted)}
@keyframes ch-node-in{from{box-shadow:0 0 0 0 transparent}to{box-shadow:0 0 0 4px var(--accent-dim)}}@keyframes ch-node-check{from{opacity:0;transform:scale(.65)}to{opacity:1;transform:scale(1)}}@keyframes ch-fill{from{opacity:.4;transform:scaleX(.92)}to{opacity:1;transform:scaleX(1)}}
.ch-journey li,.ch-journey li.current,.ch-journey li:last-child,.ch-journey li.current:last-child{min-height:49px;height:49px;padding:9px 10px;margin:0}
.ch-step-description{font-size:.72rem;line-height:1.55;min-height:38px;margin:12px 10px 0;color:var(--muted);animation:ch-open .25s ease both}
@keyframes ch-fill{from{width:var(--previous,0%)}to{width:var(--progress)}}
/* Passive feedback, not another action: only while the next screen is automatic. */
.ch-activity{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:6px;background:var(--raised);text-align:left;animation:ch-open .25s ease both}
.ch-activity strong{display:block;font-size:.76rem;font-weight:600;color:var(--text)}.ch-activity small{display:block;font-size:.67rem;line-height:1.5;margin-top:3px;color:var(--muted)}
.ch-activity-spinner{width:19px;height:19px;flex:0 0 19px;border:2px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:ch-spin 1s linear infinite}
@media(prefers-reduced-motion:reduce){.ch-activity,.ch-activity-spinner{animation:none!important}}

/* Overview: separate access requests from server maintenance. */
.overview-rules .connection-help-trigger{margin:0 0 18px;width:100%;border-color:var(--accent);background:var(--accent-dim)}
.overview-connect [data-action="request-whitelist"]:not(:disabled){border-color:var(--accent);background:var(--accent-dim);color:var(--text);font-weight:650;padding:12px 16px}
.overview-maintenance-link{border:0;background:none;color:var(--accent);font:inherit;font-size:.7rem;text-align:left;padding:8px 0 0;cursor:pointer}
.overview-maintenance-link[hidden]{display:none}
#overview-stats .stat.is-maintaining{border-color:var(--accent)}
#overview-stats .stat.is-maintaining>strong{font-size:1.05rem;line-height:1.35;color:var(--accent)}
.ch-demo{flex-wrap:wrap}.ch-demo select{max-width:100%}

/* Compact status control: live signal, stage feedback and one relevant action. */
.server-status-content{margin-top:6px}.server-status-head{display:flex;align-items:center;gap:10px;min-height:26px}.server-status-head strong{font-size:1.08rem;line-height:1.3;letter-spacing:-.02em}.server-status-content p{font-size:.69rem;color:var(--muted);margin:5px 0 0;line-height:1.4}
.server-status-beacon{width:10px;height:10px;border-radius:50%;background:#778185;flex:none;box-shadow:0 0 0 4px #77818518}.online .server-status-beacon{background:#8bce9e;box-shadow:0 0 0 4px #8bce9e20,0 0 10px #8bce9e35}.working .server-status-beacon{background:var(--accent);box-shadow:0 0 0 4px var(--accent-dim);animation:server-beacon 1.8s ease-in-out infinite}
.server-stage-bars{display:flex;gap:4px;margin-top:10px}.server-stage-bars i{flex:1;height:3px;border-radius:3px;background:var(--line);overflow:hidden}.server-stage-bars .done{background:var(--accent)}.server-stage-bars .current:after{content:'';display:block;width:55%;height:100%;background:var(--accent);animation:server-stage 1.4s ease-in-out infinite}
.server-status-actions{display:flex;margin-top:8px;min-height:24px;align-items:center}.server-status-actions button{border:0;border-radius:4px;background:transparent;color:var(--accent);font-size:.7rem;line-height:1.4;padding:3px 0;text-align:left;cursor:pointer;margin:0}.server-status-actions button:hover{color:var(--text)}.server-status-actions .connection-help-trigger{display:flex;gap:7px;width:auto;font-weight:600}.server-status-actions .connection-help-trigger svg{width:15px;height:15px}.server-status-actions button:disabled{cursor:default;color:var(--muted);opacity:.65}.server-status-actions button[hidden]{display:none}.server-status-actions button:focus-visible{outline:1px solid var(--accent);outline-offset:4px}
.cover-status .status-dot.online{background:#8bce9e;box-shadow:0 0 0 3px #8bce9e20}
@keyframes server-stage{from{transform:translateX(-100%)}to{transform:translateX(280%)}}@keyframes server-beacon{50%{box-shadow:0 0 0 6px var(--accent-dim)}}
@media(prefers-reduced-motion:reduce){.working .server-status-beacon,.server-stage-bars .current:after{animation:none}}

.ch-history {width:100%;text-align:left;margin:12px 0}.ch-history-label{font-size:11px;text-transform:uppercase;letter-spacing:.12em;opacity:.65}.ch-history ol{list-style:none;padding:0;margin:8px 0;display:grid;grid-template-columns:1fr 1fr;gap:7px 16px}.ch-history li{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;border-left:2px solid #708b63;padding-left:8px}.ch-history time{font-size:10px;opacity:.55;font-variant-numeric:tabular-nums}.ch-history .latest{border-color:#d3ab6c}.ch-history-gap{color:#d3ab6c;font-size:12px}@media(max-width:480px){.ch-history ol{grid-template-columns:1fr}}
