:root{color-scheme:dark;--bg:#090d12;--panel:#101720;--panel2:#0d141b;--line:#24323a;--text:#e9f1f1;--muted:#8c9d9f;--green:#53f0ad;--green2:#183e31;--red:#ff7f87;--yellow:#f2c76c;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 80% 0%,#10271e 0,transparent 30rem),var(--bg);color:var(--text);line-height:1.5}.shell{max-width:1240px;margin:auto;padding:0 22px}.topbar{height:74px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.brand{font-size:19px;font-weight:850;letter-spacing:-.04em;color:var(--text);text-decoration:none}.brand span{display:block;margin-top:-3px;color:var(--muted);font-size:9px;letter-spacing:.14em}.security{font-size:10px;letter-spacing:.1em;color:var(--green);display:flex;align-items:center;gap:8px}.security i{width:7px;height:7px;background:var(--green);border-radius:50%;box-shadow:0 0 14px #53f0ad80}.hero{padding:38px 0 24px}.eyebrow{font-size:10px;letter-spacing:.16em;font-weight:800;color:var(--green);margin:0 0 8px}.hero h1{font-size:clamp(32px,5vw,52px);line-height:1.05;letter-spacing:-.05em;margin:0 0 12px}.hero h1 span{color:var(--green)}.hero p:last-child{max-width:760px;color:var(--muted);margin:0}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:12px 0 18px}.stats article,.panel{background:linear-gradient(145deg,#111a22,#0c1319);border:1px solid var(--line);border-radius:16px}.stats article{padding:17px}.stats span,.stats small{display:block;color:var(--muted);font-size:12px}.stats strong{display:block;font-size:29px;letter-spacing:-.04em;margin:5px 0;font-variant-numeric:tabular-nums}.panel{padding:21px;margin-bottom:18px}.panel-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}.panel h2{font-size:20px;letter-spacing:-.025em;margin:0 0 5px}.panel-heading p:not(.eyebrow){color:var(--muted);font-size:12px;margin:0;max-width:650px}.filters{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.filters label{font-size:12px;color:var(--muted)}select,input,button{font:inherit}select,.form-grid input:not([type=checkbox]){background:#091016;border:1px solid #2a3d43;border-radius:9px;color:var(--text);padding:10px 11px;min-width:0;outline:none}input:focus,select:focus{border-color:var(--green)}.btn{border:1px solid #2c4745;border-radius:9px;padding:10px 13px;font-weight:750;font-size:12px;cursor:pointer;color:var(--text);background:#12221f;transition:transform .12s,border-color .12s}.btn:hover{border-color:var(--green)}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.primary{background:var(--green);color:#04120c;border-color:var(--green)}.btn.secondary{background:#0b1318}.chart{min-height:150px;display:flex;align-items:stretch;gap:9px;padding:15px 2px 7px;border-bottom:1px solid var(--line)}.day-bar{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px;flex:1;min-width:0}.day-bar .number{font-size:10px;color:#b8c5c6}.bar{width:min(34px,70%);height:80px;max-height:100%;min-height:2px;border-radius:6px 6px 2px 2px;background:#255944;position:relative;overflow:hidden}.bar .bad{position:absolute;bottom:0;left:0;right:0;background:#a94b57}.day-bar time{font-size:10px;color:var(--muted);white-space:nowrap}.columns{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin-top:22px}.panel h3{font-size:13px;margin:0 0 10px}.stack-list{display:grid;gap:9px}.list-row{padding:11px 12px;border:1px solid #233139;background:#0a1117;border-radius:10px;min-width:0}.list-row .row-head{display:flex;justify-content:space-between;align-items:center;gap:10px}.list-row strong{font-size:12px;overflow-wrap:anywhere}.list-row small,.list-row p{display:block;color:var(--muted);font-size:11px;margin:5px 0 0;overflow-wrap:anywhere}.pill{border:1px solid #315446;color:var(--green);background:#11271d;padding:3px 7px;border-radius:100px;font-size:9px;font-weight:850;white-space:nowrap}.pill.bad{border-color:#70424a;color:var(--red);background:#281419}.pill.warn{border-color:#6b562b;color:var(--yellow);background:#2b2414}.bar-line{height:4px;background:#23343a;border-radius:10px;overflow:hidden;margin-top:8px}.bar-line i{display:block;height:100%;background:var(--green);width:0}.alert-area{border-top:1px solid var(--line);margin-top:22px;padding-top:20px}.muted{color:var(--muted);font-size:12px}.grid-two{display:grid;grid-template-columns:1fr 1fr;gap:18px}.grid-two .panel{min-width:0}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.form-grid label{display:grid;gap:6px;color:#b5c4c5;font-size:11px;font-weight:700}.form-grid input{width:100%}.form-grid .check{display:flex;align-items:center;gap:9px}.check input{accent-color:var(--green)}.full{grid-column:1/-1}.warning{color:var(--yellow);font-size:11px;line-height:1.5;margin:0;padding:10px;border:1px solid #57482a;background:#1e1a10;border-radius:9px}.message{font-size:12px;color:var(--muted);margin-bottom:0}.message.error{color:var(--red)}.message.success{color:var(--green)}.created{margin-top:16px;padding:13px;border:1px solid #347456;background:#0c1c15;border-radius:12px}.created strong{display:block;color:var(--green);font-size:12px}.created code{display:block;overflow-wrap:anywhere;padding:10px;background:#080f0c;border:1px solid #244a38;border-radius:8px;margin:9px 0;font-size:11px}.created h3{margin-top:15px}.created pre{white-space:pre-wrap;overflow-wrap:anywhere;max-height:200px;overflow:auto;color:#c6d5d2;background:#080f0c;padding:10px;border-radius:8px;font-size:10px}.key-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}.key-actions .btn{padding:7px 9px}.endpoint-panel{display:flex;align-items:center;justify-content:space-between;gap:20px}.endpoint-panel h2{font-size:18px}.endpoint-panel p{margin:0}.endpoint-links{display:flex;gap:12px;flex-wrap:wrap}.endpoint-links a{color:var(--green);font-size:11px;text-decoration:none}.endpoint-links a:hover{text-decoration:underline}footer{padding:20px 0 32px;color:var(--muted);font-size:11px;display:flex;justify-content:space-between;gap:15px}footer span{color:#637477}@media(max-width:850px){.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-two{grid-template-columns:1fr}.endpoint-panel{align-items:flex-start;flex-direction:column}}@media(max-width:560px){.shell{padding:0 12px}.topbar{height:64px}.hero{padding-top:27px}.panel{padding:15px;border-radius:13px}.stats{gap:8px}.stats article{padding:12px}.stats strong{font-size:25px}.columns{grid-template-columns:1fr}.panel-heading{flex-direction:column}.filters{width:100%}.form-grid{grid-template-columns:1fr}.full{grid-column:auto}.endpoint-links{display:grid;gap:9px}footer{flex-direction:column}.chart{gap:3px}.day-bar time{font-size:9px}}

.auth-panel { margin-bottom: 20px; }
.auth-panel .form-grid { align-items: end; }
.auth-panel .key-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: end; }
.auth-panel input[type=password] { width: 100%; min-height: 44px; border: 1px solid var(--line, #27313d); border-radius: 10px; padding: 10px 12px; background: var(--panel, #101720); color: inherit; font: inherit; }


/* Mobile-safe layout and form controls. */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { min-width: 0; overflow-x: hidden; }
.shell { width: 100%; min-width: 0; }
main, section, article, .panel, .panel-heading, .grid-two, .columns, .form-grid, .stats,
.list-row, .list-row .row-head, .auth-panel, .auth-panel .panel-heading > div { min-width: 0; }
.panel p, .panel h2, .panel h3, .form-grid label, .form-grid label span,
.list-row small, .list-row strong, .message, .warning, footer, .created code, .created pre {
  overflow-wrap: anywhere;
  word-break: normal;
}
.form-grid input, .form-grid select, .filters select, .auth-panel input[type=password] {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
.auth-panel input[type=password] { min-height: 48px; }
.auth-panel .key-actions .btn { min-height: 44px; }
.row-head { min-width: 0; }
.pill { max-width: 100%; overflow-wrap: anywhere; }
.chart { overflow-x: auto; overscroll-behavior-x: contain; }
.day-bar { flex: 0 0 26px; }
button, .btn { touch-action: manipulation; }

@media (max-width: 850px) {
  .shell { padding-left: 16px; padding-right: 16px; }
  .panel-heading { gap: 12px; }
  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid-two { grid-template-columns: minmax(0, 1fr); }
  .columns { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .form-grid { grid-template-columns: minmax(0, 1fr); }
  .form-grid .full { grid-column: 1; }
  .auth-panel .form-grid { grid-template-columns: minmax(0, 1fr); align-items: stretch; }
  .auth-panel .key-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; margin-top: 0; }
  .auth-panel .key-actions .btn { width: 100%; min-width: 0; }
  .form-grid .check { align-items: flex-start; gap: 10px; }
  .form-grid .check input { flex: 0 0 20px; width: 20px; height: 20px; margin-top: 2px; }
  .endpoint-panel { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 560px) {
  .shell { padding-left: 11px; padding-right: 11px; }
  .topbar { min-height: 62px; height: auto; padding: 10px 0; gap: 10px; }
  .brand { font-size: 17px; min-width: 0; }
  .brand span { font-size: 8px; letter-spacing: .1em; overflow-wrap: anywhere; }
  .security { flex: 0 0 auto; font-size: 9px; letter-spacing: .06em; gap: 5px; }
  .hero { padding: 26px 0 18px; }
  .hero h1 { font-size: clamp(30px, 9vw, 42px); overflow-wrap: anywhere; }
  .panel { padding: 13px; border-radius: 13px; }
  .panel h2 { font-size: 19px; }
  .panel-heading { flex-direction: column; align-items: stretch; }
  .stats { gap: 8px; }
  .stats article { padding: 11px; }
  .stats span, .stats small { font-size: 11px; }
  .stats strong { font-size: 23px; }
  input, select, button, textarea { font-size: 16px; }
  .form-grid { gap: 12px; }
  .form-grid label { font-size: 12px; }
  .form-grid input:not([type=checkbox]), .form-grid select, .filters select { min-height: 46px; padding: 11px 12px; }
  .form-grid .check span { line-height: 1.45; }
  .warning { font-size: 12px; padding: 11px; }
  .filters { display: grid; grid-template-columns: minmax(0, 1fr); align-items: stretch; width: 100%; }
  .filters select, .filters .btn { width: 100%; min-width: 0; min-height: 42px; }
  .chart { gap: 5px; padding-left: 4px; padding-right: 4px; }
  .day-bar { flex-basis: 27px; }
  .day-bar time { font-size: 9px; }
  .list-row .row-head { align-items: flex-start; flex-wrap: wrap; gap: 7px; }
  .pill { white-space: normal; font-size: 10px; }
  .key-actions { gap: 8px; }
  .key-actions .btn { min-height: 42px; }
  .auth-panel .key-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .endpoint-links { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .endpoint-links a { font-size: 13px; overflow-wrap: anywhere; }
  footer { flex-direction: column; gap: 7px; }
}
@media (max-width: 360px) {
  .shell { padding-left: 9px; padding-right: 9px; }
  .security { font-size: 8px; }
  .auth-panel .key-actions { grid-template-columns: minmax(0, 1fr); }
  .stats { grid-template-columns: minmax(0, 1fr); }
  .stats strong { font-size: 25px; }
}

/* Simplified API key creation */
.advanced-settings{border:1px solid var(--line);border-radius:10px;padding:12px;min-width:0}
.advanced-settings summary{cursor:pointer;color:var(--green);font-size:12px;font-weight:800;min-height:28px;display:flex;align-items:center}
.advanced-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}
.advanced-grid label{display:grid;gap:6px;color:#b5c4c5;font-size:11px;font-weight:700;min-width:0}
.advanced-grid input{width:100%;min-width:0;background:#091016;border:1px solid #2a3d43;border-radius:9px;color:var(--text);padding:10px 11px;font:inherit}
.info-note{font-size:12px;line-height:1.55;color:#b7cec6;margin:0;padding:12px;border:1px solid #285442;background:#0d1e17;border-radius:10px;overflow-wrap:anywhere}
@media(max-width:560px){.advanced-grid{grid-template-columns:minmax(0,1fr)}.advanced-grid input{min-height:46px;font-size:16px}.advanced-settings{padding:11px}.info-note{font-size:12px}}
