:root{--bg:#d8efff;--bg2:#eef8ff;--panel:#fff;--line:#a9cbea;--text:#0b2b4c;--muted:#55748f;--blue:#0b4f9c;--blue2:#2563eb;--cyan:#06b6d4;--violet:#7c3aed;--green:#10b981;--shadow:0 16px 42px rgba(11,79,156,.10)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:linear-gradient(180deg,#cae8ff,#eaf7ff 45%,#d9efff);color:var(--text)}a{text-decoration:none;color:inherit}button,input,select,textarea{font:inherit}.app{display:grid;grid-template-columns:270px 1fr;min-height:100vh}.side{background:rgba(238,248,255,.98);border-right:1px solid var(--line);padding:20px 16px;position:sticky;top:0;height:100vh;overflow:auto}.brand{display:flex;gap:12px;align-items:center;margin-bottom:20px}.logo{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(135deg,#22d3ee,#3b82f6 55%,#8b5cf6);font-size:25px}.brand small{display:block;color:var(--muted)}.home-link,.nav-item{display:block;padding:9px 11px;border-radius:10px;color:#4c6b85;cursor:pointer}.home-link{background:#cde8ff;color:var(--blue);font-weight:900}.nav-group{border-top:1px solid #d9e9f5;margin-top:8px;padding-top:6px}.group-toggle{width:100%;border:0;background:transparent;display:flex;justify-content:space-between;align-items:center;padding:10px 8px;text-transform:uppercase;font-size:11px;letter-spacing:1px;font-weight:900;color:#38536d;cursor:pointer}.plus{width:24px;height:24px;border:1px solid var(--line);border-radius:8px;display:grid;place-items:center;background:white;color:var(--blue);font-size:17px}.group-items{display:none}.nav-group.open .group-items{display:grid;gap:2px}.nav-item:hover{background:white;color:var(--blue)}.content{min-width:0}.top{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:minmax(260px,760px) auto;gap:20px;align-items:center;padding:12px 28px;background:rgba(219,240,255,.95);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}.search{display:flex;align-items:center;background:#fff;border:1px solid #b7d4eb;border-radius:14px;padding:6px 10px;box-shadow:0 8px 24px rgba(11,79,156,.06)}.search input{flex:1;border:0;outline:0;padding:9px;background:transparent}.kbd{font-size:11px;border:1px solid #d3e2ee;background:#f7fbff;border-radius:8px;padding:5px 7px}.langs{display:flex;gap:3px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:5px}.lang{border:0;background:transparent;padding:7px 9px;border-radius:8px;color:#647b92;cursor:pointer}.lang.on{background:#dceeff;color:var(--blue);font-weight:900}.main{max-width:1380px;margin:auto;padding:32px}.hero{border:1px solid #b9d9f2;border-radius:28px;padding:46px;background:radial-gradient(circle at 82% 18%,rgba(124,58,237,.14),transparent 22%),radial-gradient(circle at 70% 70%,rgba(6,182,212,.16),transparent 28%),linear-gradient(125deg,#f9fdff,#d8efff 48%,#e6e8ff);box-shadow:var(--shadow);position:relative;overflow:hidden}.hero:after{content:'</>';position:absolute;right:40px;top:10px;font-size:150px;font-weight:900;color:rgba(37,99,235,.06)}.eyebrow{display:inline-flex;border:1px solid #bde6ee;background:#edfdff;color:#087b91;border-radius:999px;padding:7px 11px;font-size:12px;font-weight:900}.hero h1{font-size:clamp(38px,5vw,66px);line-height:1.02;margin:18px 0 14px;max-width:900px}.hero h1 span{background:linear-gradient(90deg,#0891b2,#2563eb,#7c3aed);-webkit-background-clip:text;color:transparent}.hero p{max-width:850px;font-size:18px;line-height:1.65;color:#4f6982}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}.btn{border:1px solid #c5d9ec;background:white;color:#174f8d;padding:10px 13px;border-radius:11px;font-weight:800;cursor:pointer;display:inline-block}.btn.primary{border:0;background:linear-gradient(135deg,#06b6d4,#2563eb);color:white}.stats,.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.stats{margin-top:18px}.stat,.card,.panel,.topic-section,.author-card,.contact-card{background:#fff;border:1px solid #d1e2ef;border-radius:18px;box-shadow:0 10px 28px rgba(11,79,156,.055)}.stat{padding:14px}.stat strong{display:block;font-size:19px}.stat span{font-size:12px;color:var(--muted)}.section{margin-top:34px}.section h2{margin:0 0 7px}.section-head{display:flex;justify-content:space-between;align-items:end;gap:16px;margin-bottom:15px}.section-head p,.section p{color:var(--muted)}.card{padding:19px;min-height:170px;position:relative;overflow:hidden;transition:.2s;cursor:pointer}.card:before{content:'';position:absolute;left:0;right:0;top:0;height:4px;background:var(--accent,#2563eb)}.card:hover{transform:translateY(-3px);box-shadow:0 16px 34px rgba(11,79,156,.10)}.ico{font-size:27px;margin-bottom:12px}.card p{font-size:13px;line-height:1.55}.tag,.level{font-size:11px;padding:5px 8px;border:1px solid #d1e2ef;background:#f7fbff;border-radius:999px;color:#56718a}.quick{display:grid;grid-template-columns:2fr 1fr;gap:15px;margin-top:30px}.panel{padding:22px}.levels{display:flex;gap:8px;flex-wrap:wrap}.topic-head{padding:30px 0 10px}.breadcrumbs{font-size:12px;color:#6c8398;margin-bottom:12px}.topic-head h1{font-size:42px;margin:0 0 10px}.topic-head p{font-size:17px;color:var(--muted);max-width:900px;line-height:1.6}.topic-meta{display:flex;gap:8px;flex-wrap:wrap;margin:15px 0}.topic-section{padding:24px;margin-top:14px}.topic-section h2{margin-top:0}.topic-section p{line-height:1.75;color:#34536f}.tip{border-left:4px solid var(--cyan);background:#eafaff;padding:15px 17px;border-radius:12px;margin-top:18px}.download-box{margin-top:24px;padding:22px;border:1px solid #9fc4e4;background:linear-gradient(135deg,#f7fcff,#e3f2ff);border-radius:18px}.download-box h3{margin-top:0}.related{display:flex;gap:8px;flex-wrap:wrap}.author-contact{display:grid;grid-template-columns:1fr 1fr;gap:16px}.author-card,.contact-card{padding:24px}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.contact-grid input,.contact-grid select,.contact-grid textarea{width:100%;border:1px solid #a9cbea;border-radius:10px;padding:11px}.wide{grid-column:1/-1}.footer{text-align:center;color:#70869a;padding:40px 0 12px;font-size:12px}.search-results{display:none;position:fixed;z-index:60;left:50%;top:92px;transform:translateX(-50%);width:min(760px,calc(100vw - 40px));max-height:65vh;overflow:auto;background:white;border:1px solid #a9cbea;border-radius:18px;box-shadow:0 25px 70px rgba(11,43,76,.25);padding:10px}.search-results.open{display:block}.result{padding:12px;border-radius:12px;cursor:pointer}.result:hover{background:#edf7ff}.result small{color:var(--muted)}.chat-fab{position:fixed;right:24px;bottom:24px;width:60px;height:60px;border:0;border-radius:50%;background:linear-gradient(135deg,#0b4f9c,#7c3aed);color:white;font-size:27px;box-shadow:0 15px 35px rgba(11,79,156,.32);cursor:pointer;z-index:50}.chatbox{display:none;position:fixed;right:24px;bottom:94px;width:min(390px,calc(100vw - 32px));background:#fff;border:1px solid #8db8dc;border-radius:20px;box-shadow:0 24px 65px rgba(11,43,76,.24);z-index:50;overflow:hidden}.chatbox.open{display:block}.chat-head{background:linear-gradient(135deg,#0b4f9c,#2563eb);color:white;padding:15px 17px;font-weight:900}.chat-body{padding:16px}.chat-msg{background:#e7f3ff;border:1px solid #b8d6ee;padding:11px;border-radius:12px;line-height:1.5}.chat-input{display:flex;gap:8px;margin-top:12px}.chat-input input{flex:1;border:1px solid #a9cbea;border-radius:10px;padding:10px}.chat-input button{border:0;border-radius:10px;background:#0b4f9c;color:#fff;padding:0 14px}.demo-note{font-size:11px;color:#71869a;margin-top:10px}
@media(max-width:1100px){.grid,.stats{grid-template-columns:repeat(2,1fr)}.app{grid-template-columns:235px 1fr}}@media(max-width:820px){.app{display:block}.side{position:relative;height:auto;border-right:0}.top{grid-template-columns:1fr;padding:10px 16px}.main{padding:20px}.grid{grid-template-columns:1fr}.quick,.author-contact{grid-template-columns:1fr}.hero{padding:32px 23px}.stats{grid-template-columns:1fr 1fr}}@media(max-width:520px){.stats{grid-template-columns:1fr}.contact-grid{grid-template-columns:1fr}.wide{grid-column:auto}}

.tool-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.tool-card,.glossary-card{background:#fff;border:1px solid #c7deef;border-radius:18px;padding:22px;box-shadow:0 10px 28px rgba(11,79,156,.055)}.tool-card textarea,.tool-card input,.tool-card select{width:100%;border:1px solid #a9cbea;border-radius:10px;padding:11px;margin-bottom:10px}.mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.tool-output{margin-top:14px;padding:14px;border-radius:12px;background:#eaf7ff;border:1px solid #bdd9ec}.code-output{white-space:pre-wrap;background:#071b2f;color:#d9efff;padding:14px;border-radius:12px;min-height:60px;overflow:auto}.code-output.error{color:#fecaca}.glossary-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.glossary-card h3{margin-top:0;color:#0b4f9c}.glossary-card p{color:#45647e;line-height:1.6}@media(max-width:820px){.tool-grid,.glossary-grid{grid-template-columns:1fr}}

.checklist-box{margin-top:18px;padding:18px;background:#f4faff;border:1px solid #c7deef;border-radius:14px}.check-row{display:flex;gap:10px;align-items:flex-start;padding:10px 4px;border-bottom:1px solid #dcebf7}.check-row:last-child{border-bottom:0}.check-row input{width:auto;margin-top:3px}.compare-grid{display:grid;grid-template-columns:1fr 1.6fr;gap:18px}.bad-card,.good-card{border-radius:18px;padding:22px;border:1px solid}.bad-card{background:#fff5f5;border-color:#fecaca}.good-card{background:#f0fdf4;border-color:#bbf7d0}.bad-card h3{color:#b91c1c}.good-card h3{color:#166534}@media(max-width:820px){.compare-grid{grid-template-columns:1fr}}

/* RC3 accessibility and responsive quality gates */
.skip-link{position:fixed;left:12px;top:-60px;z-index:999;background:#072f5f;color:#fff;padding:10px 14px;border-radius:10px;font-weight:800}.skip-link:focus{top:12px}
:focus-visible{outline:3px solid #f59e0b!important;outline-offset:3px}
.group-toggle:focus-visible,.nav-item:focus-visible,.home-link:focus-visible,.btn:focus-visible,.lang:focus-visible{border-radius:10px}
@media(max-width:820px){.top{position:sticky;top:0}.langs{justify-self:start}.hero:after{font-size:95px;right:10px}.topic-head h1{font-size:clamp(30px,9vw,42px)}.chat-fab{right:16px;bottom:16px}.chatbox{right:16px;bottom:86px}.side{max-height:none}.kbd{display:none}}
@media(max-width:520px){.main{padding:14px}.hero{padding:26px 18px;border-radius:20px}.hero h1{font-size:clamp(34px,11vw,48px)}.hero p{font-size:16px}.top{gap:8px}.search{min-width:0}.langs{max-width:100%}.topic-section,.author-card,.contact-card,.tool-card,.glossary-card{padding:18px}.chatbox{width:calc(100vw - 24px);right:12px}.chat-fab{width:54px;height:54px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.card{transition:none}.card:hover{transform:none}}