:root{
  --display:'Sora',Arial,sans-serif;--body:'Inter',Arial,sans-serif;--mono:'IBM Plex Mono',monospace;
  --bg:#0b0e14;--panel:#11151e;--panel-2:#161b24;--line:#2f3744;--text:#eef2f8;--muted:#9ea8ba;--red:#d71920;--cyan:#57c7ff;--green:#58d48b;--yellow:#ffc857;--shadow:0 18px 50px rgba(0,0,0,.34)
}
*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:var(--body);font-size:16px;line-height:1.65;background:radial-gradient(circle at top left,#161b24 0,#0b0e14 45%),#0b0e14;color:var(--text)}a{text-decoration:none;color:inherit}
.site-header{position:sticky;top:0;z-index:40;backdrop-filter:blur(14px);background:rgba(11,14,20,.82);border-bottom:1px solid rgba(255,255,255,.06)}
.header-inner{max-width:1320px;margin:auto;padding:14px 24px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand img{height:44px;width:auto;background:#fff;border-radius:8px;padding:6px 10px}.top-nav{display:flex;gap:16px;align-items:center}.top-nav>a,.dropbtn{color:#f5f7fb;font-weight:600;padding:10px 14px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:rgba(255,255,255,.02);cursor:pointer}.dropdown{position:relative}.dropdown:hover .dropdown-panel,.dropdown:focus-within .dropdown-panel,.dropdown.is-open .dropdown-panel{opacity:1;transform:translateY(0);pointer-events:auto;visibility:visible}.dropdown-panel{position:absolute;top:calc(100% - 1px);left:0;min-width:320px;max-height:72vh;overflow:auto;display:grid;grid-template-columns:1fr;gap:6px;background:#121722;border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:12px;box-shadow:var(--shadow);opacity:0;transform:translateY(8px);pointer-events:none;visibility:hidden;transition:opacity .18s ease,transform .18s ease,visibility 0s linear .18s;z-index:120}.dropdown:hover .dropdown-panel,.dropdown:focus-within .dropdown-panel,.dropdown.is-open .dropdown-panel{transition-delay:0s}.dropdown-panel a{padding:12px 14px;border-radius:12px;color:var(--text)}.dropdown-panel a:hover{background:rgba(255,255,255,.05);color:#fff}
.page-shell{max-width:1320px;margin:auto;padding:34px 24px 60px}.hero-panel{display:grid;grid-template-columns:1.45fr .95fr;gap:24px;align-items:stretch}.hero-copy,.hero-side{background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.01));border:1px solid rgba(255,255,255,.08);border-radius:26px;padding:30px;box-shadow:var(--shadow)}
.kicker{display:inline-flex;align-items:center;gap:8px;background:rgba(215,25,32,.12);color:#ffd4d6;border:1px solid rgba(215,25,32,.35);padding:8px 12px;border-radius:999px;font-size:12px;font-weight:700;letter-spacing:.08em}.hero-copy h1{font-size:clamp(34px,4vw,58px);line-height:1.02;margin:16px 0 12px}.hero-copy p{color:var(--muted);font-size:17px;line-height:1.7;max-width:760px}.hero-list{display:grid;grid-template-columns:repeat(2,minmax(180px,1fr));gap:12px;margin-top:18px}.hero-list div{background:rgba(255,255,255,.03);padding:14px;border-radius:16px;border:1px solid rgba(255,255,255,.05)}.hero-list strong{display:block;color:#fff;font-size:15px;margin-bottom:5px}.hero-side{display:flex;flex-direction:column;gap:14px;justify-content:space-between}.side-note{color:var(--muted);line-height:1.65}.cta-row{display:flex;gap:12px;flex-wrap:wrap}.btn,.btn-secondary{border:none;border-radius:14px;padding:12px 18px;font-weight:700;cursor:pointer}.btn{background:var(--red);color:#fff}.btn-secondary{background:#202634;color:#fff;border:1px solid rgba(255,255,255,.08)}
.section-title{display:flex;align-items:end;justify-content:space-between;gap:16px;margin:34px 0 14px}.section-title h2{margin:0;font-size:30px}.section-title p{margin:0;color:var(--muted)}
.tool-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}.tool-card{background:linear-gradient(180deg,#11151f,#141925);border:1px solid rgba(255,255,255,.08);border-radius:22px;padding:20px;box-shadow:var(--shadow);transition:transform .18s ease,border-color .18s ease,background .18s ease;position:relative;overflow:hidden}.tool-card:before{content:"";position:absolute;inset:auto -30% -40% auto;width:180px;height:180px;background:radial-gradient(circle,rgba(215,25,32,.22),transparent 58%);pointer-events:none}.tool-card:hover{transform:translateY(-4px);border-color:rgba(87,199,255,.35);background:linear-gradient(180deg,#151a26,#10151e)}.card-tag{display:inline-block;font-size:11px;font-weight:800;color:#cbd5e1;background:#1b2230;border:1px solid rgba(255,255,255,.08);padding:6px 10px;border-radius:999px;margin-bottom:14px}.tool-card h3{margin:0 0 8px;font-size:22px}.tool-card p{margin:0;color:var(--muted);line-height:1.6;min-height:72px}.open-link{margin-top:16px;display:inline-flex;color:#fff;font-weight:700}
.note-strip{margin-top:18px;padding:16px 18px;border-left:4px solid var(--red);background:rgba(215,25,32,.08);border-radius:10px;color:#fee}
.page-grid{display:grid;grid-template-columns:260px 1fr;gap:22px;align-items:start}.quick-nav{position:sticky;top:88px;background:#10151e;border:1px solid rgba(255,255,255,.08);border-radius:22px;padding:16px;box-shadow:var(--shadow)}.quick-nav h3{margin:4px 0 12px;font-size:17px}.quick-item{display:block;padding:10px 12px;border-radius:12px;color:var(--muted);font-size:14px;margin-bottom:4px}.quick-item:hover,.quick-item.active{background:rgba(87,199,255,.10);color:#fff}
.tool-page{display:grid;gap:22px}.card{background:linear-gradient(180deg,#11151f,#141925);border:1px solid rgba(255,255,255,.08);border-radius:24px;padding:24px;box-shadow:var(--shadow)}.intro-card h1{margin:8px 0 10px;font-size:42px}.intro-card p{margin:0;color:var(--muted);line-height:1.7}.pill{display:inline-block;font-size:11px;font-weight:800;padding:6px 10px;border-radius:999px;background:#1a2330;border:1px solid rgba(255,255,255,.08);color:#fff}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.full{grid-column:1/-1}.field{display:flex;flex-direction:column;gap:6px}.field label{font-size:13px;font-weight:700;color:#d8deea}.field input,.field select,.field textarea{width:100%;background:#0d1118;color:#fff;border:1px solid #303746;border-radius:14px;padding:12px 13px;font:inherit}.field textarea{min-height:100px;resize:vertical}.action-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px}.result-box{background:#0d1118;border:1px solid #303746;border-radius:18px;padding:18px;min-height:94px;line-height:1.75;color:#eef2f8}.result-box b{font-size:1.04em}.subtle{color:var(--muted);font-size:13px}.status-ok{color:var(--green);font-weight:700}.status-bad{color:#ff7e7e;font-weight:700}.status-warn{color:var(--yellow);font-weight:700}.formula{margin-top:18px;padding-top:18px;border-top:1px solid rgba(255,255,255,.08)}.formula code{display:block;white-space:normal;background:#0c1017;border:1px solid #303746;padding:12px 14px;border-radius:14px;color:#d7e2ef;font-size:13px;line-height:1.65}
.example-wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:18px;align-items:center}.diagram{background:#0d1118;border:1px solid #303746;border-radius:18px;padding:10px}.diagram svg{width:100%;height:auto;display:block}.example-copy p,.source-list li{color:var(--muted);line-height:1.7}.source-list{padding-left:20px}.table-wrap{overflow:auto}.data-table{width:100%;border-collapse:collapse}.data-table th,.data-table td{border-bottom:1px solid rgba(255,255,255,.08);padding:10px 8px;text-align:left;font-size:14px}.data-table th{color:#fff}.data-table td{color:#d8deea}.mini-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px}.metric{padding:14px;background:#0d1118;border:1px solid #303746;border-radius:16px}.metric strong{display:block;font-size:12px;color:var(--muted);margin-bottom:8px}.metric span{font-size:22px;font-weight:800;color:#fff}
.site-footer{max-width:1320px;margin:26px auto 0;padding:0 24px 32px;color:var(--muted);font-size:13px}
.readme{line-height:1.8;color:var(--muted)}
@media (max-width:1020px){.hero-panel,.page-grid,.example-wrap{grid-template-columns:1fr}.quick-nav{position:relative;top:0}.form-grid{grid-template-columns:1fr}.hero-list{grid-template-columns:1fr}.header-inner{flex-direction:column;align-items:flex-start}.top-nav{flex-wrap:wrap}}

.rack-visual{display:flex;flex-direction:column-reverse;gap:6px;min-height:280px;justify-content:flex-start;padding:14px;background:#0d1118;border-radius:12px;border:1px solid #303746}.rack-unit{display:flex;align-items:center;justify-content:center;background:linear-gradient(90deg,#d71920,#8b1116);border-radius:10px;color:#fff;font-weight:700;padding:8px 10px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}

.audit-note{padding:14px 16px;border-radius:16px;background:rgba(255,200,87,.08);border:1px solid rgba(255,200,87,.28);color:#f7e7b4;line-height:1.55}.mini-btn{border:1px solid rgba(255,255,255,.12);background:#202634;color:#fff;border-radius:8px;padding:6px 9px;cursor:pointer}@media print{body{background:#fff;color:#111}.top-nav,.quick-nav,.action-row,.site-footer{display:none!important}.site-header{position:static;background:#fff;border:0}.header-inner{padding:0 0 12px}.brand img{height:42px}.page-grid{display:block}.card,.intro-card{box-shadow:none;border:1px solid #ccc;background:#fff;color:#111}.card p,.subtle,.source-list li{color:#333}.result-box,.formula code,.diagram{background:#fff;color:#111;border-color:#ccc}.kicker,.pill{color:#111;background:#eee}.audit-note{color:#111;background:#fff7df;border-color:#ccc}.rack-unit{color:#fff}}

/* Craftify website integration */
.top-nav a:focus-visible,.dropbtn:focus-visible,.btn:focus-visible,.btn-secondary:focus-visible,.tool-card:focus-visible{outline:3px solid #57c7ff;outline-offset:3px}
.tool-finder{display:grid;grid-template-columns:auto minmax(220px,520px) auto;align-items:center;gap:12px;margin:0 0 18px;padding:14px 16px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.08);border-radius:18px}.tool-finder label{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:#cbd5e1}.tool-finder input{width:100%;background:#0d1118;border:1px solid #303746;border-radius:12px;color:#fff;padding:11px 13px;font:inherit}.tool-finder input:focus{border-color:#57c7ff;outline:none}.tool-finder span{font-size:12px;color:var(--muted);white-space:nowrap}.tool-card[hidden]{display:none!important}
.top-nav>a:first-child{border-color:rgba(215,25,32,.45);background:rgba(215,25,32,.10)}
@media(max-width:720px){.tool-finder{grid-template-columns:1fr}.tool-finder span{justify-self:start}.top-nav{width:100%;gap:8px}.top-nav>a,.dropbtn{padding:9px 10px;font-size:13px}.dropdown-panel{position:fixed;left:12px;right:12px;top:132px;min-width:0;max-height:68vh}.dropdown:focus-within .dropdown-panel{opacity:1;transform:translateY(0);pointer-events:auto}}

/* Production layout hardening */
body{overflow-x:hidden}
.header-inner,.page-shell,.hero-copy,.hero-side,.card,.tool-card,.tool-page,.example-wrap>*{min-width:0}
.hero-copy h1,.intro-card h1,.tool-card h3,.section-title h2,.card h2,.card h3{overflow-wrap:anywhere;text-wrap:balance}
.hero-copy p,.intro-card p,.example-copy p,.source-list li,.result-box,.formula code,.audit-note{overflow-wrap:anywhere;word-break:normal}
.top-nav{min-width:0;flex-wrap:wrap;justify-content:flex-end}
.dropdown-panel{max-width:min(380px,calc(100vw - 32px))}
.source-list a{overflow-wrap:anywhere;word-break:break-word;text-decoration:underline;text-underline-offset:3px}
.data-table{min-width:560px}
.diagram{overflow:hidden}
.diagram svg text{font-family:var(--display)}
.tool-card{display:flex;flex-direction:column}
.tool-card .open-link{margin-top:auto;padding-top:16px}
@media(max-width:1020px){
  .header-inner{align-items:stretch}
  .top-nav{justify-content:flex-start}
  .intro-card h1{font-size:clamp(30px,7vw,42px)}
  .section-title{align-items:flex-start;flex-direction:column}
}
@media(max-width:720px){
  .page-shell{padding:22px 16px 46px}
  .header-inner{padding:12px 16px;gap:12px}
  .brand img{height:40px;max-width:210px;object-fit:contain}
  .top-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
  .top-nav>a,.dropbtn{width:100%;text-align:center;white-space:normal;line-height:1.25}
  .dropdown{min-width:0}
  .dropdown-panel{top:124px}
  .hero-copy,.hero-side,.card{padding:20px}
  .hero-copy h1{font-size:clamp(32px,10vw,44px);line-height:1.06}
  .intro-card h1{font-size:clamp(30px,9vw,38px);line-height:1.08}
  .section-title h2{font-size:26px}
  .tool-grid{grid-template-columns:1fr}
  .tool-card p{min-height:0}
  .result-box{padding:15px}
  .metric span{font-size:19px}
  .data-table th,.data-table td{white-space:normal;min-width:110px}
}
@media(max-width:420px){
  .top-nav{grid-template-columns:1fr 1fr}
  .top-nav>a,.dropbtn{font-size:12px;padding:9px 7px}
  .dropdown-panel{left:8px;right:8px;top:122px}
  .card{border-radius:18px}
  .action-row>.btn,.action-row>.btn-secondary{flex:1 1 100%;text-align:center}
}


/* Unified Craftify typography system */
body,input,select,textarea,button{font-family:var(--body);}
h1,h2,h3,h4,h5,h6{font-family:var(--display);font-weight:700;}
p,li,.side-note,.result-box,.example-copy{font-family:var(--body);}
.kicker,.card-tag,.pill,.tool-finder label,.subtle,.field label,.formula code,.data-table th,.data-table td,.metric strong,.site-footer{font-family:var(--mono);}
.top-nav>a,.dropbtn,.btn,.btn-secondary,.open-link,.quick-item{font-family:var(--body);font-weight:600;}
.hero-copy p,.intro-card p,.tool-card p,.example-copy p,.source-list li{line-height:1.68;}


/* Readability scale v8 — AV workspace */
body{font-size:17px;line-height:1.68;}
.top-nav>a,.dropbtn{font-size:15px;}
.dropdown-panel a{font-size:15px;}
.kicker{font-size:13px;}
.hero-copy p{font-size:18px;}
.hero-list strong{font-size:16px;}
.side-note{font-size:16.5px;}
.btn,.btn-secondary{font-size:15px;}
.section-title p{font-size:16px;}
.card-tag,.pill{font-size:12.5px;}
.tool-card p{font-size:16px;line-height:1.68;}
.open-link{font-size:15px;}
.quick-nav h3{font-size:18px;}.quick-item{font-size:15px;}
.intro-card p{font-size:17px;}
.field label{font-size:14px;}.field input,.field select,.field textarea{font-size:16px;}
.subtle{font-size:14px;}
.formula code{font-size:14px;}
.example-copy p,.source-list li{font-size:16px;}
.data-table th,.data-table td{font-size:15px;}
.metric strong{font-size:13px;}.site-footer{font-size:14px;}
.tool-finder label,.tool-finder span{font-size:13px;}
@media(max-width:720px){
  body{font-size:16px;}
  .top-nav>a,.dropbtn{font-size:14px;}
  .hero-copy p,.intro-card p{font-size:16.5px;}
  .tool-card p,.example-copy p,.source-list li{font-size:15.5px;}
}
@media(max-width:420px){.top-nav>a,.dropbtn{font-size:13px;}}