/* Bảng màu và khối dùng chung cho CẢ site (index.html + docs.html).
   Tách ra tệp riêng ngày 22/08/2026 khi thêm trang docs: chép 200 dòng CSS sang
   tệp thứ hai là tạo ra hai chỗ sẽ lệch nhau, và cái lệch sẽ ở đúng trang ít mở. */
/* Thiết kế CAM KẾT tối, không theo theme người xem: đây là trang sản phẩm, và
   bảng màu là phần của nhận diện. Mọi màu đặt tường minh — không mượn nền của host. */
:root{
  --bg:#0b1220;
  --panel:#131e36;
  --line:#22304f;
  --line-soft:#1b2740;
  --ink:#eaf0fb;
  --dim:#93a4c4;
  --dimmer:#6b7c9d;
  --accent:#4c8dff;
  --accent-2:#7cb1ff;
  --accent-dim:#1d3a6b;
  --ok:#3ddc84;
  --warn:#f5b849;
  --mono:"JetBrains Mono",Consolas,ui-monospace,"Courier New",monospace;
  --sans:"Inter","Segoe UI",system-ui,-apple-system,sans-serif;
  --maxw:1060px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
a:focus-visible,button:focus-visible{outline:2px solid var(--accent-2);outline-offset:3px}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font:400 16px/1.65 var(--sans);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

/* ── Nền: chấm thưa + hai vùng sáng mờ + một vòng cung lớn ────────────────── */
.bg{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.bg::before{
  content:'';position:absolute;inset:0;
  background-image:radial-gradient(rgba(124,177,255,.14) 1px,transparent 1px);
  background-size:34px 34px;
  mask-image:radial-gradient(ellipse 90% 60% at 50% 0%,#000 35%,transparent 78%);
  -webkit-mask-image:radial-gradient(ellipse 90% 60% at 50% 0%,#000 35%,transparent 78%);
}
.glow{position:absolute;border-radius:50%;filter:blur(90px);opacity:.5}
.glow.a{width:620px;height:620px;top:-260px;left:50%;transform:translateX(-50%);
        background:radial-gradient(circle,rgba(76,141,255,.42),transparent 68%)}
.glow.b{width:460px;height:460px;top:340px;right:-160px;
        background:radial-gradient(circle,rgba(61,220,132,.13),transparent 68%)}
.arc{
  position:absolute;left:50%;transform:translateX(-50%);
  top:430px;width:1500px;height:1500px;border-radius:50%;
  border:1px solid rgba(124,177,255,.16);
  box-shadow:0 0 120px rgba(76,141,255,.09) inset;
}
.arc.two{top:520px;width:1180px;height:1180px;border-color:rgba(124,177,255,.09)}

.wrap{position:relative;z-index:1;max-width:var(--maxw);margin:0 auto;padding:0 22px}

/* ── Nav ──────────────────────────────────────────────────────────────────── */
nav{display:flex;align-items:center;gap:14px;padding:22px 0 0}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:17px;letter-spacing:-.01em}
/* Logo là cửa sổ terminal — cùng hình với icon nhúng trong agentdc.exe
   (dist/icon/make-icon.py). Trang web và cái .exe người ta tải về phải mang
   CÙNG một dấu hiệu, nếu không thì trang giới thiệu một thứ và Explorer hiện
   một thứ khác. Bỏ ba đèn giao thông ở cỡ 28px: chúng thành ba pixel xám bẩn. */
.mark{width:28px;height:28px;flex:none;display:block}
.mark svg{display:block;width:100%;height:100%;
          filter:drop-shadow(0 2px 9px rgba(76,141,255,.34))}
.pill{
  font:500 12px/1 var(--mono);color:var(--accent-2);
  border:1px solid var(--accent-dim);background:rgba(76,141,255,.09);
  padding:5px 9px;border-radius:999px;
}
nav .sp{flex:1}
nav a.nl{color:var(--dim);text-decoration:none;font-size:14.5px;font-weight:500}
.status-nav{display:inline-flex;align-items:center;gap:7px}
.status-nav span{width:7px;height:7px;border-radius:50%;background:var(--dimmer);
                 box-shadow:0 0 0 3px rgba(107,124,157,.12)}
.status-nav.is-ok span{background:var(--ok);box-shadow:0 0 0 3px rgba(61,220,132,.12)}
.status-nav.is-down span{background:#ff6b63;box-shadow:0 0 0 3px rgba(255,95,87,.12)}

/* ── Hero ─────────────────────────────────────────────────────────────────── */
header{padding:74px 0 0;text-align:center}
.eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font:500 13px/1 var(--sans);color:var(--dim);
  border:1px solid var(--line);background:rgba(19,30,54,.7);
  padding:7px 14px;border-radius:999px;margin-bottom:26px;
}
.eyebrow b{color:var(--accent-2);font-weight:600}
h1{
  font-size:clamp(34px,6vw,58px);line-height:1.06;margin:0 0 20px;
  font-weight:700;letter-spacing:-.028em;
  text-wrap:balance;
  background:linear-gradient(180deg,#fff 24%,#a8c0e8);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero-line{display:block}
.sub{font-size:clamp(16px,2.2vw,19px);color:var(--dim);max-width:640px;margin:0 auto 34px}
.sub b{color:var(--ink);font-weight:600}

.cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:14px}
.btn{
  display:inline-flex;align-items:center;gap:9px;
  padding:13px 24px;border-radius:11px;text-decoration:none;
  font:600 15px/1 var(--sans);border:1px solid transparent;transition:.16s;
}
.btn.primary{
  background:linear-gradient(180deg,var(--accent),#3a75e0);color:#fff;
  box-shadow:0 4px 18px rgba(76,141,255,.34);
}
.btn.ghost{background:rgba(23,35,62,.8);border-color:var(--line);color:var(--ink)}
.plat{font:500 13px/1.5 var(--sans);color:var(--dimmer);margin:0 0 60px}
.plat .w{color:var(--warn)}

/* ── Terminal ─────────────────────────────────────────────────────────────── */
.term{
  background:rgba(15,24,44,.94);border:1px solid var(--line);
  border-radius:14px;overflow:hidden;text-align:left;
  box-shadow:0 24px 70px -18px rgba(0,0,0,.75),0 0 0 1px rgba(124,177,255,.05);
  backdrop-filter:blur(6px);
}
.term-bar{
  display:flex;align-items:center;gap:8px;
  padding:13px 16px;border-bottom:1px solid var(--line-soft);
  background:rgba(19,30,54,.6);
}
.dot{width:12px;height:12px;border-radius:50%;flex:none}
.dot.r{background:#ff5f57}.dot.y{background:#febc2e}.dot.g{background:#28c840}
.term-bar .lbl{margin-left:auto;font:500 12.5px/1 var(--mono);color:var(--dimmer)}
.term-body{
  padding:20px 20px 24px;font:400 14px/1.95 var(--mono);
  min-height:242px;overflow-x:auto;
}
.term-body .ln{white-space:pre;display:block}
.pr{color:var(--accent)}
.cmd{color:#dfe8f8}
.out{color:var(--dim)}
.out .ok{color:var(--ok)}
.out .ar{color:var(--accent-2)}
.cur{
  display:inline-block;width:8px;height:16px;vertical-align:-3px;
  background:var(--accent);animation:bl 1.05s step-end infinite;
}
@keyframes bl{0%,100%{opacity:1}50%{opacity:0}}
.copy{
  border:1px solid var(--line);border-radius:7px;background:rgba(19,30,54,.9);
  color:var(--dim);font:500 12px/1 var(--sans);padding:6px 11px;cursor:pointer;
  margin-left:10px;transition:.15s;
}

/* ── Khối nội dung ────────────────────────────────────────────────────────── */
section{padding:78px 0 0}
h2{
  font-size:13px;font-weight:600;letter-spacing:.11em;text-transform:uppercase;
  color:var(--dimmer);margin:0 0 8px;
}
.h3{font-size:clamp(22px,3.2vw,29px);font-weight:700;letter-spacing:-.02em;margin:0 0 30px}
.grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(248px,1fr))}
.card{
  background:linear-gradient(180deg,rgba(19,30,54,.92),rgba(15,24,44,.92));
  border:1px solid var(--line-soft);border-radius:13px;padding:22px;transition:.18s;
}
.card .ico{
  width:34px;height:34px;border-radius:9px;margin-bottom:14px;
  background:rgba(76,141,255,.13);border:1px solid var(--accent-dim);
  display:grid;place-items:center;font-size:17px;
}
.card h4{margin:0 0 7px;font-size:16.5px;font-weight:650}
.card p{margin:0;color:var(--dim);font-size:14.5px;line-height:1.6}

.panel{
  background:rgba(19,30,54,.72);border:1px solid var(--line-soft);
  border-radius:13px;padding:24px 26px;
}
table{border-collapse:collapse;width:100%;font-size:14.5px}
th{
  text-align:left;padding:0 12px 11px 0;color:var(--dimmer);
  font:600 11.5px/1 var(--sans);letter-spacing:.09em;text-transform:uppercase;
}
td{padding:12px 12px 12px 0;border-top:1px solid var(--line-soft);vertical-align:top;color:var(--dim)}
td:first-child{color:var(--ink);font-weight:500;white-space:nowrap}
td code,p code,li code{
  font:400 13px/1.4 var(--mono);background:rgba(76,141,255,.11);
  color:var(--accent-2);padding:2px 6px;border-radius:5px;overflow-wrap:anywhere;
}
.need{color:var(--ok);font-weight:600;white-space:nowrap}
.opt{color:var(--dimmer);white-space:nowrap}

ol.steps{counter-reset:s;list-style:none;padding:0;margin:0}
ol.steps li{
  counter-increment:s;position:relative;padding:0 0 18px 44px;color:var(--dim);
  border-left:1px solid var(--line-soft);margin-left:13px;
}
ol.steps li:last-child{border-left-color:transparent;padding-bottom:0}
ol.steps li::before{
  content:counter(s);position:absolute;left:-14px;top:-2px;
  width:27px;height:27px;border-radius:50%;
  background:var(--panel);border:1px solid var(--line);
  color:var(--accent-2);font:600 12.5px/25px var(--mono);text-align:center;
}
ol.steps li b{color:var(--ink);font-weight:600}

.note{
  display:flex;gap:12px;padding:15px 17px;border-radius:11px;
  background:rgba(245,184,73,.07);border:1px solid rgba(245,184,73,.24);
  color:var(--dim);font-size:14.5px;margin-top:18px;
}
.note .i{color:var(--warn);flex:none;font-size:16px;line-height:1.4}
.note b{color:var(--ink)}

footer{
  margin-top:84px;padding:28px 0 44px;border-top:1px solid var(--line-soft);
  display:flex;gap:14px;flex-wrap:wrap;align-items:center;
  color:var(--dimmer);font-size:13.5px;
}
footer .sp{flex:1}
footer a{color:var(--dim);text-decoration:none}

nav a.nl:hover,footer a:hover{color:var(--ink)}
.btn.primary:hover{transform:translateY(-1px);box-shadow:0 7px 24px rgba(76,141,255,.44)}
.btn.ghost:hover{border-color:var(--accent-dim);background:rgba(30,45,78,.9)}
.copy:hover{color:var(--ink);border-color:var(--accent-dim)}
.card:hover{border-color:var(--line);transform:translateY(-2px)}

@media (max-width:640px){
  .term-body{font-size:12.2px;padding:16px 16px 20px;min-height:auto}
  h1{font-size:clamp(30px,8.7vw,34px)}
  .hero-line{display:inline}
  #term .ln{white-space:normal;overflow-wrap:anywhere}
  header{padding-top:48px}
  .arc,.arc.two{display:none}
  /* Nav trên máy nhỏ: bỏ mục lục, giữ nhận diện. Ba link neo chen với cái pill
     làm cả hàng xuống dòng, và trên một trang ngắn thế này cuộn còn nhanh hơn bấm. */
  nav a.nl{display:none}
  section{padding-top:58px}
  .panel{padding:20px 18px}
  ol.steps li{padding-left:38px}

  /* Bảng yêu cầu: xếp mỗi hàng thành MỘT KHỐI, không còn ba cột.
     Ba cột trong 375px bóp cột "Vì sao" xuống một hai chữ mỗi dòng — chữ vẫn ở đó
     nhưng không ai đọc nổi, và đó là cột mang thông tin duy nhất người ta cần.
     Tên + mức bắt buộc dùng chung một hàng (flex, wrap), lý do xuống dòng chiếm
     trọn bề rộng. Hàng tiêu đề ẩn đi: "Có" màu xanh và "Cho fan-out" màu mờ đã
     tự nói ra chúng là gì, một tiêu đề cột lơ lửng trên một khối thì không. */
  .reqs, .reqs tbody{display:block}
  .reqs tr.hd{display:none}
  .reqs tr{
    display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;
    padding:15px 0;border-top:1px solid var(--line-soft);
  }
  .reqs td{display:block;border:none;padding:0;white-space:normal}
  .reqs td:first-child{white-space:normal;font-size:15.5px}
  .reqs td:nth-child(2){font-size:13.5px}
  .reqs td:nth-child(3){flex:1 0 100%;margin-top:5px;line-height:1.58}

  /* Footer: .sp đẩy hai link sang phải trên desktop, nhưng ở 375px nó đẩy link
     thứ hai xuống một dòng riêng lệch hẳn sang trái. Xếp dọc, bỏ khoảng đệm. */
  footer{flex-direction:column;align-items:flex-start;gap:8px;margin-top:56px}
  footer .sp{display:none}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .cur{animation:none}
  .btn,.copy,.card{transition:none}
  .btn:hover,.card:hover{transform:none}
}

/* AgentDC product landing: editorial layout inspired by SpaceVibe Deck.
   Scoped to the landing page; documentation keeps its existing navigation. */
body.deck-landing {
  --bg:#101211; --panel:#191b1a; --line:#303330; --line-soft:#242725;
  --ink:#f1f3ef; --dim:#a7ada8; --dimmer:#858d87; --accent:#e5e9df;
  --accent-2:#e0e7d7; --accent-dim:#6a7669; --maxw:1240px;
  background:var(--bg); font-family:Inter,"Segoe UI",sans-serif;
}
.deck-landing .bg { display:none }
.deck-landing .wrap { padding:0 42px; border-left:1px solid var(--line-soft); border-right:1px solid var(--line-soft) }
.deck-landing nav { min-height:84px; padding:0; border-bottom:1px solid var(--line); gap:24px }
.deck-landing nav .brand { font-size:17px; color:var(--ink) }
.deck-landing nav .pill { font-size:10px; background:transparent; border-color:var(--line); color:var(--dim) }
.deck-landing nav .nl { font-size:12px; color:var(--dim) }
.deck-landing header { padding:86px 0 0; text-align:center }
.deck-landing .eyebrow { color:#a8b4a4; font:500 11px/1.5 var(--mono); letter-spacing:.12em; text-transform:uppercase }
.deck-landing h1 { margin:24px auto 20px; max-width:920px; font-size:clamp(42px,6.8vw,82px); line-height:1.05; letter-spacing:-.065em; font-weight:600 }
.deck-landing .hero-line { display:inline; color:var(--ink); background:none; -webkit-text-fill-color:currentColor }
.deck-landing .sub { max-width:700px; margin:0 auto 32px; font-size:16px; color:var(--dim); line-height:1.8 }
.deck-landing .cta { margin:0 auto 18px; gap:10px }
.deck-landing .btn { border-radius:99px; padding:12px 23px; font-size:13px; box-shadow:none; transition:background .15s }
.deck-landing .btn.primary { background:#edf0e9; color:#151815; border-color:#edf0e9; box-shadow:none }
.deck-landing .btn.primary:hover { background:#fff; transform:none }
.deck-landing .btn.ghost { background:#202420; border-color:#383d37; color:var(--ink) }
.deck-landing .download-picker { display:flex; justify-content:center; flex-wrap:wrap; gap:10px; max-width:620px; margin-bottom:14px }
.deck-landing .platform-download { padding:10px 18px; border-radius:99px; background:#1d201d; border:1px solid #353a34; flex:1; max-width:270px; box-shadow:none }
.deck-landing .platform-download.recommended { border-color:#bcc9b1; background:#232a22; box-shadow:none }
.deck-landing .platform-title { font-size:12px; white-space:nowrap }
.deck-landing .platform-download .download-link { margin-top:3px; font-size:11px; color:var(--dim) }
.deck-landing .recommend-badge { background:#d5dfce; color:#233021; font-size:8px }
.deck-landing .detected-platform { font-size:11px; margin-bottom:14px }
.deck-landing .hero-command { display:flex; gap:12px; align-items:center; max-width:550px; margin:20px auto 12px; background:#1a1e1a; border:1px solid #353a34; border-radius:12px; padding:11px 14px; text-align:left }
.deck-landing .hero-command code { flex:1; min-width:0; overflow:auto; white-space:nowrap; font:11px/1.5 var(--mono); color:#dce1d7 }
.deck-landing .command-prefix { color:var(--dimmer); font:11px var(--mono) }
.deck-landing .copy { position:static; border:1px solid #353b33; border-radius:6px; background:#252b24; color:var(--dim); font-size:10px; padding:5px 8px }
.deck-landing .plat { font-size:10px; color:var(--dimmer); margin:14px 0 0 }
.deck-landing .agent-line { display:flex; justify-content:center; flex-wrap:wrap; gap:26px; margin:34px 0 62px; color:#a5aca1; font:12px var(--mono) }
.deck-landing .agent-line i { font-size:10px; font-style:normal; color:var(--dimmer) }
.deck-landing .hero-preview { margin:0 -10px; border:1px solid #494e43; border-radius:13px 13px 0 0; background:#141714; overflow:hidden; box-shadow:0 -25px 100px -55px #b7bb76 }
.deck-landing .preview-title { display:flex; align-items:center; gap:20px; padding:13px 18px; border-bottom:1px solid var(--line); font:11px var(--mono); color:var(--dim) }
.deck-landing .window-dots { color:#a4b78b; letter-spacing:3px }
.deck-landing .preview-local { margin-left:auto; font-size:9px; color:#b2c69f }
.deck-landing .hero-preview img { display:block; width:100%; height:auto }
.deck-landing .hero-preview figcaption { text-align:left; padding:10px 16px; font-size:10px; color:var(--dimmer) }
.deck-landing section { margin:0; padding:75px 0; border-top:1px solid var(--line); scroll-margin-top:20px }
.deck-landing .chapter { display:flex; align-items:center; justify-content:space-between; margin:0 0 14px }
.deck-landing .chapter h2 { margin:0; font-size:45px; color:var(--ink); letter-spacing:-.045em; text-transform:none; font-weight:500 }
.deck-landing .chapter > span { font:11px var(--mono); color:var(--dimmer) }
.deck-landing section > h2 { font:11px var(--mono); letter-spacing:.12em; color:var(--dimmer); margin-bottom:16px }
.deck-landing section > .h3 { font-size:24px; line-height:1.4; font-weight:400; letter-spacing:-.02em; margin:0 0 35px; color:var(--dim) }
.deck-landing .feature-stage { display:grid; grid-template-columns:1fr 1.15fr; gap:70px; align-items:center; padding:30px 0 45px }
.deck-landing .feature-copy .kicker { font:9px var(--mono); letter-spacing:.13em; color:#96a98b }
.deck-landing .feature-copy h3 { font-size:34px; letter-spacing:-.035em; font-weight:500; line-height:1.2; margin:18px 0 }
.deck-landing .feature-copy p { font-size:14px; line-height:1.85; color:var(--dim); max-width:380px }
.deck-landing .feature-copy a { color:#ccd8bd; font-size:12px; text-decoration:none; border-bottom:1px solid #515e46; padding-bottom:4px }
.deck-landing .session-demo { border:1px solid #3b4237; padding:20px; border-radius:12px; background:linear-gradient(145deg,#222820,#171b17); box-shadow:0 18px 60px -45px #9fae86 }
.deck-landing .demo-top { display:flex; justify-content:space-between; font:11px var(--mono); padding-bottom:18px; color:#d1dac6 }
.deck-landing .demo-top span { font-size:9px; color:var(--dimmer) }
.deck-landing .session-row { display:flex; align-items:center; gap:12px; padding:17px 0; border-top:1px solid #353e31 }
.deck-landing .session-row b { font-size:12px; font-weight:500 }
.deck-landing .session-row small { display:block; font-size:10px; color:var(--dimmer); margin-top:4px }
.deck-landing .agent-glyph { font-size:22px; color:#c7d6b7 }
.deck-landing .state { margin-left:auto; flex-shrink:0; font:9px var(--mono); color:#96a190; padding:4px 6px; border-radius:4px; background:#252e23 }
.deck-landing .state.working { color:#bdd8a5 }
.deck-landing .state.waiting { color:#e3c884; background:#38301e }
.deck-landing .grid { gap:0; border:1px solid var(--line); border-radius:10px; overflow:hidden; background:#171a16 }
.deck-landing .card { border:0; border-radius:0; padding:27px; background:transparent; border-right:1px solid var(--line); box-shadow:none; transform:none }
.deck-landing .card h4 { font-size:16px; font-weight:500; margin:16px 0 10px }
.deck-landing .card p { font-size:13px; line-height:1.85; color:var(--dim) }
.deck-landing .ico { color:#c5d1b8; font-size:22px; background:none; padding:0; width:auto; height:auto }
.deck-landing .tool-stack { border:1px solid var(--line); border-radius:10px; padding:6px 22px; background:#191d18 }
.deck-landing .tool-stack > div { display:grid; grid-template-columns:28px 1fr; padding:19px 0; gap:5px 12px; border-bottom:1px solid var(--line) }
.deck-landing .tool-stack > div:last-child { border-bottom:0 }
.deck-landing .tool-stack span { grid-row:span 2; font-size:22px; color:#afc097 }
.deck-landing .tool-stack b { font-size:13px; font-weight:500 }
.deck-landing .tool-stack small { font-size:11px; color:var(--dimmer) }
.deck-landing .panel { background:#171a17; border-color:var(--line); border-radius:10px; box-shadow:none }
.deck-landing .term { background:#131713; border-color:#343c30; border-radius:10px; box-shadow:none }
.deck-landing header .term { margin-top:0 }
.deck-landing .term-bar { background:#1d241b; border-color:#343c30 }
.deck-landing .term-body { color:#b6c0ad; font-size:12px }
.deck-landing .two { margin-top:30px }
.deck-landing footer { padding:40px 0; margin:0; border-top:1px solid var(--line); font-size:11px; gap:24px }
.deck-landing footer b { color:var(--ink); font-size:16px; font-weight:600 }
@media(max-width:850px) {
 .deck-landing .wrap { padding:0 22px }
 .deck-landing nav { gap:14px }.deck-landing .source-nav { display:none }
 .deck-landing nav .pill { display:none }
 .deck-landing header { padding-top:60px }
 .deck-landing .feature-stage { gap:30px; grid-template-columns:1fr }
 .deck-landing .feature-copy p { max-width:100% }
 .deck-landing .agent-line { gap:18px; margin-bottom:40px }
 .deck-landing .chapter h2 { font-size:36px }
 .deck-landing section { padding:50px 0 }
 .deck-landing .grid { grid-template-columns:1fr 1fr }
 .deck-landing .card { border-bottom:1px solid var(--line) }
}
@media(max-width:520px) {
 .deck-landing .wrap { padding:0 17px }
 .deck-landing nav { min-height:68px; gap:12px }.deck-landing nav .nl { font-size:10px }
 .deck-landing .brand { margin-right:auto }.deck-landing nav .sp { display:none }
 .deck-landing h1 { font-size:48px; letter-spacing:-.055em }
 .deck-landing .sub { font-size:13px }.deck-landing .sub br { display:none }
 .deck-landing .btn { padding:11px 17px; font-size:12px }
 .deck-landing .download-picker { gap:8px }.deck-landing .platform-download { padding:10px 12px }
 .deck-landing .platform-title { font-size:10px }.deck-landing .platform-meta { display:none }
 .deck-landing .recommend-badge { font-size:7px; padding:3px 4px }
 .deck-landing .agent-line { gap:17px; font-size:10px }.deck-landing .agent-line i { width:100% }
 .deck-landing .hero-command code { font-size:9px }.deck-landing .hero-command { padding:10px; gap:8px }
 .deck-landing .grid { grid-template-columns:1fr }.deck-landing .card { padding:24px }
 .deck-landing .feature-copy h3 { font-size:30px }.deck-landing .session-demo { padding:14px }
 .deck-landing .session-row { gap:8px }.deck-landing .session-row small { font-size:9px }
 .deck-landing footer { flex-wrap:wrap; gap:18px }.deck-landing footer > span:first-child { width:100% }
 .deck-landing .reqs { font-size:11px }.deck-landing .reqs td { padding:10px 7px }
}

.deck-landing header { padding-top:58px }
.deck-landing h1 { font-size:clamp(42px,5.8vw,70px); margin-top:20px }
.deck-landing .eyebrow { background:transparent; border:0; padding:0 }
.deck-landing .agent-line { margin:25px 0 38px }
.deck-landing .platform-download.card { display:block; padding:9px 17px; border:1px solid #353a34; border-radius:99px; background:#1d201d }
.deck-landing .platform-download.card.recommended { border-color:#87967b; background:#232a22 }
.deck-landing .plat .w { color:var(--dim) }
@media(max-width:520px){ .deck-landing header { padding-top:45px }.deck-landing h1 { font-size:45px }.deck-landing .platform-download.card { padding:9px 11px } }

.deck-landing .platform-icon { display:block; width:17px; height:17px; flex:0 0 17px; object-fit:contain }
.deck-landing .linux-icon { filter:invert(1) }
.deck-landing .agent-line > span { display:inline-flex; align-items:center; gap:9px }
.deck-landing .agent-line img { width:21px; height:21px; object-fit:contain }
.deck-landing img.agent-glyph { width:26px; height:26px; flex:0 0 26px; object-fit:contain }

/* An HTML preview of AgentDC's single-session portal, with sample content. */
.deck-landing .portal-preview { position:relative; display:grid; grid-template-columns:260px minmax(0,1fr); min-height:470px; text-align:left; background:#101110; color:#c9cdc6 }
.deck-landing .preview-choice { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%) }
.deck-landing .preview-sidebar { display:flex; flex-direction:column; gap:18px; padding:24px 14px 18px; border-right:1px solid #30342d; background:#191c18 }
.deck-landing .preview-brand { font:600 17px var(--sans); padding:0 9px }.deck-landing .preview-brand small { color:#8b9780; font:10px var(--mono) }
.deck-landing .preview-folder { padding:12px 9px; border:1px solid #333c2e; border-radius:7px; font-size:12px }
.deck-landing .preview-new { color:#cedbbc; background:#2b3824; border:1px solid #506342; border-radius:7px; padding:10px; font-size:11px }
.deck-landing .preview-sessions { display:grid; gap:7px }
.deck-landing .preview-sessions label { display:flex; align-items:center; gap:10px; padding:12px 9px; border:1px solid transparent; border-radius:7px; cursor:pointer; transition:background .2s }
.deck-landing .preview-sessions label:hover { background:#242a20 }
.deck-landing .preview-sessions img { width:21px; height:21px; object-fit:contain }.deck-landing .preview-sessions span { flex:1; min-width:0 }
.deck-landing .preview-sessions b { display:block; font-size:11px; font-weight:500 }.deck-landing .preview-sessions small { display:block; font:9px var(--mono); color:#8f9887; margin-top:6px }
.deck-landing .preview-sessions i { width:6px; height:6px; flex:none; border-radius:50%; background:#8baf72 }.deck-landing .preview-sessions .preview-needs { background:#e3bd6c }
.deck-landing .preview-busy { animation:preview-pulse 1.8s ease-in-out infinite }
.deck-landing .preview-user { margin-top:auto; font:10px var(--mono); color:#7d8973; padding:0 9px }
.deck-landing .preview-main { min-width:0; display:flex; flex-direction:column }
.deck-landing .preview-toolbar { display:flex; gap:20px; justify-content:space-between; border-bottom:1px solid #292e25; padding:15px 20px; font:9px var(--mono); color:#86917d }
.deck-landing .preview-screen { display:block; padding:27px 30px; min-height:335px; font:12px/1.8 var(--mono) }
.deck-landing .preview-screen p { margin:12px 0 }.deck-landing .preview-agent-title { display:flex; align-items:center; gap:10px; font-weight:600; margin-bottom:25px; color:#e3e8dd }
.deck-landing .preview-agent-title img { width:22px; height:22px; object-fit:contain }.deck-landing .preview-agent-title small { margin-left:auto; color:#79866e; font-size:9px; font-weight:400 }
.deck-landing .preview-screen .preview-prompt { color:#e8ecdf; padding:9px 12px; background:#20251c; border-left:2px solid #87976d }
.deck-landing .preview-screen .preview-tool { color:#9bb8cb }.deck-landing .preview-screen .preview-muted { color:#73806a; font-size:10px }
.deck-landing .preview-progress { color:#c4ad7d }.deck-landing .preview-progress span { display:inline-block; animation:preview-spin 5s linear infinite }
.deck-landing .preview-question { color:#e0c28b }.deck-landing .preview-done { color:#a9c792 }
.deck-landing .preview-composer { display:flex; align-items:center; gap:15px; margin:0 20px 20px; border:1px solid #576842; border-radius:7px; padding:12px 14px; font:10px var(--mono); color:#77836c }
.deck-landing .preview-send { margin-left:auto; color:#bfd89d; font-size:19px }
#preview-claude:checked ~ .preview-sidebar label[for="preview-claude"], #preview-codex:checked ~ .preview-sidebar label[for="preview-codex"], #preview-opencode:checked ~ .preview-sidebar label[for="preview-opencode"] { background:#2a3224; border-color:#45543a }
#preview-claude:focus-visible ~ .preview-sidebar label[for="preview-claude"], #preview-codex:focus-visible ~ .preview-sidebar label[for="preview-codex"], #preview-opencode:focus-visible ~ .preview-sidebar label[for="preview-opencode"] { outline:2px solid #c6d9ac; outline-offset:2px }
@keyframes preview-pulse { 50% { opacity:.35 } } @keyframes preview-spin { to { transform:rotate(360deg) } }
@media(max-width:700px) {
 .deck-landing .portal-preview { grid-template-columns:1fr; min-height:0 }.deck-landing .preview-sidebar { padding:14px; gap:10px; border-right:0; border-bottom:1px solid #30342d }
 .deck-landing .preview-brand,.deck-landing .preview-folder,.deck-landing .preview-new,.deck-landing .preview-user { display:none }
 .deck-landing .preview-sessions { grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px }.deck-landing .preview-sessions label { padding:9px 6px; gap:6px }.deck-landing .preview-sessions b { display:none }.deck-landing .preview-sessions small { font-size:8px; margin:0 }.deck-landing .preview-sessions img { width:17px; height:17px }.deck-landing .preview-sessions i { display:none }
 .deck-landing .preview-screen { padding:20px 17px; font-size:10px; min-height:310px }.deck-landing .preview-agent-title small { display:none }.deck-landing .preview-toolbar { font-size:8px; padding:12px 15px; gap:8px }.deck-landing .preview-composer { margin:0 14px 14px; font-size:8px }
}
@media(prefers-reduced-motion:reduce) { .deck-landing .preview-busy,.deck-landing .preview-progress span { animation:none } }

/* Match the desktop portal's black sidebar, lime composer and cyan key bar. */
.deck-landing .portal-preview { background:#090a0b; color:#c4c7cd; grid-template-columns:250px minmax(0,1fr); min-height:500px }
.deck-landing .hero-preview { border-color:#383b42; border-radius:12px; box-shadow:0 20px 75px -35px #000,0 0 65px -40px #a9ba76 }
.deck-landing .preview-title { background:#141515; border-color:#303238; gap:16px; padding:9px 15px; min-height:43px }
.deck-landing .preview-menu { color:#858a8e; font-size:15px }.deck-landing .preview-top-agent { display:flex; align-items:center; gap:9px; padding:6px 10px; border:1px solid #365766; border-radius:7px; background:#19242b }
.deck-landing .preview-top-agent img { width:15px; height:15px; object-fit:contain }.deck-landing .preview-memory { padding:7px 10px; border:1px solid #32353b; border-radius:7px; color:#adb4c6 }.deck-landing .preview-memory small { color:#8aa3df; margin-left:9px }
.deck-landing .preview-sidebar { background:#141414; border-color:#282a2f; padding:20px 12px 16px; gap:17px }
.deck-landing .preview-brand { display:flex; align-items:center; gap:10px; font-size:14px; padding:0 2px 13px; border-bottom:1px solid #33343a }
.deck-landing .preview-brand small { color:#d5d9e4; font-size:10px }.deck-landing .preview-brand em { display:block; color:#79838c; font-size:9px; font-style:normal; font-weight:400; margin-top:5px }
.deck-landing .preview-appmark { display:grid; place-items:center; width:30px; height:30px; flex:none; border-radius:8px; background:#0e1a30; color:#7cb1ff; border:1px solid #2f4472; font:700 18px var(--mono) }
.deck-landing .preview-folder { background:#151d32; border-color:#30415d; color:#d1dbea; font-weight:600 }
.deck-landing .preview-new { background:linear-gradient(#547618,#304c0b); border-color:#739331; color:#f0f6dc; font-weight:600; padding:12px; box-shadow:inset 0 1px 0 #8da65055 }
.deck-landing .preview-sessions label { border-radius:7px; padding:13px 9px }.deck-landing .preview-sessions label:hover { background:#26282c }
.deck-landing .preview-sessions b { color:#e2e5ed }.deck-landing .preview-sessions small { color:#8d959f }
#preview-claude:checked ~ .preview-sidebar label[for="preview-claude"], #preview-codex:checked ~ .preview-sidebar label[for="preview-codex"], #preview-opencode:checked ~ .preview-sidebar label[for="preview-opencode"] { background:#2c2d30; border-color:#3a414d; box-shadow:inset 3px 0 #7ba6f5 }
.deck-landing .preview-user { color:#9aa4af }.deck-landing .preview-toolbar { background:#0e1013; border-color:#242830; color:#738295 }
.deck-landing .preview-agent-title { color:#edf0f5 }.deck-landing .preview-agent-title small { color:#7e8898 }.deck-landing .preview-screen { min-height:330px; padding:27px 30px 15px }
.deck-landing .preview-screen .preview-prompt { background:#171b21; color:#e1e8f0; border-color:#65a8e2 }.deck-landing .preview-screen .preview-muted { color:#828995 }.deck-landing .preview-screen .preview-tool { color:#9ac0e5 }
.deck-landing .preview-session-meta { display:flex; justify-content:space-between; padding:7px 14px; border:1px solid #2b3037; color:#80aaff; background:#121418; font:9px var(--mono) }.deck-landing .preview-session-meta span { color:#858b95 }
.deck-landing .preview-keybar { display:flex; margin:17px 16px 10px; overflow:hidden; width:fit-content; max-width:calc(100% - 32px); border:1px solid #255b6b; border-radius:5px }
.deck-landing .preview-keybar span { display:grid; place-items:center; min-width:31px; height:29px; padding:0 6px; border-right:1px solid #265568; background:#10212b; color:#c9deea; font:10px var(--mono) }.deck-landing .preview-keybar span:first-child,.deck-landing .preview-keybar span:nth-child(9),.deck-landing .preview-keybar span:last-child { background:#54cbe9; color:#102330 }.deck-landing .preview-keybar span:last-child { border:0 }
.deck-landing .preview-composer { margin:0 14px 14px; border:2px solid #9aca38; padding:7px 8px 7px 14px; color:#8c949e; border-radius:9px; background:#121417 }.deck-landing .preview-send { display:grid; place-items:center; width:32px; height:31px; border-radius:5px; background:#b2e333; color:#233a09; font-size:17px }
@media(max-width:700px) { .deck-landing .portal-preview { grid-template-columns:1fr; min-height:0 }.deck-landing .preview-sidebar { padding:11px; gap:0 }.deck-landing .preview-brand { display:none }.deck-landing .preview-screen { padding:20px 17px 12px }.deck-landing .preview-keybar { margin:12px 14px 9px }.deck-landing .preview-keybar span { min-width:22px; padding:0 4px; font-size:9px }.deck-landing .preview-memory { font-size:9px }.deck-landing .preview-session-meta span { font-size:8px } }

/* The portal's tiled view: two sessions above one full-width session. */
.deck-landing .preview-toolbar { justify-content:flex-start; gap:0; padding:0; overflow-x:auto; background:#171b19 }
.deck-landing .preview-toolbar label { display:flex; align-items:center; gap:7px; padding:10px 12px; border-right:1px solid #343a35; border-bottom:2px solid transparent; white-space:nowrap; cursor:pointer; color:#a2abb2; font:9px var(--sans) }
.deck-landing .preview-toolbar img { width:15px; height:15px; object-fit:contain }.deck-landing .preview-toolbar label span { margin-left:8px; color:#77818d }
.deck-landing .preview-panes { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; padding:6px; background:#141714; flex:1 }
.deck-landing .preview-screen { padding:0 13px 12px; min-width:0; min-height:0; border:1px solid #353a36; border-radius:6px; background:#08090a; overflow:hidden; font-size:10px; line-height:1.7; transition:border-color .2s,box-shadow .2s }
.deck-landing .preview-screen-opencode { grid-column:1 / -1 }
.deck-landing .preview-agent-title { background:#20221f; margin:0 -13px 12px; padding:10px 12px; border-bottom:1px solid #343833; font:600 10px var(--sans) }
.deck-landing .preview-agent-title img { width:16px; height:16px }.deck-landing .preview-agent-title small { font:9px var(--sans); color:#a3aab2; margin-left:auto }
.deck-landing .preview-screen p { margin:8px 0 }.deck-landing .preview-screen .preview-muted { font-size:9px }.deck-landing .preview-screen .preview-prompt { padding:8px 9px }
.deck-landing .preview-screen::after { content:'❯'; display:block; margin-top:14px; padding-top:7px; border-top:1px solid #363b35; color:#dbe4ec }
#preview-claude:checked ~ .preview-main .preview-screen-claude, #preview-codex:checked ~ .preview-main .preview-screen-codex, #preview-opencode:checked ~ .preview-main .preview-screen-opencode { border-color:#7395d4; box-shadow:inset 0 0 0 1px #7395d422 }
#preview-claude:checked ~ .preview-main label[for="preview-claude"], #preview-codex:checked ~ .preview-main label[for="preview-codex"], #preview-opencode:checked ~ .preview-main label[for="preview-opencode"] { color:#e4ecf5; border-bottom-color:#83a8ef; background:#242c29 }
@media(max-width:950px) { .deck-landing .portal-preview { grid-template-columns:205px minmax(0,1fr) }.deck-landing .preview-agent-title small { display:none }.deck-landing .preview-sessions b { font-size:10px } }
@media(max-width:700px) { .deck-landing .portal-preview { grid-template-columns:1fr }.deck-landing .preview-panes { grid-template-columns:1fr }.deck-landing .preview-screen-opencode { grid-column:auto }.deck-landing .preview-screen { padding:0 12px 12px }.deck-landing .preview-agent-title { margin:0 -12px 12px }.deck-landing .preview-agent-title small { display:block; font-size:8px }.deck-landing .preview-toolbar label { padding:9px; font-size:8px }.deck-landing .preview-sessions b { display:none } }

/* Feature previews share the real app's visual language and remain local demos. */
.feature-view[hidden] { display:none !important }
.deck-landing .feature-switch { display:flex; gap:5px; padding:12px; overflow-x:auto; background:#171b18; border-bottom:1px solid #32382e }
.deck-landing .feature-switch button { flex:none; border:1px solid transparent; border-radius:7px; padding:10px 15px; background:transparent; color:#8f9b8c; font:500 12px var(--sans); cursor:pointer; transition:background .2s,color .2s }
.deck-landing .feature-switch button span { font:9px var(--mono); margin-left:8px; color:#839478 }
.deck-landing .feature-switch button:hover { background:#252c22; color:#e6ecdf }.deck-landing .feature-switch button[aria-pressed="true"] { background:#303b27; color:#e4edda; border-color:#4b5d3c }
.deck-landing .feature-app { min-height:540px; text-align:left; background:#0d111b; color:#dce5f1; font:13px/1.65 var(--sans) }
.deck-landing .feature-app h3 { font:600 17px/1.4 var(--sans); margin:0 0 8px; letter-spacing:-.02em }.deck-landing .feature-app h4 { font:600 13px/1.5 var(--sans); margin:0 0 5px }.deck-landing .feature-app p { font-size:12px; margin:8px 0; color:#9ba9bd }.deck-landing .app-muted { color:#8593a8; font-size:11px }
.deck-landing .app-preview-top { display:flex; align-items:center; gap:18px; min-height:54px; padding:14px 22px; border-bottom:1px solid #263349; background:#131c2d; font-size:11px; color:#8d9db3 }.deck-landing .app-preview-top b { color:#e2eafa; font-size:14px }
.deck-landing .demo-badge { margin-left:auto; white-space:nowrap; color:#9cae97; border:1px solid #3c4c3a; background:#202c20; border-radius:99px; padding:4px 9px; font:9px var(--mono) }
.deck-landing .zalo-preview-grid { display:grid; grid-template-columns:210px minmax(0,1fr) 350px; min-height:486px }
.deck-landing .app-list { padding:18px; background:#111827; border-right:1px solid #263349; min-width:0 }.deck-landing .app-search { display:block; border:1px solid #2d3d53; border-radius:7px; padding:9px 11px; color:#7f91ab; font-size:11px; background:#0c1320 }.deck-landing .app-filter { display:flex; gap:20px; color:#62d8f1; font-size:11px; padding:15px 0; border-bottom:1px solid #263349 }.deck-landing .app-filter span { color:#8392a8 }.deck-landing .app-empty { padding-top:30px; text-align:center; font-size:11px }
.deck-landing .app-conversation { display:flex; flex-direction:column; justify-content:center; align-items:center; padding:30px 22px; text-align:center; background:#0c111c }.deck-landing .app-conversation h3 { font-size:14px }.deck-landing .empty-symbol { color:#41647f; font-size:40px; margin-bottom:15px }
.deck-landing .app-config { padding:23px; background:linear-gradient(135deg,#121b2d,#0d1526); border-left:1px solid #2a3851 }.deck-landing .app-account { display:flex; flex-direction:column; border:1px solid #4c99bb; background:#1c3040; border-radius:7px; padding:12px; margin:20px 0 }.deck-landing .app-account b { font-size:12px }.deck-landing .app-account small { font-size:10px; color:#8ba1b6 }.deck-landing .app-config-tabs { color:#64ddf2; border-bottom:1px solid #263349; padding-bottom:12px; font-size:11px }.deck-landing .app-config-tabs span { color:#8491a5; margin-left:20px }
.deck-landing .config-line { display:flex; gap:13px; margin:20px 0 }.deck-landing .config-line > b { color:#6ed8ee; font:11px var(--mono); border:1px solid #416779; border-radius:99px; width:25px; height:25px; display:grid; place-items:center; flex:none }.deck-landing .config-line > div { flex:1; min-width:0; font-size:12px }.deck-landing .config-line strong { display:block; padding:8px 10px; margin-top:9px; border:1px solid #2a4055; border-radius:6px; font-size:11px; font-weight:400; color:#bbd4e1 }.deck-landing .config-line strong span { float:right }
.deck-landing .feature-app details { border-top:1px solid #29374b; padding:13px 0; font-size:11px; color:#9faec3 }.deck-landing .feature-app summary { cursor:pointer; color:#c4d5e6; padding:3px 0 }.deck-landing .demo-values { display:flex; gap:12px; margin-top:10px }.deck-landing .demo-values > span { flex:1; padding:8px 10px; border:1px solid #2d3a4e; border-radius:6px; font-size:10px; color:#8494aa }.deck-landing .demo-values b { display:block; color:#dce6f2; font-size:12px }
.deck-landing .memory-toolbar { display:flex; align-items:center; gap:20px; padding:14px 22px; border-bottom:1px solid #263349; color:#9cb2cb; font-size:11px }.deck-landing .memory-toolbar .app-search { margin-left:auto; min-width:180px }.deck-landing .memory-preview-grid { display:grid; grid-template-columns:255px minmax(0,1fr); min-height:440px }.deck-landing .app-tree-title { display:block; color:#c5d4e8; font-size:12px; margin-bottom:16px }.deck-landing .app-list details { border:0; padding:8px 0 0 12px }.deck-landing .app-list details p { padding:5px; margin:3px 0; color:#8eb5dc; font-size:11px }.deck-landing .memory-article { padding:30px 40px; max-width:750px }.deck-landing .memory-article h3 { font-size:24px; margin:17px 0 6px }.deck-landing .memory-article h4 { margin-top:25px }.deck-landing .memory-article li { font-size:12px; color:#a1b1c6; margin:8px 0 }.deck-landing .app-breadcrumb { color:#6c91b2; font:10px var(--mono) }.deck-landing .memory-note { padding:13px 16px; border-left:2px solid #60c9df; background:#152635; color:#acc9d7; font-size:12px; margin:20px 0 }.deck-landing .memory-tags { display:flex; gap:8px; margin-top:25px }.deck-landing .memory-tags span { border:1px solid #2d4560; border-radius:5px; color:#87a8ca; font-size:10px; padding:3px 8px }
.deck-landing .schedule-preview-grid { display:grid; grid-template-columns:1fr 430px; gap:35px; padding:30px; background:#111213; min-height:486px }.deck-landing .schedule-list { padding:10px }.deck-landing .schedule-item { display:flex; align-items:center; gap:13px; border:1px solid #34383d; background:#1a1c1e; border-radius:9px; padding:18px; margin:25px 0 }.deck-landing .schedule-item b { font-size:12px }.deck-landing .schedule-item p { font-size:11px; margin:5px 0 }.deck-landing .schedule-item small { color:#778693; font-size:10px }.deck-landing .schedule-clock { color:#9fb5ca; font-size:25px }.deck-landing .schedule-form { background:#1a1a1b; border:1px solid #393c40; border-radius:12px; padding:23px }.deck-landing .demo-field { display:flex; flex-direction:column; gap:7px; margin:13px 0; flex:1; min-width:0 }.deck-landing .demo-field small { color:#8e969f; font-size:10px }.deck-landing .demo-field > span,.deck-landing .demo-field > p { display:block; padding:10px 12px; border:1px solid #30343a; border-radius:6px; background:#0d0e10; color:#c9d3df; font-size:11px; margin:0 }.deck-landing .schedule-form .demo-values { margin:0 }.deck-landing .schedule-form .app-filter { border-color:#34383d }
.deck-landing .bridge-preview { max-width:690px; margin:auto; padding:35px 25px }.deck-landing .bridge-glyph { display:grid; place-items:center; width:34px; height:34px; border-radius:8px; border:1px solid #356277; background:#132b39; color:#6ddcf3; font:18px var(--mono); margin-bottom:15px }.deck-landing .bridge-preview h3 { font-size:25px }.deck-landing .bridge-card { border:1px solid #304057; border-radius:12px; padding:0 23px 5px; margin-top:22px; background:#111c2c }.deck-landing .bridge-state { margin:0 -23px; padding:17px 23px; background:#172939; border-bottom:1px solid #304057; color:#d5e3f1; font-size:13px }.deck-landing .bridge-state small { display:block; font-size:10px; color:#8ea3b9; padding-top:5px }
@media(max-width:1000px) { .deck-landing .zalo-preview-grid { grid-template-columns:180px 1fr }.deck-landing .app-conversation { display:none }.deck-landing .schedule-preview-grid { grid-template-columns:1fr 1.1fr; gap:15px; padding:20px }.deck-landing .schedule-item { flex-wrap:wrap } }
@media(max-width:650px) { .deck-landing .feature-switch { padding:8px; gap:2px }.deck-landing .feature-switch button { padding:9px 11px; font-size:11px }.deck-landing .feature-switch button span { display:none }.deck-landing .app-preview-top { gap:10px; padding:12px 15px }.deck-landing .app-preview-top > span:not(.demo-badge) { display:none }.deck-landing .zalo-preview-grid { grid-template-columns:1fr }.deck-landing .zalo-preview-grid .app-list { display:none }.deck-landing .app-config { border-left:0 }.deck-landing .memory-toolbar { flex-wrap:wrap; gap:10px; padding:13px }.deck-landing .memory-toolbar .app-search { width:100%; order:1 }.deck-landing .memory-preview-grid { grid-template-columns:1fr }.deck-landing .memory-preview-grid > .app-list { border-right:0; border-bottom:1px solid #263349 }.deck-landing .memory-article { padding:25px 20px }.deck-landing .schedule-preview-grid { grid-template-columns:1fr; padding:14px }.deck-landing .schedule-list { padding:5px }.deck-landing .schedule-item { margin:12px 0 }.deck-landing .bridge-preview { padding:28px 18px } }

/* Shared public-site theme. App previews deliberately keep their own UI colors. */
body.site-page { --bg:#101310; --panel:#191e18; --line:#30372c; --line-soft:#272e24; --ink:#edf0e7; --dim:#a4ad9c; --dimmer:#7e8976; --accent:#bdcfa6; --accent-2:#d1dfbc; --accent-dim:#506343; background:var(--bg); color:var(--ink) }
.site-page .toc-foot a { min-height:38px; display:flex; align-items:center; justify-content:center; padding:10px 12px; line-height:1.3 }
.site-page .toc-foot a + a { margin-top:10px }
.site-page .bg { display:none }.site-page .wrap { max-width:1240px; padding:0 40px; border-left:1px solid #232a20; border-right:1px solid #232a20; min-height:100vh }
.site-page nav { min-height:84px; padding:20px 0; border-bottom:1px solid var(--line); gap:24px }.site-page nav .brand { font-size:17px }.site-page nav a.nl { font-size:12px; color:var(--dim) }.site-page nav a.nl:hover { color:var(--ink) }.site-page .pill { background:#1b2118; border-color:#394532; color:#aebda0; font-size:10px }
.site-page header { padding:55px 0 30px; text-align:left }.site-page h1 { color:var(--ink); background:none; font-family:var(--sans); font-weight:500; letter-spacing:-.045em; font-size:clamp(32px,4vw,48px); line-height:1.12 }.site-page .eyebrow { background:none; border:0; padding:0; letter-spacing:.1em; font:10px var(--mono); color:#a8bc96 }.site-page .sub { margin:0; font-size:16px; max-width:750px; color:var(--dim) }
.site-page footer { margin-top:45px; padding:30px 0; border-top:1px solid var(--line); font-size:11px; gap:24px }.site-page footer a { color:var(--dim) }.site-page a { color:var(--accent-2) }
.site-page .doc { grid-template-columns:235px minmax(0,1fr); gap:45px; padding-top:32px }.site-page .toc { background:#151a14; border-color:var(--line); border-radius:9px; height:calc(100vh - 40px) }.site-page .toc-bar,.site-page .tm-bar,.site-page .doc-frame-bar { background:#20271c; border-color:var(--line) }.site-page .toc-foot { background:#1b2118; border-color:var(--line) }.site-page .toc a.on { color:#d1dfbc; background:#2c3623; border-left-color:#b5cc9b }.site-page .toc a:hover { background:#232d1d }.site-page .toc-foot a { background:#ccd9bc; color:#18200f }.site-page .toc-foot a:hover { background:#dce7cf }.site-page .toc-foot .dl-link[aria-disabled="true"] { background:#30382a }
.site-page .tm,.site-page .doc-frame { background:#10150f; border-color:var(--line); border-radius:9px }.site-page .tm-body { color:#d1d9c8; font-size:12px }.site-page .sh h3 { font:500 28px/1.2 var(--sans); letter-spacing:-.035em }.site-page .doc-body h4 { font:600 16px/1.5 var(--sans) }.site-page .doc-body p,.site-page .doc-body li { font-size:14px; line-height:1.9 }.site-page .doc-body code { color:#c5d8b3; background:#20291b }.site-page .step { border-color:#4c613d }.site-page .sh .pmt { color:#a7bf90 }.site-page .callout { background:#1b2416; border-color:#35472b }
.site-page .status-summary,.site-page .release-panel { background:#171e15; border-radius:10px }.site-page .status-head h1 { letter-spacing:-.045em; font-weight:500 }.site-page .status-head p { font-size:15px }.site-page .status-actions button { background:#232d1c }.site-page .release-main { padding:22px }.site-page .release-download { color:#d1dfbc; background:#222d1b; border-color:#4c613d }
.site-page .tip { background:#1b2416; border-color:#3b4e30 }.site-page .tip.warn { background:#282318; border-color:#665132 }
@media(max-width:850px) { .site-page .wrap { padding:0 22px }.site-page nav { gap:15px; flex-wrap:wrap }.site-page .doc { grid-template-columns:190px minmax(0,1fr); gap:25px } }
@media(max-width:700px) { .site-page .doc { grid-template-columns:1fr }.site-page .toc { position:static; height:auto; max-height:none }.site-page .toc-links { display:flex; flex-wrap:wrap; gap:3px; padding:10px }.site-page .toc-links a { font:11px var(--sans); padding:9px 10px }.site-page .toc-foot { display:none }.site-page .toc-bar { padding:10px }.site-page .doc-body { min-width:0 }.site-page .wrap { padding:0 17px }.site-page nav { min-height:70px; gap:13px }.site-page nav .pill { display:none }.site-page nav a.nl { font-size:11px }.site-page header { padding-top:35px }.site-page footer { flex-wrap:wrap; gap:15px }.site-page .sh h3 { font-size:24px } }
@media(max-width:700px) { .site-page nav a.nl,.deck-landing nav a.nl { display:inline-flex }.site-page nav .sp { display:none }.site-page nav .brand { width:100% }.deck-landing nav { flex-wrap:wrap; padding:16px 0 }.deck-landing nav a.source-nav { display:none } }

/* Deck's current hero shell. The app inside remains AgentDC's interface. */
body.deck-landing,body.site-page { --a-cell-pad:24px; --a-font-display:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",sans-serif; --a-font-mono:"SF Mono","JetBrains Mono",Consolas,monospace; --a-ink:#fff; --a-ink-soft:rgb(255 255 255 / 64%); --a-ink-faint:rgb(255 255 255 / 52%); --a-accent:#fff; --sg-yellow:#d9bd73; --hero-enter:cubic-bezier(.05,.7,.1,1); --bg:#101310; --line:rgb(255 255 255 / 12%); --ink:#f4f5f2; --dim:#a5aaa5; --dimmer:#848b84; --accent:#fff; --accent-2:#dfe6d8; background:var(--bg); font-family:var(--a-font-display) }
.deck-landing .wrap,.site-page .wrap { max-width:1248px; padding:0 24px; border-color:rgb(255 255 255 / 12%) }
.deck-landing nav,.site-page nav { min-height:69px; padding:18.4px 0; gap:32px; font:600 10px/1 var(--a-font-display) }.deck-landing nav .brand,.site-page nav .brand { font-size:11px; gap:10px }.deck-landing nav .pill { display:none }.deck-landing nav a.nl,.site-page nav a.nl { font-size:10px }.deck-landing nav a.nl:hover,.site-page nav a.nl:hover { color:#fff }
.locale-switch { display:inline-flex; flex:none; align-items:center; gap:7px; padding:6px 8px; border:1px solid rgb(255 255 255 / 13%); border-radius:99px; font:600 10px/1 var(--sans); color:#606b60 }.locale-switch a { text-decoration:none; color:#7f897f; padding:3px }.locale-switch a[aria-current="true"] { color:#fff }.locale-switch a:hover { color:#fff }
.deck-landing header { padding:0 }.deck-landing .hero-copy { padding:clamp(2.5rem,6vh,4.25rem) 0 clamp(2.25rem,5vh,3.25rem) }.deck-landing .hero-copy .hero-title { max-width:none; margin:0; font:500 clamp(2.7rem,4.5vw,4.25rem)/1.02 var(--a-font-display); letter-spacing:-.034em; color:rgb(255 255 255 / 96%); background:none }
.deck-landing .hero-copy > .eyebrow,.deck-landing .hero-copy > .sub,.deck-landing .hero-copy > .cta,.deck-landing .hero-copy > .detected-platform { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); margin:0 }
.deck-landing .hero-install { margin-top:clamp(1.75rem,4vh,2.4rem) }.deck-landing .download-picker { width:100%; margin:0; max-width:none; display:flex; gap:10px }.deck-landing .platform-download.card { flex:1; min-height:47px; padding:12px 16px; border:1px solid rgb(255 255 255 / 16%); border-radius:99px; background:rgb(255 255 255 / 3%); color:#d7ddd4; box-shadow:none }.deck-landing .platform-download.card.recommended { background:#fff; color:#101310; border-color:#fff }.deck-landing .platform-title { font:600 13px/1.2 var(--a-font-display) }.deck-landing .platform-title::after { content:'↓'; margin-left:auto; font-size:17px }.deck-landing .platform-download .download-link,.deck-landing .platform-download .platform-meta,.deck-landing .platform-download .recommend-badge { display:none }.deck-landing .platform-download.recommended .platform-icon { filter:brightness(0) }
.deck-landing .hero-command { margin:0; max-width:none; width:100%; min-height:45px; border-radius:12px; background:rgb(255 255 255 / 3%); border-color:rgb(255 255 255 / 11%); padding:5px 5px 5px 15px; gap:10px }.deck-landing .hero-command code { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11px }.deck-landing .hero-command button { border-radius:9px; width:34px; min-height:32px }.deck-landing .plat { margin:0; font-size:11px }.deck-landing .agent-line { margin:clamp(1.4rem,3vh,1.9rem) 0 0; gap:18px; font:10px var(--a-font-display) }.deck-landing .agent-line img { width:18px; height:18px; filter:grayscale(1) brightness(1.5); opacity:.6 }.deck-landing .agent-line > span:hover img { filter:none; opacity:1 }.deck-landing .agent-line i { font-size:10px }
.deck-landing .hero-stage { padding:0 0 clamp(3rem,7vh,4.5rem) }.deck-landing .hero-desk { width:100%; max-width:1088px }.deck-landing .hero-preview { width:100%; margin:0; position:relative; z-index:1; border-color:rgb(255 255 255 / 18%); border-radius:11px; box-shadow:inset 0 1px 0 rgb(255 255 255 / 10%),0 0 3.5rem .4rem rgb(217 189 115 / 26%),0 0 1.2rem rgb(217 189 115 / 14%) }
.deck-landing .feature-switch { padding:9px; background:#141714 }.deck-landing .feature-switch button { font-size:10px; padding:8px 12px }.deck-landing .feature-switch button[aria-pressed="true"] { background:#313630; border-color:#50564c; color:#fff }
.deck-landing .chapter h2 { font-size:clamp(38px,4vw,52px); font-weight:500; letter-spacing:-.045em }.deck-landing .feature-stage { padding:34px 0 50px; gap:60px }.deck-landing section { padding:64px 0 }.deck-landing .feature-copy h3 { font-size:36px; font-weight:500; letter-spacing:-.035em }.deck-landing .feature-copy p { line-height:1.8 }
@media(max-width:760px) { .deck-landing .wrap,.site-page .wrap { padding:0 17px; width:calc(100% - 24px) }.deck-landing nav,.site-page nav { gap:13px; padding:14px 0; flex-wrap:wrap }.deck-landing .hero-copy { padding:2.15rem 0 1.9rem }.deck-landing .hero-copy .hero-title { font-size:clamp(35px,7.5vw,52px) }.deck-landing .hero-stage { padding-bottom:48px }.deck-landing .hero-desk { padding-top:2.75rem }.deck-landing .platform-download.card { padding:11px 12px; min-height:45px }.deck-landing .platform-title { font-size:11px }.deck-landing .hero-command code { font-size:10px }.deck-landing .agent-line { gap:13px }.deck-landing .locale-switch,.site-page .locale-switch { margin-left:auto }.site-page nav .brand { width:auto; margin-right:auto }.deck-landing .feature-copy h3 { font-size:29px } }

/* Current Watch section: released workspace structure and original Office artwork. */
.deck-landing .watch-intro{display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:60px;margin:30px 0}.deck-landing .watch-intro .kicker{font:10px var(--mono);letter-spacing:.12em;color:#a8ba96}.deck-landing .watch-intro h3{font-size:38px;letter-spacing:-.04em;line-height:1.2;font-weight:500;margin:14px 0 0}.deck-landing .watch-intro>p{font-size:14px;line-height:1.85;color:var(--dim);margin:0}.deck-landing .watch-office{margin:30px 0;border:1px solid #444e3a;border-radius:12px;overflow:hidden;background:#171c14}.deck-landing .watch-image-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 18px;font:11px var(--sans);color:#d8e2cc;border-bottom:1px solid #35422e}.deck-landing .watch-image-bar>span:first-child{display:flex;align-items:center;gap:8px;font-weight:600}.deck-landing .watch-image-bar>span+span{font-size:10px;color:#a1ac95}.deck-landing .watch-image-bar i{width:6px;height:6px;border-radius:50%;background:#bdcea9}.deck-landing .watch-office img,.deck-landing .feature-office>img{display:block;width:100%;height:auto}.deck-landing .watch-office figcaption,.deck-landing .office-preview-note{font-size:11px;line-height:1.7;color:#a8b39d;padding:13px 18px;margin:0;border-top:1px solid #35422e}.deck-landing .watch-workspace{gap:50px;padding-top:30px}.deck-landing .watch-tree{padding:18px;border:1px solid #3b4434;background:#181c16;border-radius:12px}.deck-landing .watch-tree-top{display:flex;justify-content:space-between;align-items:center;padding-bottom:18px;gap:12px}.deck-landing .watch-tree-top b{font:10px var(--mono);letter-spacing:.12em;color:#b7c4a9}.deck-landing .watch-tree-top>span{font-size:10px;color:#a3ac99}.deck-landing .watch-project,.deck-landing .watch-branch{display:flex;align-items:center;gap:9px;font-size:12px;min-height:32px}.deck-landing .watch-tree svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}.deck-landing .watch-project svg{color:#a6c6b5}.deck-landing .watch-project b{font-weight:600}.deck-landing .watch-count{margin-left:auto;font-size:10px;color:#e1c786}.deck-landing .watch-branch{padding-left:18px;color:#a9b39e;font-family:var(--mono);font-size:10px;margin-top:7px}.deck-landing .watch-branch>span{font:9px var(--sans);padding:2px 5px;border:1px solid #4d5744;border-radius:4px;color:#b7c2aa}.deck-landing .watch-session{display:flex;align-items:center;gap:11px;margin:5px 0 5px 26px;padding:12px;border-radius:7px;border:1px solid transparent}.deck-landing .watch-session>img{width:23px;height:23px;object-fit:contain;flex:none}.deck-landing .watch-session>div{flex:1;min-width:0}.deck-landing .watch-session b{display:block;font-size:12px;font-weight:550;color:#e0e6d7}.deck-landing .watch-session small{display:block;font-size:10px;line-height:1.5;color:#a4af99;margin-top:4px}.deck-landing .watch-session.needs-attention{border-color:#77683d;background:#302c1e}.deck-landing .watch-number{display:flex;align-items:center;justify-content:center;background:#d9c68c;color:#302917;border-radius:5px;min-width:19px;height:19px;font-size:10px;font-weight:700}.deck-landing .watch-status{width:6px;height:6px;border-radius:50%;background:#859078;flex:none}.deck-landing .watch-status.is-working{background:#bad493}.deck-landing .watch-tree-foot{margin-top:16px;padding-top:14px;border-top:1px solid #333e2b;color:#a4b097;font-size:10px;line-height:1.7}
@media(max-width:700px){.deck-landing .watch-intro{grid-template-columns:1fr;gap:18px}.deck-landing .watch-intro h3{font-size:30px}.deck-landing .watch-workspace{grid-template-columns:1fr;gap:25px}.deck-landing .watch-tree{padding:14px}.deck-landing .watch-session{margin-left:14px}.deck-landing .watch-image-bar{padding:11px 13px}.deck-landing .watch-image-bar>span+span{font-size:9px}.deck-landing .watch-office figcaption{padding:11px 13px;font-size:10px}}
