:root {
  color-scheme: dark;
  --bg: #080b10;
  --bg-soft: #0c1118;
  --panel: rgba(13, 19, 27, 0.88);
  --panel-solid: #0f151e;
  --panel-2: #121a25;
  --text: #e9f0ed;
  --muted: #84918e;
  --faint: #4f5c5a;
  --line: rgba(154, 177, 170, 0.16);
  --line-strong: rgba(129, 255, 199, 0.34);
  --green: #7dffc2;
  --green-2: #36d98b;
  --cyan: #6ddcff;
  --violet: #a88cff;
  --amber: #ffd479;
  --danger: #ff7988;
  --shadow: 0 32px 100px rgba(0, 0, 0, 0.48);
  --mono: "JetBrains Mono", "SFMono-Regular", Consolas, monospace;
  --header-height: 68px;
}

html[data-theme="light"] {
  color-scheme: light;
  --bg: #eeeDE6;
  --bg-soft: #e4e5de;
  --panel: rgba(250, 250, 246, 0.9);
  --panel-solid: #fafaf6;
  --panel-2: #f2f3ed;
  --text: #17211e;
  --muted: #58645f;
  --faint: #86908c;
  --line: rgba(34, 59, 51, 0.17);
  --line-strong: rgba(0, 117, 69, 0.38);
  --green: #007c4a;
  --green-2: #0d985f;
  --cyan: #006c91;
  --violet: #6748b8;
  --amber: #8d5e00;
  --danger: #b5273d;
  --shadow: 0 30px 80px rgba(41, 54, 48, 0.16);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 92px; }
