html { overflow-x:hidden; }

.tool-hero { text-align:center; padding:2.25rem 0 2.2rem; animation:hc-reveal .68s var(--ease-standard) both; }
.tool-hero h1 { position:relative; margin-bottom:.75rem; font-size:clamp(2.15rem,4vw,3rem); line-height:1.1; letter-spacing:-.045em; }
.tool-hero h1::after { position:absolute; z-index:-1; right:15%; bottom:-.1rem; width:38%; height:1rem; border-radius:50%; background:linear-gradient(90deg,rgba(20,184,166,.18),rgba(59,130,246,.22)); content:""; filter:blur(14px); }
.tool-hero p { max-width:42rem; margin:0 auto; color:var(--color-muted); font-size:.9rem; }

.query-panel { padding:clamp(1.2rem,2.6vw,1.8rem); border-color:rgba(255,255,255,.84); border-radius:1rem; box-shadow:0 14px 38px -25px rgba(15,23,42,.35),0 16px 42px -32px rgba(13,148,136,.55); animation:hc-reveal .7s 90ms var(--ease-standard) both; }
.query-form { display:grid; grid-template-columns:1fr auto; gap:var(--space-3); align-items:start; }
.query-form .field-message { grid-column:1/-1; margin-bottom:-.2rem; }
.query-form .field { min-height:3.5rem; min-width:0; width:100%; }

.state-panel { position:relative; min-height:15rem; padding:clamp(1.2rem,2.6vw,1.8rem); overflow:hidden; border-color:rgba(255,255,255,.84); border-radius:1rem; box-shadow:0 18px 48px -34px rgba(15,23,42,.38); animation:hc-reveal .72s 170ms var(--ease-standard) both; margin-top:var(--space-6); }
.state-panel::before { position:absolute; z-index:-1; top:-9rem; right:-8rem; width:20rem; height:20rem; border-radius:50%; background:rgba(59,130,246,.1); content:""; filter:blur(42px); pointer-events:none; }
.state-empty,.state-loading,.state-error { display:grid; min-height:13rem; place-content:center; justify-items:center; gap:var(--space-3); color:var(--color-muted); text-align:center; animation:state-enter .34s var(--ease-standard) both; }
.state-illustration { display:grid; width:3.4rem; height:3.4rem; place-items:center; color:var(--color-brand); border-radius:50%; background:var(--color-brand-soft); }
.state-error .state-illustration { color:var(--color-danger); background:var(--color-danger-soft); }

.status-hero { display:flex; align-items:center; gap:var(--space-5); padding:var(--space-4) 0; border-bottom:1px solid var(--color-border); margin-bottom:1.2rem; flex-wrap:wrap; }
.status-code { font-size:3.5rem; font-weight:800; line-height:1; letter-spacing:-.04em; }
.status-code.ok { color:var(--color-success); }
.status-code.redirect { color:var(--color-warning); }
.status-code.error { color:var(--color-danger); }
.status-detail { flex:1; min-width:0; }
.status-detail p { margin:0 0 .25rem 0; overflow-wrap:anywhere; word-break:break-all; }
.status-detail .status-url { font-size:.9rem; color:var(--color-ink-soft); font-family:ui-monospace,SFMono-Regular,Consolas,monospace; }

.info-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; border:1px solid var(--color-border); border-radius:var(--radius-md); overflow:hidden; background:var(--color-border); margin-bottom:var(--space-5); }
.info-item { min-width:0; padding:.65rem .85rem; background:rgba(255,255,255,.78); }
.info-item:hover { background:rgba(240,253,250,.78); }
.info-label { display:block; margin-bottom:.15rem; color:var(--color-faint); font-size:.72rem; font-weight:700; }
.info-value { margin:0; overflow-wrap:anywhere; color:var(--color-ink-soft); font-size:.86rem; word-break:break-all; }
.info-mono { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:.82rem; }

.section-title { margin-bottom:var(--space-3); font-size:.92rem; color:var(--color-muted); display:flex; align-items:center; gap:var(--space-2); }

.redirect-table { width:100%; border-collapse:collapse; border:1px solid var(--color-border); border-radius:var(--radius-md); overflow:hidden; margin-bottom:var(--space-5); font-size:.85rem; }
.redirect-table th { padding:.55rem .7rem; background:rgba(248,250,252,.9); color:var(--color-muted); font-size:.75rem; font-weight:700; text-align:left; }
.redirect-table td { padding:.55rem .7rem; border-top:1px solid var(--color-border); color:var(--color-ink-soft); font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:.81rem; word-break:break-all; }
.redirect-none { padding:var(--space-4); border:1px solid var(--color-border); border-radius:var(--radius-md); color:var(--color-muted); text-align:center; font-size:.84rem; background:rgba(248,250,252,.7); margin-bottom:var(--space-5); }

