.guide{padding-top:120px}.guide-hero{padding:60px 0 80px;position:relative;overflow:hidden}.guide-hero .container{position:relative;z-index:2}.guide-meta{display:flex;gap:32px;flex-wrap:wrap;padding-top:28px;margin-top:32px;border-top:1px solid var(--line);color:var(--ink-2);font-size:13.5px}.guide-meta .k{color:var(--ink-3);font-family:JetBrains Mono,monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;display:block;margin-bottom:4px}.guide-meta .v{color:var(--ink-0);font-size:15px}.gs{padding:80px 0;border-top:1px solid var(--line)}.gs-head{display:grid;grid-template-columns:220px 1fr;gap:48px;margin-bottom:48px;align-items:start}@media (max-width: 900px){.gs-head{grid-template-columns:1fr;gap:16px}}.gs-head .index{font-family:JetBrains Mono,monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3)}.gs-head h2{margin:0;font-size:clamp(28px,3.4vw,44px);letter-spacing:-.025em;line-height:1.05;font-weight:500}.gs-head .desc{margin-top:14px;color:var(--ink-2);font-size:15px;line-height:1.55;max-width:60ch}.frame{border:1px solid var(--line);border-radius:var(--radius-md);overflow:hidden;background:var(--feature-bg);position:relative}.frame .frame-caption{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-top:1px solid var(--line);background:var(--bg-0);color:var(--ink-2);font-family:JetBrains Mono,monospace;font-size:11px;letter-spacing:.06em}.frame .frame-caption .label-pill{display:inline-flex;align-items:center;gap:6px;padding:3px 8px;border-radius:999px;background:#7f7f7f14;border:1px solid var(--line);color:var(--ink-2)}.bg-tile{display:grid;place-items:center;min-height:280px;padding:40px;position:relative;overflow:hidden}.bg-tile.dark{background:#07080b}.bg-tile.light{background:#f6f3ec}.bg-tile.gradient{background:radial-gradient(circle at 30% 30%,rgba(124,215,224,.45),transparent 55%),radial-gradient(circle at 70% 70%,rgba(183,166,240,.45),transparent 55%),#0b0d12}.bg-tile.warm{background:linear-gradient(135deg,#2a1f10,#110a06)}.bg-tile.cool{background:linear-gradient(135deg,#0d2a35,#07141a)}.logo-system{display:grid;grid-template-columns:1.4fr 1fr;gap:16px}@media (max-width: 900px){.logo-system{grid-template-columns:1fr}}.logo-system .sub{display:grid;grid-template-columns:1fr 1fr;gap:16px}@media (max-width: 600px){.logo-system .sub{grid-template-columns:1fr}}.construction{display:grid;grid-template-columns:1.2fr 1fr;gap:16px}@media (max-width: 900px){.construction{grid-template-columns:1fr}}.palette{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}@media (max-width: 900px){.palette{grid-template-columns:repeat(2,1fr)}}.swatch{border-radius:var(--radius-md);overflow:hidden;border:1px solid var(--line);background:var(--feature-bg)}.swatch .chip{height:140px;display:flex;align-items:flex-end;padding:14px 16px;font-family:JetBrains Mono,monospace;font-size:10.5px;letter-spacing:.08em}.swatch .meta{padding:14px 16px 16px;border-top:1px solid var(--line)}.swatch .meta .name{font-size:14px;letter-spacing:-.01em;color:var(--ink-0);margin-bottom:4px}.swatch .meta .hex{font-family:JetBrains Mono,monospace;font-size:11px;color:var(--ink-2);letter-spacing:.04em}.swatch .meta .token{font-family:JetBrains Mono,monospace;font-size:10.5px;color:var(--ink-3);letter-spacing:.02em;margin-top:6px}.specimen{border:1px solid var(--line);border-radius:var(--radius-md);padding:28px 32px;background:var(--feature-bg);display:grid;grid-template-columns:200px 1fr;gap:28px;align-items:center}@media (max-width: 700px){.specimen{grid-template-columns:1fr;gap:14px;padding:22px 24px}}.specimen .spec-meta{color:var(--ink-3);font-family:JetBrains Mono,monospace;font-size:11px;line-height:1.6;letter-spacing:.04em}.specimen .spec-meta strong{color:var(--ink-0);font-weight:500;font-family:Geist,sans-serif;font-size:14px;letter-spacing:-.01em;display:block;margin-bottom:6px}.specimen .spec-sample{color:var(--ink-0);line-height:1.05;letter-spacing:-.025em}.specimen.body .spec-sample{line-height:1.45;letter-spacing:-.005em}.specimen.mono .spec-sample{font-family:JetBrains Mono,monospace;letter-spacing:0}.specimen.serif .spec-sample{font-family:"Instrument Serif",serif;font-style:italic;letter-spacing:-.01em}.type-scale{border:1px solid var(--line);border-radius:var(--radius-md);overflow:hidden}.type-scale-row{display:grid;grid-template-columns:110px 1fr 120px;gap:24px;padding:18px 24px;border-top:1px solid var(--line);align-items:baseline;background:var(--feature-bg)}.type-scale-row:first-child{border-top:none}.type-scale-row .lbl{font-family:JetBrains Mono,monospace;font-size:10.5px;color:var(--ink-3);letter-spacing:.1em;text-transform:uppercase}.type-scale-row .px{font-family:JetBrains Mono,monospace;font-size:11px;color:var(--ink-2);text-align:right}.type-scale-row .sample{color:var(--ink-0);letter-spacing:-.025em;line-height:1}.spacing-row{display:grid;grid-template-columns:60px 1fr 80px;gap:20px;padding:14px 0;align-items:center;border-top:1px solid var(--line)}.spacing-row:first-child{border-top:none}.spacing-row .bar{height:18px;background:linear-gradient(90deg,var(--cyan),transparent);border-radius:4px;opacity:.7}.spacing-row .lbl{font-family:JetBrains Mono,monospace;font-size:11px;color:var(--ink-3);letter-spacing:.1em;text-transform:uppercase}.spacing-row .px{font-family:JetBrains Mono,monospace;font-size:12px;color:var(--ink-2);text-align:right}.radius-ladder{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}@media (max-width: 700px){.radius-ladder{grid-template-columns:repeat(2,1fr)}}.radius-card{aspect-ratio:1;background:linear-gradient(135deg,var(--cyan) 0%,var(--violet) 100%);display:grid;place-items:center;color:#07080b;font-family:JetBrains Mono,monospace;font-size:11px;letter-spacing:.1em;font-weight:500;text-transform:uppercase;border:1px solid var(--line);opacity:.9}.icon-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius-md);overflow:hidden}@media (max-width: 900px){.icon-grid{grid-template-columns:repeat(4,1fr)}}.icon-cell{background:var(--feature-bg);aspect-ratio:1;display:grid;place-items:center;color:var(--ink-1);position:relative;transition:background .2s ease,color .2s ease}.icon-cell:hover{background:var(--feature-bg-hover);color:var(--ink-0)}.icon-cell .label{position:absolute;bottom:8px;left:0;right:0;text-align:center;font-family:JetBrains Mono,monospace;font-size:9px;letter-spacing:.1em;color:var(--ink-3);text-transform:uppercase}.voice-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}@media (max-width: 900px){.voice-grid{grid-template-columns:1fr}}.voice-card{border:1px solid var(--line);border-radius:var(--radius-md);padding:28px;background:var(--feature-bg)}.voice-card .head{display:flex;align-items:center;gap:10px;margin-bottom:18px;font-family:JetBrains Mono,monospace;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase}.voice-card.do .head{color:var(--cyan)}.voice-card.dont .head{color:#d97a6a}.voice-card .head .pill{width:8px;height:8px;border-radius:50%}.voice-card.do .pill{background:var(--cyan)}.voice-card.dont .pill{background:#d97a6a}.voice-card p{margin:0 0 14px;font-size:16px;line-height:1.5;color:var(--ink-1);padding-left:16px;border-left:2px solid var(--line-strong)}.voice-card.do p{border-left-color:var(--cyan)}.voice-card.dont p{border-left-color:#d97a6a;color:var(--ink-2)}.voice-card p:last-child{margin-bottom:0}.comp-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}@media (max-width: 900px){.comp-grid{grid-template-columns:1fr}}.comp-frame{border:1px solid var(--line);border-radius:var(--radius-md);padding:36px;background:var(--feature-bg);display:flex;flex-direction:column;gap:18px;min-height:240px;align-items:flex-start;justify-content:center}.comp-frame .head{font-family:JetBrains Mono,monospace;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);margin-bottom:4px}.mark-construction{position:relative;width:240px;height:240px;margin:0 auto}.mark-construction .grid-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(to right,rgba(127,127,127,.18) 1px,transparent 1px),linear-gradient(to bottom,rgba(127,127,127,.18) 1px,transparent 1px);background-size:30px 30px;pointer-events:none}.mark-construction .ring{position:absolute;top:30px;right:30px;bottom:30px;left:30px;border:1px dashed rgba(127,127,127,.4);border-radius:50%}.mark-construction .axis-h,.mark-construction .axis-v{position:absolute;background:#7f7f7f4d}.mark-construction .axis-h{left:0;right:0;top:50%;height:1px}.mark-construction .axis-v{top:0;bottom:0;left:50%;width:1px}.mark-construction .big-mark{position:absolute;top:40px;right:40px;bottom:40px;left:40px}.mark-construction .annot{position:absolute;font-family:JetBrains Mono,monospace;font-size:9.5px;color:var(--ink-3);letter-spacing:.08em}.big-logo{display:flex;align-items:center;gap:18px}.big-logo .word{font-size:clamp(32px,4vw,52px);letter-spacing:-.03em;font-weight:500;line-height:1}.big-logo .word .serif{font-size:1em}.logo-mono{font-size:clamp(32px,4vw,52px);letter-spacing:-.03em;font-weight:500;line-height:1}.dh-mark-xl{display:inline-block;width:100%;height:100%;border-radius:18%;position:relative;overflow:hidden;background:radial-gradient(circle at 30% 30%,#7CD7E0 0%,transparent 50%),radial-gradient(circle at 75% 70%,#B7A6F0 0%,transparent 55%),linear-gradient(135deg,#1a2230,#0a0c12);border:1px solid rgba(244,239,231,.16)}.dh-mark-xl:after{content:"";position:absolute;top:16%;right:16%;bottom:16%;left:16%;border-radius:12%;border:1.2px solid rgba(244,239,231,.22)}.dh-mark-xl.mono-dark{background:#0a0c12}.dh-mark-xl.mono-dark:before{content:"";position:absolute;top:22%;right:22%;bottom:22%;left:22%;border-radius:50%;background:#f4efe7}.dh-mark-xl.mono-dark:after{content:"";position:absolute;top:36%;right:36%;bottom:36%;left:36%;border-radius:50%;background:#0a0c12;border:none}.dh-mark-xl.mono-light{background:#f4efe7}.dh-mark-xl.mono-light:before{content:"";position:absolute;top:22%;right:22%;bottom:22%;left:22%;border-radius:50%;background:#0a0c12}.dh-mark-xl.mono-light:after{content:"";position:absolute;top:36%;right:36%;bottom:36%;left:36%;border-radius:50%;background:#f4efe7;border:none}.rule-list{display:grid;grid-template-columns:1fr 1fr;gap:16px}@media (max-width: 700px){.rule-list{grid-template-columns:1fr}}.rule-item{padding:16px 18px;border:1px solid var(--line);border-radius:12px;background:var(--feature-bg);display:flex;gap:12px;align-items:start;font-size:14px;line-height:1.5;color:var(--ink-1)}.rule-item .ic{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;flex-shrink:0;font-family:JetBrains Mono,monospace;font-size:12px;font-weight:500;margin-top:1px}.rule-item.do .ic{background:#7cd7e029;color:var(--cyan);border:1px solid rgba(124,215,224,.3)}.rule-item.dont .ic{background:#d97a6a29;color:#d97a6a;border:1px solid rgba(217,122,106,.3)}.motion-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}@media (max-width: 800px){.motion-grid{grid-template-columns:1fr}}.motion-card{position:relative;padding:28px;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--feature-bg);min-height:240px;display:flex;flex-direction:column;justify-content:space-between;gap:22px;overflow:hidden}.motion-card h4{margin:0;font-size:17px;letter-spacing:-.01em;font-weight:500}.motion-card p{margin:4px 0 0;color:var(--ink-2);font-size:13.5px;line-height:1.55}.motion-visual{height:80px;position:relative}.imagery{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}@media (max-width: 900px){.imagery{grid-template-columns:repeat(2,1fr)}}.img-tile{aspect-ratio:4/5;border-radius:var(--radius-md);border:1px solid var(--line);position:relative;overflow:hidden}.img-tile .img-label{position:absolute;bottom:14px;left:16px;font-family:JetBrains Mono,monospace;font-size:10px;color:#f4efe7d9;letter-spacing:.12em;text-transform:uppercase}.img-tile.a{background:linear-gradient(135deg,#0d2a35,#07141a)}.img-tile.b{background:linear-gradient(135deg,#1a1530,#0a0813)}.img-tile.c{background:linear-gradient(135deg,#2a1f10,#110a06)}.img-tile.d{background:linear-gradient(135deg,#1f1428,#0a0810)}@keyframes drift-x{0%,to{left:10%}50%{left:calc(90% - 10px)}}@keyframes float-y{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@media (prefers-reduced-motion: reduce){.motion-visual *{animation:none!important}}