body {
  margin: 0;
  min-width: 320px;
  color: var(--text);
  background: var(--bg);
  font-family: var(--mono);
  font-size: 14px;
  line-height: 1.68;
  transition: color 220ms ease, background 220ms ease;
}
button, a { font: inherit; }
a { color: inherit; text-decoration: none; }
button { color: inherit; }
::selection { color: var(--bg); background: var(--green); }
.js body.booting { overflow: hidden; }
.boot-screen { display: none; }
.js .boot-screen {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: 24px;
  overflow: hidden;
  color: #dce8e3;
  background: #05080c;
  transition: opacity 520ms ease, visibility 520ms ease, transform 520ms ease;
}
.boot-screen.exit { opacity: 0; visibility: hidden; transform: scale(1.015); pointer-events: none; }
.boot-grid-bg { position: absolute; inset: 0; opacity: .58; background: radial-gradient(circle at 50% 22%, rgba(64,255,168,.1), transparent 32%), linear-gradient(rgba(125,255,194,.035) 1px, transparent 1px), linear-gradient(90deg,rgba(125,255,194,.035) 1px, transparent 1px); background-size: auto,42px 42px,42px 42px; mask-image:linear-gradient(to bottom,#000 35%,transparent 100%); }
.boot-grid-bg::after { content:""; position:absolute; inset:0; background:repeating-linear-gradient(to bottom,transparent 0 3px,rgba(0,0,0,.16) 4px); }
.boot-terminal { position: relative; width: min(980px, 100%); overflow: hidden; border: 1px solid rgba(125,255,194,.24); border-radius: 7px; background: rgba(8,13,19,.95); box-shadow: 0 0 0 1px rgba(255,255,255,.02),0 40px 140px rgba(0,0,0,.72),0 0 80px rgba(54,217,139,.06); }
.boot-bar { height: 42px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:0 13px; border-bottom:1px solid rgba(125,255,194,.14); color:#60706b; background:#0b1119; font-size:.62rem; }
.boot-bar>span:nth-child(2){text-align:center}.boot-bar>span:last-child{justify-self:end;padding:2px 6px;border:1px solid rgba(125,255,194,.15);border-radius:3px}
.boot-body { min-height: 430px; display:grid; grid-template-columns:280px minmax(0,1fr); }
.boot-identity { padding:42px 30px; border-right:1px solid rgba(125,255,194,.12); background:linear-gradient(150deg,rgba(125,255,194,.04),transparent 55%); }
.boot-mark { color:#7dffc2; font-size:2.35rem; font-weight:700; letter-spacing:-.08em; text-shadow:0 0 28px rgba(125,255,194,.35); }.boot-mark span{color:#6ddcff;font-size:.9rem;letter-spacing:-.03em}.boot-identity>p{margin:5px 0 34px;color:#53635e;font-size:.6rem;letter-spacing:.14em}.boot-identity dl{margin:0}.boot-identity dl div{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px dashed rgba(125,255,194,.12);font-size:.61rem}.boot-identity dt{color:#53635e}.boot-identity dd{margin:0;color:#94a59f;text-align:right}
.boot-console { position:relative; min-width:0; padding:38px 34px; overflow:hidden; }
.boot-output { display:grid; gap:7px; color:#7f918b; font-size:clamp(.63rem,1.3vw,.76rem); }
.boot-line { min-height:1.35em; animation:boot-line-in 180ms ease both}.boot-line.command{color:#dce8e3}.boot-line.command::before{content:"guest@mysura:~ $ ";color:#7dffc2}.boot-line.result{padding-left:16px;color:#667771}.boot-line.result::before{content:"└─ ";color:#43534e}.boot-line .ok{color:#7dffc2}.boot-line .cyan{color:#6ddcff}.boot-line .dim{color:#53635e}.boot-caret{display:inline-block;width:7px;height:14px;margin:9px 0 0 1px;background:#7dffc2;box-shadow:0 0 12px rgba(125,255,194,.6);animation:blink 1s steps(2,end) infinite}
.boot-footer { min-height:52px; display:flex; align-items:center; gap:16px; padding:0 18px; border-top:1px solid rgba(125,255,194,.13); background:#0b1119; }.boot-progress{flex:1;height:4px;overflow:hidden;background:#17221f}.boot-progress span{display:block;width:0;height:100%;background:linear-gradient(90deg,#36d98b,#7dffc2,#6ddcff);box-shadow:0 0 16px rgba(125,255,194,.5);transition:width 280ms ease}.boot-footer>span{min-width:120px;color:#60706b;text-align:right;font-size:.58rem}
.boot-skip { position:relative;margin-top:18px;padding:7px 10px;border:1px solid rgba(125,255,194,.18);border-radius:3px;color:#65756f;background:rgba(8,13,19,.72);cursor:pointer;font-size:.62rem}.boot-skip:hover,.boot-skip:focus-visible{color:#7dffc2;border-color:rgba(125,255,194,.45)}
@keyframes boot-line-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.skip-link { position: fixed; z-index: 9999; left: 16px; top: -60px; padding: 10px 14px; color: var(--bg); background: var(--green); border-radius: 6px; transition: top 150ms ease; }
.skip-link:focus { top: 12px; }
.noise { position: fixed; inset: 0; pointer-events: none; z-index: -1; opacity: 0.25; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.08'/%3E%3C/svg%3E"); }
.aurora { position: fixed; inset: 0; overflow: hidden; pointer-events: none; z-index: -2; }
.aurora i { position: absolute; display: block; width: 38vw; height: 38vw; border-radius: 50%; filter: blur(100px); opacity: 0.1; }
.aurora i:nth-child(1) { top: -16vw; left: 10vw; background: var(--green); }
.aurora i:nth-child(2) { right: -18vw; top: 22vh; background: var(--cyan); }
.aurora i:nth-child(3) { left: 32vw; bottom: -26vw; background: var(--violet); }
.scroll-progress { position: fixed; inset: 0 0 auto; height: 2px; z-index: 100; background: transparent; }
.scroll-progress span { display: block; width: 0; height: 100%; background: linear-gradient(90deg, var(--green), var(--cyan), var(--violet)); box-shadow: 0 0 14px var(--green); }

.site-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 50;
  height: var(--header-height);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 clamp(20px, 4vw, 64px);
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--bg) 84%, transparent);
  backdrop-filter: blur(20px) saturate(135%);
}
.wordmark { display: flex; align-items: center; font-weight: 700; letter-spacing: -0.04em; }
.prompt-mark { margin-right: 5px; color: var(--green); }
.cursor-mark { color: var(--green); animation: blink 1.1s steps(2, end) infinite; }
.top-nav { display: flex; align-items: center; gap: clamp(12px, 2.1vw, 30px); color: var(--muted); font-size: 0.78rem; }
.top-nav a:hover, .top-nav a:focus-visible { color: var(--green); }
.icon-button { width: 34px; height: 34px; padding: 0; border: 1px solid var(--line); border-radius: 5px; color: var(--muted); background: var(--panel); cursor: pointer; }
.icon-button:hover, .icon-button:focus-visible { color: var(--green); border-color: var(--line-strong); }

.workspace { width: min(1540px, 100%); margin: 0 auto; padding: calc(var(--header-height) + 26px) clamp(18px, 3vw, 48px) 48px; display: grid; grid-template-columns: 224px minmax(0, 1fr); gap: 24px; }
.toc { position: sticky; top: calc(var(--header-height) + 26px); height: calc(100vh - var(--header-height) - 52px); padding: 18px 14px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); backdrop-filter: blur(18px); box-shadow: var(--shadow); }
.toc-title { display: flex; justify-content: space-between; margin-bottom: 8px; color: var(--muted); font-size: 0.68rem; }
.toc-title span:first-child, .toc-title span:last-child { color: var(--green); }
.toc-path { margin: 18px 8px 12px; color: var(--faint); font-size: 0.68rem; }
.toc > a { position: relative; display: grid; grid-template-columns: 30px 1fr; gap: 6px; padding: 7px 9px; border-radius: 4px; color: var(--muted); font-size: 0.72rem; }
.toc > a::before { content: "├──"; position: absolute; left: -11px; color: var(--faint); opacity: 0.44; }
.toc > a:nth-last-of-type(1)::before { content: "└──"; }
.toc > a b { color: var(--faint); font-weight: 400; }
.toc > a:hover, .toc > a.active { color: var(--text); background: color-mix(in srgb, var(--green) 8%, transparent); }
.toc > a.active b { color: var(--green); }
.toc > a.active::after { content: ""; position: absolute; inset: 8px auto 8px 0; width: 2px; background: var(--green); box-shadow: 0 0 10px var(--green); }
.toc-system { position: absolute; inset: auto 18px 17px; display: grid; gap: 6px; color: var(--faint); font-size: 0.61rem; }
.status-dot { display: inline-block; width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 9px var(--green); }

.terminal-shell { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 9px; background: var(--panel); box-shadow: var(--shadow); backdrop-filter: blur(18px); }
.terminal-bar { position: relative; z-index: 20; height: 42px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 14px; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--panel-solid) 92%, transparent); backdrop-filter: blur(18px); font-size: 0.63rem; color: var(--faint); }
.window-controls { display: flex; gap: 7px; }
.window-controls i { width: 9px; height: 9px; border-radius: 50%; background: var(--danger); }
.window-controls i:nth-child(2) { background: var(--amber); }.window-controls i:nth-child(3) { background: var(--green-2); }
.terminal-path { text-align: center; }
.terminal-meta { justify-self: end; display: flex; gap: 8px; }
.terminal-meta span { padding: 2px 6px; border: 1px solid var(--line); border-radius: 3px; }
.terminal-content { padding: clamp(22px, 4vw, 58px); }
.terminal-section { padding: 36px 0 92px; border-bottom: 1px dashed var(--line); }
.terminal-section:last-of-type { border-bottom: 0; }
.command-line { margin: 0 0 26px; color: var(--muted); font-size: 0.74rem; }
.command-line span, .final-prompt span { color: var(--green); }.command-line b, .final-prompt b { color: var(--faint); }.command-line em, .final-prompt em { color: var(--cyan); font-style: normal; }
.ascii { max-width: 100%; margin: 0 0 26px; overflow: hidden; color: var(--green); font-size: clamp(0.32rem, 0.85vw, 0.7rem); line-height: 1.18; text-shadow: 0 0 22px color-mix(in srgb, var(--green) 50%, transparent); }
.frame { overflow: hidden; border: 1px solid var(--line); border-radius: 5px; background: color-mix(in srgb, var(--panel-solid) 82%, transparent); }
.frame-title, .card-head, .log-head { min-height: 36px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 12px; border-bottom: 1px solid var(--line); color: var(--muted); background: var(--panel-2); font-size: 0.67rem; }
.frame-title > span:first-child { color: var(--green); }
.online { display: flex; align-items: center; gap: 6px; color: var(--green); }.online i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; box-shadow: 0 0 8px currentColor; }
.identity-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(280px, 0.7fr); gap: clamp(28px, 5vw, 70px); padding: clamp(28px, 5vw, 62px); }
.kicker { color: var(--green); font-size: 1.08rem; font-weight: 700; }
h1, h2, h3, p { margin-top: 0; }
h1 { max-width: 850px; margin-bottom: 18px; font-size: clamp(2rem, 4.3vw, 4.45rem); line-height: 1.08; letter-spacing: -0.075em; }
h1 span { color: transparent; background: linear-gradient(110deg, var(--green), var(--cyan)); background-clip: text; }
.lede { margin-bottom: 20px; color: var(--text); font-size: clamp(0.92rem, 1.5vw, 1.15rem); }
.summary { max-width: 740px; color: var(--muted); }
.action-row { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 28px; }
.terminal-button { padding: 9px 12px; border: 1px solid var(--line); border-radius: 4px; color: var(--muted); background: var(--panel-2); font-size: 0.7rem; transition: transform 160ms ease, border-color 160ms ease, color 160ms ease; }
.terminal-button:hover, .terminal-button:focus-visible { color: var(--green); border-color: var(--line-strong); transform: translateY(-2px); }
.terminal-button.primary { color: var(--bg); background: var(--green); border-color: var(--green); font-weight: 700; }
.system-card { align-self: center; border: 1px solid var(--line); border-radius: 5px; background: var(--bg-soft); box-shadow: 0 22px 60px rgba(0,0,0,.24); transform: rotate(0.8deg); }
.system-card-head { display: flex; justify-content: space-between; padding: 8px 10px; border-bottom: 1px solid var(--line); color: var(--faint); font-size: 0.62rem; }
.system-card dl { margin: 0; padding: 12px; }
.system-card dl div { display: flex; justify-content: space-between; gap: 10px; padding: 7px 0; border-bottom: 1px dashed var(--line); }
.system-card dt { color: var(--faint); font-size: 0.62rem; }.system-card dd { margin: 0; text-align: right; font-size: 0.66rem; }.success { color: var(--green) !important; }
.mini-chart { height: 76px; display: flex; align-items: end; gap: 5px; padding: 12px; }
.mini-chart span { flex: 1; height: var(--v); border-radius: 2px 2px 0 0; background: linear-gradient(to top, color-mix(in srgb, var(--green) 20%, transparent), var(--green)); }
.metric-strip { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 12px; border: 1px solid var(--line); border-radius: 5px; }
.metric-strip div { padding: 16px; border-right: 1px solid var(--line); }.metric-strip div:last-child { border: 0; }
.metric-strip span, .metric-strip small { display: block; }.metric-strip span { color: var(--green); font-size: 1.2rem; font-weight: 700; }.metric-strip small { margin-top: 3px; color: var(--faint); font-size: 0.59rem; }

.launch-hero { position: relative; overflow: hidden; border: 1px solid var(--line-strong); border-radius: 8px; background: radial-gradient(circle at var(--mx,50%) var(--my,20%), color-mix(in srgb, var(--green) 14%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, var(--cyan) 8%, var(--panel-solid)), var(--panel-solid) 46%, color-mix(in srgb, var(--violet) 6%, var(--bg-soft))); box-shadow: 0 34px 100px rgba(0,0,0,.35), inset 0 0 0 1px rgba(255,255,255,.025); transform: perspective(1200px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)); transition: transform 180ms ease, border-color 180ms ease; }
.launch-hero::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, transparent, rgba(255,255,255,.05), transparent); transform: translateX(-100%); animation: scan-sheen 6s ease-in-out infinite; }
.launch-hero::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .3; background: repeating-linear-gradient(to bottom, transparent 0 6px, rgba(125,255,194,.04) 7px); }
.launch-status-strip { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3,1fr); border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--bg) 52%, transparent); }
.launch-status-strip span { padding: 11px 14px; border-right: 1px solid var(--line); color: var(--muted); font-size: .61rem; letter-spacing: .04em; }.launch-status-strip span:last-child{border-right:0;color:var(--green)}
.launch-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0,1.2fr) minmax(300px,.8fr); gap: clamp(28px,5vw,78px); align-items: stretch; padding: clamp(28px,5vw,68px); }
.launch-copy { display: flex; flex-direction: column; justify-content: center; min-width: 0; }
.launch-copy h1 { max-width: 980px; font-size: clamp(2.35rem,6.2vw,6.65rem); line-height: .96; text-transform: uppercase; }
.launch-copy .summary { max-width: 820px; font-size: clamp(.74rem,1vw,.86rem); }
.role-lens { margin-top: 30px; overflow: hidden; border: 1px solid var(--line); border-radius: 5px; background: color-mix(in srgb, var(--bg-soft) 76%, transparent); }
.role-lens-head { display: flex; justify-content: space-between; gap: 12px; padding: 8px 10px; border-bottom: 1px solid var(--line); color: var(--green); font-size: .59rem; }.role-lens-head small{color:var(--faint);font-size:.59rem}
.role-switcher { display: flex; flex-wrap: wrap; gap: 6px; padding: 10px; border-bottom: 1px solid var(--line); }
.role-switcher button { padding: 7px 9px; border: 1px solid var(--line); border-radius: 3px; color: var(--muted); background: transparent; cursor: pointer; font-size: .59rem; transition: color 160ms ease, border-color 160ms ease, background 160ms ease, transform 160ms ease; }
.role-switcher button:hover,.role-switcher button:focus-visible { color: var(--cyan); border-color: color-mix(in srgb, var(--cyan) 48%, transparent); transform: translateY(-1px); }
.role-switcher button.active { color: var(--bg); border-color: var(--green); background: var(--green); font-weight: 700; }
.role-panel { padding: 18px; min-height: 150px; background: linear-gradient(135deg, color-mix(in srgb, var(--green) 6%, transparent), transparent 58%); }
.role-panel span { display: block; margin-bottom: 16px; color: var(--cyan); font-size: .57rem; letter-spacing: .08em; }
.role-panel h3 { margin-bottom: 10px; font-size: clamp(.92rem,1.6vw,1.28rem); }
.role-panel p { margin: 0; color: var(--muted); font-size: .68rem; }
.protocol-certificate { position: relative; align-self: stretch; min-height: 520px; display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--line-strong); border-radius: 7px; background: linear-gradient(160deg, color-mix(in srgb, var(--green) 8%, var(--bg-soft)), var(--bg-soft) 44%, color-mix(in srgb, var(--cyan) 5%, var(--bg))); box-shadow: 0 28px 80px rgba(0,0,0,.28); transform: perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) rotate(-.7deg); transition: transform 180ms ease; }
.protocol-certificate::before { content: ""; position: absolute; inset: 18px; border: 1px dashed color-mix(in srgb, var(--green) 22%, transparent); pointer-events: none; }
.certificate-top { position: relative; z-index: 1; display: flex; justify-content: space-between; gap: 12px; padding: 14px 16px; border-bottom: 1px solid var(--line); color: var(--faint); font-size: .57rem; }.certificate-top span:last-child{color:var(--green)}
.certificate-mark { position: relative; z-index: 1; margin: clamp(28px,4vw,44px) 28px 6px; color: var(--green); font-size: clamp(2rem,4vw,3.6rem); font-weight: 700; letter-spacing: -.1em; text-shadow: 0 0 26px color-mix(in srgb, var(--green) 42%, transparent); }.certificate-mark span{color:var(--cyan);font-size:.7em}
.certificate-owner { position: relative; z-index: 1; margin: 0 28px 26px; color: var(--muted); font-size: .64rem; }
.protocol-certificate h2 { position: relative; z-index: 1; margin: 0 28px 26px; max-width: 360px; font-size: clamp(1.45rem,3vw,2.45rem); letter-spacing: -.06em; }
.protocol-certificate ul { position: relative; z-index: 1; display: grid; gap: 8px; margin: auto 28px 28px; padding: 0; list-style: none; }
.protocol-certificate li { display: grid; grid-template-columns: 38px 1fr; align-items: center; min-height: 40px; border: 1px solid var(--line); border-radius: 4px; background: color-mix(in srgb, var(--bg) 42%, transparent); }
.protocol-certificate li b { display: grid; place-items: center; align-self: stretch; border-right: 1px solid var(--line); color: var(--green); font-size: .58rem; }
.protocol-certificate li span { padding: 0 12px; color: var(--muted); font-size: .65rem; }
.certificate-seal { position: relative; z-index: 1; margin: 0 28px 28px; padding: 10px 12px; border: 1px solid var(--line-strong); border-radius: 4px; color: var(--green); text-align: center; background: color-mix(in srgb, var(--green) 7%, transparent); font-size: .61rem; letter-spacing: .1em; }
.signal-resolver { display: grid; grid-template-columns: 1fr auto 1fr; gap: 10px; align-items: stretch; margin-top: 12px; }
.signal-resolver div { padding: 18px; border: 1px solid var(--line); border-radius: 5px; background: color-mix(in srgb, var(--panel-solid) 86%, transparent); }
.signal-resolver span { display: block; margin-bottom: 12px; color: var(--green); font-size: .59rem; letter-spacing: .08em; }
.signal-resolver p { margin: 0; color: var(--muted); font-size: .69rem; }
.signal-resolver i { display: grid; place-items: center; min-width: 44px; border: 1px solid var(--line); border-radius: 5px; color: var(--cyan); background: var(--panel-solid); font-style: normal; font-size: 1.2rem; }
.metric-strip-protocol { overflow: hidden; background: linear-gradient(90deg, color-mix(in srgb,var(--green) 5%,transparent), transparent, color-mix(in srgb,var(--cyan) 5%,transparent)); }

