:root{
    --bg:#070707; --card:#0e0e0e; --border:#242424;
    --text:#ededed; --muted:#a8a8a8;
    --warn:#ffcc00; --accent:#ff2d55;
}

html,body{height:100%}
body{
    margin:0;
    background: radial-gradient(1200px 700px at 50% -10%, #151515, var(--bg));
    color:var(--text);
    font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}

.hcs-shell{max-width:900px;margin:0 auto;padding:22px 16px 48px}
.hcs-wrap{max-width:900px;margin:0 auto}
.hcs-card{
    background: linear-gradient(180deg,#101010,var(--card));
    border:1px solid var(--border);
    border-radius:18px;
    padding:18px;
    box-shadow:0 16px 40px rgba(0,0,0,.45);
}

.hcs-title{font-size:30px;font-weight:900;margin:0 0 8px;letter-spacing:.2px}
.hcs-sub{margin:0 0 18px;color:var(--muted)}

.hcs-row{display:flex;gap:14px;flex-wrap:wrap;align-items:end}
.hcs-input{flex:1 1 260px}
.hcs-input label{display:block;font-size:12px;color:var(--muted);margin-bottom:6px}
.hcs-input input{
    width:100%;padding:10px 12px;border-radius:12px;
    border:1px solid var(--border);background:#090909;color:var(--text)
}

.hcs-btn{
    background:var(--text);color:#000;border:none;
    padding:10px 14px;border-radius:12px;font-weight:900;cursor:pointer
}
.hcs-btn:disabled{opacity:.5;cursor:not-allowed}

.hcs-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.hcs-linkbox{
    background:#090909;border:1px solid var(--border);border-radius:12px;
    padding:10px 12px;word-break:break-all
}

.hcs-copyrow{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center}
.hcs-iconbtn{
    padding:10px 12px;border-radius:12px;border:1px solid var(--border);
    background:#090909;color:var(--text);text-decoration:none;font-weight:900;cursor:pointer;white-space:nowrap
}

.hcs-warn{color:var(--warn)}
.hcs-toast{
    margin-top:12px;padding:10px 12px;border-radius:12px;border:1px solid var(--border);
    background:#090909;color:var(--muted)
}

.hcs-graph svg{
    width:100%;max-width:560px;height:auto;border-radius:14px;border:1px solid var(--border)
}
.hcs-graph .bg{fill:#090909}
.hcs-graph .grid{stroke:#1b1b1b;stroke-width:.5}
.hcs-graph .axis{stroke:#3a3a3a;stroke-width:1}
.hcs-graph .median{stroke:#3a3a3a;stroke-width:1.2;stroke-dasharray:3 3;opacity:.85}
.hcs-graph .trail{fill:none;stroke:#5a5a5a;stroke-width:.9;opacity:.8}
.hcs-graph .trail-dot{fill:#6a6a6a;opacity:.9}
.hcs-graph .dot{fill:var(--accent)}
.hcs-graph .label{fill:#8a8a8a;font-size:4px;user-select:none}
.hcs-graph .readout{margin-top:10px;display:flex;gap:14px;color:var(--muted)}