.security-header-list { display:grid; gap:var(--space-2); margin-bottom:var(--space-5); }
.security-row { display:flex; flex-wrap:wrap; align-items:flex-start; gap:var(--space-2); padding:.5rem .7rem; border:1px solid var(--color-border); border-radius:var(--radius-md); background:rgba(255,255,255,.55); }
.security-row .sec-name { color:var(--color-ink-soft); font-weight:700; font-size:.8rem; font-family:ui-monospace,SFMono-Regular,Consolas,monospace; overflow-wrap:anywhere; min-width:10rem; flex-shrink:0; padding-top:.15rem; }
.sec-value-wrap { flex:1; min-width:0; display:flex; flex-wrap:wrap; align-items:baseline; gap:var(--space-2); }
.sec-value { font-size:.82rem; overflow-wrap:anywhere; word-break:break-all; }
.sec-value.present { color:var(--color-ink-soft); }
.sec-value.absent { color:var(--color-faint); }
.sec-toggle { display:inline-flex; align-items:center; padding:.15rem .45rem; border:1px solid var(--color-border); border-radius:var(--radius-sm); background:#fff; color:var(--color-brand-strong); font-size:.72rem; cursor:pointer; white-space:nowrap; }
.sec-toggle:hover { background:var(--color-brand-soft); }

.cert-status-bar { display:flex; justify-content:space-between; align-items:center; padding:.7rem 1rem; border-radius:var(--radius-md); margin-bottom:var(--space-4); background:var(--color-success-soft); color:var(--color-success); font-weight:700; font-size:.9rem; }
.cert-status-bar.cert-good { background:var(--color-success-soft); color:var(--color-success); }
.cert-status-bar.cert-warn { background:var(--color-warning-soft); color:var(--color-warning); }
.cert-status-bar.cert-bad { background:var(--color-danger-soft); color:var(--color-danger); }
.cert-days { font-size:1.1rem; font-weight:800; }

.cert-grid { display:grid; grid-template-columns:1fr 1fr; gap:var(--space-3); margin-bottom:var(--space-3); }
.cert-dn-block { border:1px solid var(--color-border); border-radius:var(--radius-md); padding:.7rem .85rem; background:rgba(255,255,255,.6); }
.cert-dn-title { font-size:.75rem; font-weight:700; color:var(--color-faint); margin-bottom:.35rem; }
.cert-dn-list { margin:0; }
.cert-dn-list dt { font-size:.7rem; color:var(--color-faint); }
.cert-dn-list dd { margin:0 0 .3rem .5rem; font-size:.84rem; color:var(--color-ink-soft); overflow-wrap:anywhere; word-break:break-word; }
.cert-dn-list dd:last-child { margin-bottom:0; }
.cert-dn-empty { margin:0; font-size:.82rem; color:var(--color-muted); }

.cert-time-row { display:grid; grid-template-columns:1fr 1fr; gap:var(--space-3); }
.cert-time-item { border:1px solid var(--color-border); border-radius:var(--radius-md); padding:.55rem .85rem; background:rgba(255,255,255,.6); }
.cert-time-label { display:block; font-size:.72rem; color:var(--color-faint); margin-bottom:.15rem; }
.cert-time-value { font-size:.84rem; color:var(--color-ink-soft); font-family:ui-monospace,SFMono-Regular,Consolas,monospace; overflow-wrap:anywhere; }

details { margin-bottom:var(--space-5); border:1px solid var(--color-border); border-radius:var(--radius-md); background:rgba(248,250,252,.92); }
details summary { padding:.8rem 1rem; cursor:pointer; font-weight:700; font-size:.86rem; }
details[open] summary { border-bottom:1px solid var(--color-border); }
details .details-inner { min-width:0; padding:1rem; }

.workspace-actions-secondary { display:flex; flex-wrap:wrap; gap:var(--space-3); justify-content:center; border-top:1px solid var(--color-border); padding-top:var(--space-4); margin-top:var(--space-4); }
.workspace-actions-secondary .button svg { width:1.15em; height:1.15em; }
.privacy-note { margin:var(--space-5) 0 0; color:var(--color-muted); font-size:.82rem; }

@keyframes hc-reveal { from{opacity:0;transform:translateY(14px)} to{opacity:1;transform:translateY(0)} }
@keyframes state-enter { from{opacity:0;transform:translateY(7px)} to{opacity:1;transform:translateY(0)} }

@media (max-width:720px) {
  .tool-hero{padding-top:1.8rem} .query-form{grid-template-columns:1fr} .query-form .button{width:100%}
  .info-grid{grid-template-columns:repeat(2,1fr)} .status-hero{flex-direction:column;align-items:flex-start;gap:var(--space-3)}
  .security-row{flex-direction:column}
  .security-row .sec-name{min-width:0}
  .cert-grid{grid-template-columns:1fr}
  .cert-time-row{grid-template-columns:1fr}
}
@media (max-width:560px) {
  .tool-hero{padding-top:1.25rem} .tool-hero h1{font-size:2.25rem} .info-grid{grid-template-columns:1fr}
  .status-code{font-size:2.5rem}
  .redirect-table,.redirect-table tbody,.redirect-table tr,.redirect-table td{display:block;width:100%}
  .redirect-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .redirect-table tr{padding:.35rem 0;border-top:1px solid var(--color-border)}
  .redirect-table tr:first-child{border-top:0}
  .redirect-table td{display:grid;grid-template-columns:5.5rem minmax(0,1fr);gap:.5rem;border-top:0;padding:.35rem .55rem;font-size:.76rem}
  .redirect-table td::before{content:attr(data-label);color:var(--color-faint);font-family:var(--font-sans);font-weight:700}
}
@media (max-width:390px) {
  .state-panel{padding:1rem} .status-code{font-size:2rem} .info-item{padding:.5rem .6rem}
  .redirect-table td,.redirect-table th{padding:.4rem .5rem;font-size:.75rem}
}