.section-intro { display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 44px; align-items: end; margin-bottom: 28px; }
.section-intro small { color: var(--green); font-size: 0.65rem; }.section-intro p { margin-bottom: 7px; color: var(--muted); font-size: 0.76rem; }
h2 { margin: 8px 0 0; font-size: clamp(1.8rem, 3.5vw, 3.25rem); line-height: 1.12; letter-spacing: -0.065em; }
.featured-grid { display: grid; grid-template-columns: 1.18fr 0.82fr; grid-template-rows: 1fr 1fr; gap: 12px; }
.feature-card { position: relative; display: flex; flex-direction: column; min-height: 272px; overflow: hidden; border: 1px solid var(--line); border-radius: 5px; background: var(--panel-solid); transition: transform 180ms ease, border-color 180ms ease; }
.feature-card:hover { transform: translateY(-3px); border-color: var(--line-strong); }
.feature-main { grid-row: span 2; min-height: 556px; }
.card-head span:first-child { color: var(--green); }.card-head span:last-child { color: var(--faint); }
.feature-card h3, .feature-card > p, .feature-card > .tags, .feature-card > a { margin-left: 22px; margin-right: 22px; }
.feature-card h3 { margin-top: 22px; margin-bottom: 10px; font-size: 1.1rem; }.feature-card > p { color: var(--muted); font-size: 0.72rem; }.feature-card > a { margin-top: auto; margin-bottom: 20px; color: var(--green); font-size: 0.68rem; }
.tags { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 20px; }.tags span { padding: 3px 7px; border: 1px solid var(--line); border-radius: 3px; color: var(--muted); font-size: 0.57rem; }
.dashboard-preview { position: relative; height: 230px; margin: 22px; padding: 15px; overflow: hidden; border: 1px solid var(--line); border-radius: 4px; background: linear-gradient(145deg, color-mix(in srgb, var(--cyan) 7%, var(--bg-soft)), var(--bg-soft)); }
.preview-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 7px; height: 52px; }.preview-grid i { border: 1px solid var(--line); background: color-mix(in srgb, var(--green) 7%, transparent); }
.preview-line { position: absolute; left: 15px; right: 48%; bottom: 17px; height: 120px; border: 1px solid var(--line); background: repeating-linear-gradient(to bottom, transparent 0 23px, var(--line) 24px); }
.preview-line span { position: absolute; inset: 26px 10px 20px; background: linear-gradient(150deg, transparent 43%, var(--cyan) 44% 46%, transparent 47%), linear-gradient(25deg, transparent 46%, var(--green) 47% 49%, transparent 50%); opacity: .75; }
.preview-bars { position: absolute; right: 15px; bottom: 17px; width: 43%; height: 120px; display: flex; align-items: end; gap: 7px; padding: 12px; border: 1px solid var(--line); }.preview-bars i { flex: 1; background: linear-gradient(var(--green), color-mix(in srgb, var(--green) 12%, transparent)); }.preview-bars i:nth-child(1){height:42%}.preview-bars i:nth-child(2){height:67%}.preview-bars i:nth-child(3){height:58%}.preview-bars i:nth-child(4){height:88%}.preview-bars i:nth-child(5){height:74%}
.cloud-glyph { margin: 20px 22px 0; padding: 18px 9px; border: 1px dashed var(--line-strong); color: var(--cyan); text-align: center; font-size: 0.67rem; letter-spacing: .08em; }
.contract-glyph { margin: 20px 22px 0; display: grid; grid-template-columns: 1fr auto; gap: 4px 12px; padding: 12px; border: 1px dashed var(--line); color: var(--muted); font-size: .64rem; }.contract-glyph b { color: var(--green); }

.skill-matrix { display: grid; grid-template-columns: repeat(2,1fr); }
.skill-matrix article { min-height: 132px; padding: 22px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }.skill-matrix article:nth-child(2n){border-right:0}.skill-matrix article:last-child{grid-column:span 2;border-bottom:0;border-right:0}
.skill-matrix b { color: var(--green); font-size: .67rem; }.skill-matrix p { margin: 14px 0 0; color: var(--muted); font-size: .72rem; }
.package-line { margin-top: 10px; padding: 12px; border: 1px solid var(--line); border-radius: 4px; }.package-line span { display:block; margin-bottom:8px; color:var(--faint); font-size:.62rem}.package-line code{color:var(--cyan); font-size:.65rem; line-height:1.9}
.log-meta, .project-toolbar { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; color:var(--faint); font-size:.65rem}
.experience-list { display:grid; gap:10px; }.log-entry{border:1px solid var(--line); border-radius:5px; overflow:hidden; background:var(--panel-solid)}.log-head span{color:var(--green)}.log-head time{color:var(--cyan)}.log-body{padding:22px}.log-body p{color:var(--muted)}.log-body ul{margin:16px 0 0; padding:0; list-style:none}.log-body li{margin:6px 0; color:var(--muted); font-size:.7rem}.log-body li::before{content:"├── ";color:var(--green)}.log-body li:last-child::before{content:"└── "}
.project-toolbar [role="group"]{display:flex; gap:5px}.filter{padding:5px 8px;border:1px solid var(--line);border-radius:3px;background:transparent;color:var(--faint);cursor:pointer;font-size:.6rem}.filter:hover,.filter.active{color:var(--bg);background:var(--green);border-color:var(--green)}
.project-list { border-top:1px solid var(--line) }.project-list article{display:grid;grid-template-columns:44px 1fr auto;gap:16px;align-items:center;padding:19px 12px;border-bottom:1px solid var(--line);transition:background 160ms ease}.project-list article:hover{background:color-mix(in srgb,var(--green) 5%,transparent)}.project-list article.hidden{display:none}.project-index{color:var(--faint);font-size:.65rem}.project-list h3{margin:0 0 5px;font-size:.82rem}.project-list p{margin:0 0 7px;color:var(--muted);font-size:.68rem}.project-list span{color:var(--cyan);font-size:.58rem}.project-list a{width:32px;height:32px;display:grid;place-items:center;border:1px solid var(--line);border-radius:3px;color:var(--green)}
.architecture-flow { display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr auto 1fr;gap:9px;align-items:center }.architecture-flow div{min-height:132px;padding:16px;border:1px solid var(--line);border-radius:4px;background:var(--panel-solid)}.architecture-flow small,.architecture-flow b,.architecture-flow span{display:block}.architecture-flow small{color:var(--green);font-size:.58rem}.architecture-flow b{margin:26px 0 7px;font-size:.76rem}.architecture-flow span{color:var(--muted);font-size:.59rem}.architecture-flow i{color:var(--cyan);font-style:normal}.roadmap-disclaimer{margin-top:12px;padding:12px;border-left:2px solid var(--amber);color:var(--muted);background:color-mix(in srgb,var(--amber) 5%,transparent);font-size:.64rem}.roadmap-disclaimer span{color:var(--amber)}
.education-grid,.roadmap-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.education-grid article,.roadmap-grid article{padding:22px;border:1px solid var(--line);border-radius:4px;background:var(--panel-solid)}.education-grid span,.roadmap-grid span{color:var(--green);font-size:.62rem}.education-grid h3,.roadmap-grid h3{margin:24px 0 8px;font-size:.9rem}.education-grid p,.roadmap-grid p{margin:0;color:var(--muted);font-size:.67rem}.roadmap-grid{grid-template-columns:repeat(3,1fr)}
.credential-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.credential-card{position:relative;min-height:236px;display:flex;flex-direction:column;padding:20px;overflow:hidden;border:1px solid var(--line);border-radius:5px;background:linear-gradient(145deg,var(--panel-solid),color-mix(in srgb,var(--cyan) 3%,var(--panel-solid)));transition:transform 180ms ease,border-color 180ms ease,box-shadow 180ms ease}.credential-card::after{content:"";position:absolute;right:-55px;bottom:-70px;width:150px;height:150px;border:1px solid color-mix(in srgb,var(--green) 13%,transparent);border-radius:50%;box-shadow:0 0 0 18px color-mix(in srgb,var(--green) 3%,transparent)}.credential-card:hover{transform:translateY(-3px);border-color:var(--line-strong);box-shadow:0 22px 55px rgba(0,0,0,.2)}.credential-card.credential-primary{grid-column:span 2;background:linear-gradient(135deg,color-mix(in srgb,var(--green) 9%,var(--panel-solid)),color-mix(in srgb,var(--cyan) 5%,var(--panel-solid)))}.credential-index{color:var(--green);font-size:.59rem;letter-spacing:.08em}.credential-card>i{margin:24px 0 12px;color:var(--cyan);font-size:1.55rem;font-style:normal;text-shadow:0 0 20px color-mix(in srgb,var(--cyan) 55%,transparent)}.credential-card h3{max-width:360px;margin:0 0 7px;font-size:.84rem;line-height:1.45}.credential-card p{margin:0;color:var(--muted);font-size:.62rem}.credential-card small{position:relative;z-index:1;margin-top:auto;padding-top:18px;color:var(--green);font-size:.58rem}.linkedin-proof{padding:clamp(22px,4vw,40px);border:1px solid var(--line);border-radius:6px;background:linear-gradient(145deg,color-mix(in srgb,var(--cyan) 5%,var(--panel-solid)),var(--panel-solid))}.linkedin-proof-head{display:flex;align-items:end;justify-content:space-between;gap:20px}.linkedin-proof-head small{color:var(--green);font-size:.65rem}.linkedin-proof-head h2{margin-top:8px}.linkedin-proof-head>a{padding:8px 10px;border:1px solid var(--line);border-radius:3px;color:var(--cyan);font-size:.62rem}.writing-card{overflow:hidden;border:1px solid var(--line);border-radius:5px;background:var(--bg-soft)}.writing-meta{display:flex;justify-content:space-between;padding:9px 13px;border-bottom:1px solid var(--line);color:var(--green);font-size:.58rem}.writing-meta time{color:var(--faint)}.writing-body{display:grid;grid-template-columns:minmax(220px,.7fr) 1.3fr;gap:clamp(24px,5vw,64px);align-items:center;padding:clamp(24px,5vw,54px)}.writing-signal{min-height:188px;display:flex;align-items:center;justify-content:center;gap:10px;border:1px solid var(--line);border-radius:4px;background:radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--green) 12%,transparent),transparent 60%),repeating-linear-gradient(0deg,transparent 0 27px,var(--line) 28px),repeating-linear-gradient(90deg,transparent 0 27px,var(--line) 28px);color:var(--cyan);font-size:.57rem}.writing-signal b{color:var(--green);font-size:1rem}.writing-topic{margin-bottom:12px;color:var(--cyan);font-size:.59rem}.writing-body h3{margin-bottom:13px;font-size:clamp(1rem,2.2vw,1.55rem);line-height:1.35}.writing-body p:not(.writing-topic){color:var(--muted);font-size:.68rem}.writing-body a{color:var(--green);font-size:.64rem}.evidence-note{margin:12px 0 0;padding:11px;border-left:2px solid var(--cyan);color:var(--muted);background:color-mix(in srgb,var(--cyan) 4%,transparent);font-size:.59rem}.evidence-note span{color:var(--cyan)}.recommendation-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.recommendation-card{position:relative;min-height:285px;display:flex;flex-direction:column;padding:clamp(24px,4vw,40px);overflow:hidden;border:1px solid var(--line);border-radius:5px;background:var(--panel-solid)}.recommendation-card::before{content:"";position:absolute;inset:0 auto 0 0;width:2px;background:linear-gradient(var(--green),var(--cyan));opacity:.8}.quote-mark{position:absolute;right:24px;top:4px;color:color-mix(in srgb,var(--green) 15%,transparent);font-family:Georgia,serif;font-size:8rem;line-height:1}.recommendation-card blockquote{position:relative;z-index:1;margin:16px 0 34px;color:var(--text);font-size:clamp(.82rem,1.5vw,1.05rem);line-height:1.8}.recommendation-card>div:last-child{display:grid;gap:3px;margin-top:auto}.recommendation-card strong{color:var(--green);font-size:.7rem}.recommendation-card span{color:var(--faint);font-size:.59rem}.recommendation-link{display:inline-block;margin-top:15px;color:var(--cyan);font-size:.64rem}
.contact-frame{padding-bottom:24px}.contact-frame code{display:block;margin:16px 22px 0;color:var(--muted);font-size:.7rem}.contact-links{display:flex;flex-wrap:wrap;gap:8px;margin:26px 22px 0}.contact-links a,.contact-links button{padding:7px 10px;border:1px solid var(--line);border-radius:3px;color:var(--green);background:transparent;cursor:pointer;font-size:.65rem}.contact-links a:hover,.contact-links button:hover{border-color:var(--line-strong)}.final-prompt{margin:36px 0 0;color:var(--muted);font-size:.72rem}.terminal-cursor{display:inline-block;width:7px;height:14px;vertical-align:-2px;background:var(--green);animation:blink 1s steps(2,end) infinite}
footer{display:flex;justify-content:space-between;gap:20px;padding:26px 0 0;color:var(--faint);font-size:.6rem}

.writing-focus-strip { display: flex; flex-wrap: wrap; gap: 8px; margin: 28px 0 12px; }
.writing-focus-strip span { padding: 7px 10px; border: 1px solid var(--line); border-radius: 999px; color: var(--cyan); background: color-mix(in srgb, var(--cyan) 5%, transparent); font-size: .58rem; }

dialog{width:min(460px,calc(100% - 32px));padding:0;border:1px solid var(--line-strong);border-radius:7px;color:var(--text);background:var(--panel-solid);box-shadow:var(--shadow)}dialog::backdrop{background:rgba(2,5,8,.72);backdrop-filter:blur(8px)}.command-dialog>div{display:flex;justify-content:space-between;padding:10px 12px;border-bottom:1px solid var(--line);color:var(--green)}.command-dialog button{border:0;color:var(--faint);background:transparent;cursor:pointer}.command-dialog p{margin:14px 14px 7px;color:var(--faint);font-size:.62rem}.command-dialog>a{display:block;margin:0 8px;padding:9px;border-radius:3px;color:var(--muted);font-size:.7rem}.command-dialog>a:hover{color:var(--green);background:color-mix(in srgb,var(--green) 7%,transparent)}
#toast{position:fixed;right:22px;bottom:22px;z-index:100;padding:10px 13px;border:1px solid var(--line-strong);border-radius:4px;color:var(--green);background:var(--panel-solid);box-shadow:var(--shadow);font-size:.66rem;opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity 180ms ease,transform 180ms ease}#toast.show{opacity:1;transform:none}

@keyframes blink{50%{opacity:0}}
@keyframes scan-sheen{0%,46%{transform:translateX(-100%);opacity:0}55%{opacity:1}72%,100%{transform:translateX(100%);opacity:0}}
@media(max-width:1050px){.workspace{grid-template-columns:1fr}.toc{position:sticky;top:calc(var(--header-height) + 10px);z-index:30;height:auto;display:flex;gap:3px;overflow-x:auto;padding:8px}.toc-title,.toc-path,.toc-system{display:none}.toc>a{flex:0 0 auto;display:flex!important;gap:5px;padding:6px 8px!important}.toc>a::before{display:none}.architecture-flow{grid-template-columns:1fr}.architecture-flow i{text-align:center;transform:rotate(90deg)}}
@media(max-width:760px){:root{--header-height:60px}.site-header{padding:0 16px}.top-nav>a{display:none}.top-nav{gap:7px}.workspace{padding-left:10px;padding-right:10px}.terminal-content{padding:18px}.terminal-path{display:none}.terminal-bar{grid-template-columns:1fr 1fr}.terminal-meta{grid-column:2}.ascii{font-size:.28rem}.identity-grid{grid-template-columns:1fr;padding:24px}.system-card{transform:none}.metric-strip{grid-template-columns:repeat(2,1fr)}.metric-strip div:nth-child(2){border-right:0}.metric-strip div:nth-child(-n+2){border-bottom:1px solid var(--line)}.section-intro{grid-template-columns:1fr;gap:12px}.featured-grid{grid-template-columns:1fr;grid-template-rows:auto}.feature-main{grid-row:auto;min-height:auto}.skill-matrix{grid-template-columns:1fr}.skill-matrix article,.skill-matrix article:nth-child(2n),.skill-matrix article:last-child{grid-column:auto;border-right:0;border-bottom:1px solid var(--line)}.education-grid,.roadmap-grid,.credential-grid,.recommendation-grid{grid-template-columns:1fr}.credential-card.credential-primary{grid-column:auto}.linkedin-proof-head{align-items:flex-start;flex-direction:column}.writing-body{grid-template-columns:1fr}.project-toolbar{align-items:flex-start;gap:12px;flex-direction:column}.project-list article{grid-template-columns:32px 1fr auto}.dashboard-preview{height:190px}.preview-line{right:15px}.preview-bars{display:none}footer{flex-direction:column}.terminal-section{padding-bottom:70px}}
@media(max-width:760px){.boot-screen{padding:14px}.boot-body{min-height:470px;grid-template-columns:1fr}.boot-identity{display:none}.boot-console{padding:28px 22px}.boot-bar{grid-template-columns:1fr auto}.boot-bar>span:nth-child(2){display:none}.boot-footer{align-items:flex-start;flex-direction:column;gap:8px;padding:12px 14px}.boot-progress{width:100%;flex:none}.boot-footer>span{min-width:0;text-align:left}}
@media(max-width:440px){h1{font-size:1.8rem}.identity-grid{padding:18px}.metric-strip span{font-size:1rem}.action-row{display:grid}.terminal-button{text-align:center}.project-list article{grid-template-columns:1fr}.project-index{display:none}.project-list a{position:absolute;right:10px}.frame-title,.card-head{align-items:flex-start;flex-direction:column}.dashboard-preview{margin:14px}.feature-card h3,.feature-card>p,.feature-card>.tags,.feature-card>a{margin-left:15px;margin-right:15px}.contact-frame code{overflow-wrap:anywhere}}
@media(max-width:1050px){.launch-status-strip{grid-template-columns:1fr}.launch-status-strip span{border-right:0;border-bottom:1px solid var(--line)}.launch-status-strip span:last-child{border-bottom:0}.launch-grid{grid-template-columns:1fr}.protocol-certificate{min-height:auto;transform:none}.signal-resolver{grid-template-columns:1fr}.signal-resolver i{min-height:38px}}
@media(max-width:760px){.launch-grid{padding:22px}.launch-copy h1{font-size:clamp(2rem,12vw,3.45rem)}.role-switcher{display:grid;grid-template-columns:repeat(2,1fr)}.role-switcher button{text-align:center}.protocol-certificate ul{margin-top:24px}.writing-focus-strip{margin-top:18px}.signal-resolver div{padding:14px}}
@media(max-width:440px){.role-switcher{grid-template-columns:1fr}.certificate-mark,.certificate-owner,.protocol-certificate h2,.protocol-certificate ul,.certificate-seal{margin-left:18px;margin-right:18px}.protocol-certificate::before{inset:10px}.launch-status-strip span{font-size:.55rem}.signal-resolver p{font-size:.64rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}