:root {
  --ink: #f3f4f5;
  --muted: #9ca3aa;
  --dim: #666e76;
  --bg: #07090b;
  --panel: #0b0e11;
  --line: rgba(255, 255, 255, 0.14);
  --line-strong: rgba(255, 255, 255, 0.28);
  --red: #e2231a;
  --red-bright: #ff3329;
  --cyan: #74d8e7;
  --shell: min(1240px, calc(100vw - 40px));
  --header: 76px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body { margin: 0; color: var(--ink); background: var(--bg); font-family: "Noto Sans Thai", system-ui, sans-serif; font-size: 16px; line-height: 1.7; overflow-x: hidden; }
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
img, canvas { display: block; max-width: 100%; }
button { font: inherit; }
::selection { background: var(--red); color: white; }
.shell { width: var(--shell); margin-inline: auto; }
.skip-link { position: fixed; left: 12px; top: 12px; z-index: 1000; padding: 10px 16px; background: white; color: #111; transform: translateY(-160%); }
.skip-link:focus { transform: none; }
.micro, .hero-context, .film-family, .section-index small { font-family: Manrope, sans-serif; letter-spacing: .22em; font-size: .68rem; line-height: 1.5; }
.section { position: relative; padding: clamp(92px, 11vw, 164px) 0; border-top: 1px solid var(--line); }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-weight: 500; line-height: 1.16; letter-spacing: -.035em; }
h2 { margin-bottom: 0; font-size: clamp(2.2rem, 5.5vw, 5rem); }
h3 { font-size: clamp(1.3rem, 2vw, 1.9rem); }
p { color: var(--muted); }

.site-header { position: fixed; inset: 0 0 auto; z-index: 100; height: var(--header); border-bottom: 1px solid transparent; transition: background .3s, border-color .3s, transform .3s; }
.site-header.is-scrolled { background: rgba(7, 9, 11, .86); border-color: var(--line); backdrop-filter: blur(18px); }
.nav-row { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { display: inline-flex; align-items: center; gap: 11px; min-width: max-content; }
.brand img { width: 38px; height: 38px; object-fit: contain; }
.brand span { display: grid; line-height: 1; }
.brand strong { font: 700 1.25rem/1 Manrope, sans-serif; letter-spacing: .12em; }
.brand small { margin-top: 5px; color: var(--muted); font: 500 .48rem/1 Manrope, sans-serif; letter-spacing: .16em; }
.site-menu { display: flex; align-items: center; gap: clamp(18px, 2.4vw, 36px); font-size: .88rem; }
.site-menu a { color: #bdc2c7; transition: color .2s; }
.site-menu a:hover, .site-menu a:focus-visible { color: white; }
.site-menu .nav-cta { padding: 9px 0; color: white; border-bottom: 1px solid var(--red); }
.menu-toggle { display: none; width: 44px; height: 44px; border: 0; background: transparent; color: white; }
.menu-toggle span { display: block; width: 22px; height: 1px; margin: 7px auto; background: currentColor; transition: transform .2s; }

.hero { position: relative; min-height: 100svh; display: grid; align-items: center; overflow: clip; isolation: isolate; padding: calc(var(--header) + 52px) 0 84px; }
#certifiedCanvas { position: absolute; inset: 0; z-index: -3; width: 100%; height: 100%; pointer-events: none; opacity: 0; transition: opacity 1s; }
#certifiedCanvas.is-ready { opacity: .75; }
#certifiedCanvas.is-failed { display: none; }
.hero::before { content: ""; position: absolute; inset: 0; z-index: -2; background: radial-gradient(circle at 76% 48%, rgba(58, 102, 111, .16), transparent 32%), linear-gradient(90deg, rgba(7,9,11,.98) 0 35%, rgba(7,9,11,.72) 57%, rgba(7,9,11,.25)); }
.hero-grid { position: absolute; inset: 0; z-index: -1; opacity: .28; background-image: linear-gradient(rgba(116,216,231,.10) 1px, transparent 1px), linear-gradient(90deg, rgba(116,216,231,.10) 1px, transparent 1px); background-size: 72px 72px; mask-image: linear-gradient(90deg, transparent 30%, #000 85%); }
.hero-layout { display: grid; grid-template-columns: minmax(0, .9fr) minmax(430px, 1.1fr); align-items: center; gap: 3vw; }
.hero-copy { position: relative; z-index: 2; max-width: 750px; }
.hero-context { margin-bottom: 26px; color: #c6cbd0; }
.hero-context::before { content: ""; display: inline-block; width: 38px; height: 1px; margin: 0 13px 3px 0; background: var(--red); }
.hero h1 { margin-bottom: 30px; font-size: clamp(3.3rem, 7vw, 7.3rem); line-height: .98; }
.hero h1 em { color: var(--red-bright); font-style: normal; white-space: nowrap; }
.hero-lead { max-width: 620px; font-size: clamp(1.05rem, 1.6vw, 1.35rem); color: #c2c6ca; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 38px; }
.button { display: inline-flex; min-height: 54px; align-items: center; justify-content: space-between; gap: 30px; padding: 0 24px; border: 1px solid var(--line-strong); font-weight: 600; transition: transform .2s, background .2s, border-color .2s; }
.button:hover { transform: translateY(-2px); }
.button-primary { min-width: 216px; background: var(--red); border-color: var(--red); }
.button-primary:hover { background: var(--red-bright); }
.button-quiet:hover { border-color: white; }
.hero-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; max-width: 700px; margin: 58px 0 0; border-top: 1px solid var(--line); }
.hero-facts div { padding: 17px 16px 0 0; }
.hero-facts dt { color: var(--dim); font-size: .72rem; }
.hero-facts dd { margin: 1px 0 0; color: #dce0e3; font-size: .83rem; }
.hero-visual { position: relative; min-height: 630px; perspective: 1000px; }
.window-stack { position: absolute; width: 430px; height: 270px; left: 50%; top: 46%; transform: translate(-50%, -50%) rotateX(2deg) rotateY(-20deg) rotateZ(-3deg); transform-style: preserve-3d; }
.glass-layer { position: absolute; inset: 0; border: 1px solid rgba(174, 226, 234, .52); clip-path: polygon(11% 0, 88% 5%, 100% 86%, 5% 100%, 0 13%); background: linear-gradient(125deg, rgba(207,241,245,.03), rgba(116,216,231,.11) 55%, rgba(255,255,255,.02)); box-shadow: inset 0 0 35px rgba(116,216,231,.06); }
.glass-1 { transform: translateZ(-75px) translate(-52px, -24px); opacity: .35; }
.glass-2 { transform: translateZ(-35px) translate(-25px, -12px); opacity: .6; }
.glass-3 { transform: translateZ(0); }
.scan-line { position: absolute; left: -10%; right: -10%; top: 42%; height: 1px; background: var(--red-bright); box-shadow: 0 0 18px rgba(255,51,41,.75); animation: scan 4.5s ease-in-out infinite; }
@keyframes scan { 0%,100%{ transform: translateY(-90px); opacity:.2 } 50%{ transform: translateY(100px); opacity:1 } }
.visual-note { position: absolute; right: 0; top: 25%; color: #737b82; font: 500 .58rem/1.8 Manrope, sans-serif; letter-spacing: .18em; }
.visual-note span { color: var(--red); margin-right: 8px; }
.scroll-cue { position: absolute; left: max(20px, calc((100vw - 1240px) / 2)); bottom: 28px; display: flex; align-items: center; gap: 15px; color: #737a81; font: 500 .56rem/1 Manrope, sans-serif; letter-spacing: .18em; }
.scroll-cue i { display: block; width: 58px; height: 1px; background: var(--line-strong); overflow: hidden; }
.scroll-cue i::after { content:""; display:block; width:50%; height:100%; background: var(--red); animation: cue 2s infinite; }
@keyframes cue { from{ transform:translateX(-110%) } to{ transform:translateX(210%) } }

.section-index { display: flex; align-items: center; gap: 12px; color: var(--muted); }
.section-index span { color: var(--red); font: 600 .72rem/1 Manrope, sans-serif; }
.section-index::after { content:""; width: 46px; height: 1px; background: var(--red); order: 1; }
.section-index small { order: 2; }
.intro { background: #090c0e; }
.intro-grid { display: grid; grid-template-columns: 150px minmax(0, 1.35fr) minmax(300px, .65fr); gap: 5vw; align-items: start; }
.intro h2 { font-size: clamp(2.25rem, 4.8vw, 4.7rem); }
.intro-copy { padding-top: 4px; }
.intro-copy p { margin-bottom: 25px; }

.film-section { background: linear-gradient(180deg, #07090b, #0b0e11 45%, #07090b); overflow: clip; }
.section-heading { display: grid; grid-template-columns: 150px 1fr; gap: 5vw; align-items: start; margin-bottom: 72px; }
.section-heading > div:last-child { max-width: 900px; }
.section-heading p { max-width: 620px; margin: 24px 0 0; }
.film-rail { border-top: 1px solid var(--line); }
.film-item { display: grid; grid-template-columns: minmax(320px, .75fr) minmax(0, 1.25fr); gap: clamp(32px, 7vw, 100px); padding: 62px 0; border-bottom: 1px solid var(--line); }
.film-swatch { position: relative; min-height: 330px; overflow: hidden; border: 1px solid var(--line); background: #0b0f12; perspective: 700px; }
.film-swatch::before { content:""; position:absolute; inset:12% 10%; border: 1px solid rgba(171,224,232,.55); transform: rotateY(-25deg) rotateX(8deg) rotateZ(-2deg); background: linear-gradient(135deg, rgba(255,255,255,.1), transparent 32%, rgba(116,216,231,.11)); box-shadow: 0 26px 65px rgba(0,0,0,.55); }
.film-swatch::after { content:""; position:absolute; width:140%; height:1px; left:-20%; top:53%; background:var(--red); opacity:.8; transform:rotate(-8deg); }
.film-swatch span { position:absolute; left:18px; top:15px; z-index:2; color:#697179; font:600 .66rem Manrope,sans-serif; }
.film-swatch i { position:absolute; inset:0; background: radial-gradient(circle at 68% 28%, rgba(116,216,231,.17), transparent 31%); }
.swatch-ultra::before { background: linear-gradient(135deg, rgba(255,255,255,.15), rgba(90,151,162,.08) 55%, rgba(255,255,255,.02)); }
.swatch-absolute::before { background: linear-gradient(135deg, rgba(255,255,255,.07), rgba(7,10,13,.7) 45%, rgba(8,18,23,.88)); }
.film-copy { align-self: center; }
.film-family { margin: 0 0 10px; color: var(--red); }
.film-copy h3 { margin-bottom: 18px; font-size: clamp(2rem, 4vw, 4rem); }
.film-copy > p:not(.film-family) { max-width: 690px; font-size: 1.02rem; }
.film-copy dl { margin: 28px 0; border-top: 1px solid var(--line); }
.film-copy dl div { display:grid; grid-template-columns:110px 1fr; gap:20px; padding:10px 0; border-bottom:1px solid var(--line); }
.film-copy dt { color: var(--dim); }
.film-copy dd { margin:0; color:#c7ccd0; }
.film-copy a { display:inline-flex; align-items:center; gap:18px; padding-bottom:5px; border-bottom:1px solid var(--red); font-size:.9rem; }
.film-copy a span { color:var(--red); }
.data-note { max-width: 900px; margin: 34px 0 0 0; color:#707880; font-size:.82rem; }
.source-links { max-width:900px; margin:10px 0 0; color:#626a71; font-size:.75rem; }
.source-links a { color:#9ca3aa; text-decoration:underline; text-decoration-color:rgba(255,255,255,.25); text-underline-offset:3px; }

.craft { background: #090b0d; }
.craft-heading { margin-bottom: 58px; }
.edge-comparison { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.photo-slot { margin:0; }
.slot-frame { position:relative; aspect-ratio:16/10; display:grid; place-content:center; justify-items:center; overflow:hidden; border:1px solid var(--line-strong); background: repeating-linear-gradient(135deg, transparent 0 17px, rgba(255,255,255,.018) 17px 18px), #0d1013; color:#737a80; }
.slot-frame::before { content:""; position:absolute; inset:11%; border:1px dashed rgba(255,255,255,.13); }
.slot-frame span { position:absolute; left:17px; top:13px; color:var(--red); font:600 .62rem Manrope,sans-serif; letter-spacing:.14em; }
.slot-frame strong { color:#b6bcc1; font-size:clamp(1rem,2vw,1.4rem); font-weight:500; }
.slot-frame small { color:#656c72; font:500 .58rem Manrope,sans-serif; letter-spacing:.12em; }
.slot-frame i { position:absolute; top:-20%; width:2px; height:140%; background:var(--red); transform:rotate(38deg); opacity:.65; }
.photo-slot-other .slot-frame i { left:24%; }
.photo-slot-gfix .slot-frame i { left:12%; }
.photo-slot figcaption { display:flex; align-items:baseline; gap:16px; padding:18px 2px 0; color:#cfd3d6; }
.photo-slot figcaption span { color:#687078; font:600 .6rem Manrope,sans-serif; letter-spacing:.18em; }
.photo-slot-gfix figcaption span { color:var(--red); }
.craft-points { margin-top:80px; border-top:1px solid var(--line); }
.craft-points article { display:grid; grid-template-columns:130px minmax(0,1fr); gap:4vw; padding:42px 0; border-bottom:1px solid var(--line); }
.point-no { color:var(--red); font:500 1rem Manrope,sans-serif; }
.craft-points article > div { display:grid; grid-template-columns:minmax(220px,.5fr) minmax(0,1fr); gap:6vw; }
.craft-points h3 { margin:0; }
.craft-points p { max-width:700px; margin:0; }

.process { min-height: 100vh; overflow: clip; background: radial-gradient(circle at 88% 26%, rgba(45,96,104,.13), transparent 30%), #07090b; }
.process-scene { position:absolute; inset:0; pointer-events:none; opacity:.55; }
.orbit { position:absolute; right:-10vw; top:18%; width:52vw; aspect-ratio:1; border:1px solid rgba(116,216,231,.12); border-radius:50%; transform:rotateX(70deg) rotateZ(-20deg); }
.orbit-b { width:37vw; right:-3vw; top:25%; border-color:rgba(226,35,26,.15); }
.process-window { position:absolute; right:4%; top:13%; width:32vw; height:36vw; max-height:520px; border:1px solid rgba(116,216,231,.14); clip-path:polygon(12% 0,92% 5%,100% 90%,4% 100%,0 14%); transform:rotate(-8deg); background:linear-gradient(135deg,rgba(255,255,255,.025),transparent); }
.process-list { position:relative; max-width:920px; margin:0; padding:0; list-style:none; border-top:1px solid var(--line); }
.process-list li { display:grid; grid-template-columns:100px 1fr; gap:30px; padding:32px 0; border-bottom:1px solid var(--line); }
.process-list > li > span { color:var(--red); font:500 .74rem Manrope,sans-serif; }
.process-list h3 { margin-bottom:7px; }
.process-list p { margin:0; max-width:650px; }
.trust-panel { position:relative; display:grid; grid-template-columns:minmax(220px,.7fr) minmax(0,1.3fr); gap:clamp(30px,6vw,90px); margin-top:100px; padding:40px; border:1px solid var(--line); background:rgba(12,15,18,.85); }
.trust-panel figure { margin:0; }
.trust-panel img { width:100%; height:auto; filter:saturate(.75) contrast(1.05); }
.trust-panel figcaption { margin-top:10px; color:#737b82; font-size:.75rem; }
.trust-panel .micro { color:var(--red); }
.trust-panel h3 { font-size:clamp(1.7rem,3vw,2.7rem); }
.trust-panel ul { margin:0; padding:0; list-style:none; }
.trust-panel li { position:relative; padding:9px 0 9px 25px; color:#b9bfc4; border-bottom:1px solid var(--line); }
.trust-panel li::before { content:""; position:absolute; left:0; top:20px; width:9px; height:1px; background:var(--red); }

.faq { background:#0a0d0f; }
.faq-grid { display:grid; grid-template-columns:minmax(270px,.7fr) minmax(0,1.3fr); gap:8vw; }
.faq-grid h2 { margin-top:25px; font-size:clamp(2.6rem,5vw,4.9rem); }
.faq-grid > div:first-child > p { max-width:400px; margin-top:24px; }
.faq-list { border-top:1px solid var(--line); }
.faq details { border-bottom:1px solid var(--line); }
.faq summary { position:relative; padding:24px 46px 24px 0; list-style:none; cursor:pointer; color:#dce0e3; font-size:1.08rem; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary span::before, .faq summary span::after { content:""; position:absolute; right:2px; top:34px; width:15px; height:1px; background:#a9afb4; transition:transform .2s; }
.faq summary span::after { transform:rotate(90deg); }
.faq details[open] summary span::after { transform:rotate(0); }
.faq details p { margin:0; padding:0 46px 25px 0; max-width:720px; }

.contact { overflow:hidden; background:#080a0c; }
.contact-lines { position:absolute; inset:0; opacity:.22; background:linear-gradient(110deg,transparent 0 52%,var(--red) 52% calc(52% + 1px),transparent calc(52% + 1px)),linear-gradient(72deg,transparent 0 70%,rgba(116,216,231,.3) 70% calc(70% + 1px),transparent calc(70% + 1px)); }
.contact-grid { position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(360px,.72fr); gap:9vw; align-items:end; }
.contact .micro { color:var(--red); }
.contact h2 { margin:20px 0 30px; }
.contact-grid > div:first-child > p:last-child { max-width:650px; }
.contact-actions { border-top:1px solid var(--line); }
.contact-actions a { display:grid; grid-template-columns:120px 1fr auto; gap:20px; align-items:center; padding:22px 0; border-bottom:1px solid var(--line); }
.contact-actions span { color:#697178; font-size:.7rem; }
.contact-actions strong { font-size:1.05rem; font-weight:500; }
.contact-actions i { color:var(--red); font-style:normal; transition:transform .2s; }
.contact-actions a:hover i { transform:translate(3px,-3px); }

.related { background:#0a0c0f; }
.related-links { display:grid; grid-template-columns:1fr 1fr; border-top:1px solid var(--line); }
.related-links a { display:grid; grid-template-columns:46px 1fr; gap:10px 18px; padding:30px 28px 30px 0; border-bottom:1px solid var(--line); }
.related-links a:nth-child(odd) { border-right:1px solid var(--line); }
.related-links a:nth-child(even) { padding-left:28px; }
.related-links span { grid-row:1/3; color:var(--red); font:500 .66rem Manrope,sans-serif; }
.related-links strong { font-size:1.15rem; font-weight:500; }
.related-links i { color:#737b82; font-style:normal; font-size:.78rem; }

.site-footer { padding:64px 0 110px; border-top:1px solid var(--line); background:#060708; }
.footer-grid { display:grid; grid-template-columns:1fr auto; gap:50px; align-items:start; }
.footer-grid p { max-width:480px; margin:24px 0 0; font-size:.82rem; }
.footer-grid nav { display:flex; flex-wrap:wrap; gap:12px 26px; max-width:440px; justify-content:flex-end; color:#969da3; font-size:.8rem; }
.footer-bottom { display:flex; justify-content:space-between; gap:30px; margin-top:54px; padding-top:22px; border-top:1px solid var(--line); color:#656c72; font-size:.68rem; }
.mobile-contact { display:none; }

@media (max-width: 980px) {
  :root { --shell: min(100% - 32px, 760px); --header: 68px; }
  .menu-toggle { display:block; position:relative; z-index:2; }
  .site-menu { position:fixed; inset:0; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:22px; padding:70px 9vw; background:rgba(7,9,11,.98); transform:translateX(100%); transition:transform .35s ease; font-size:1.25rem; }
  .site-menu.is-open { transform:none; }
  .menu-toggle[aria-expanded="true"] span:first-child { transform:translateY(4px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:last-child { transform:translateY(-4px) rotate(-45deg); }
  .hero-layout { grid-template-columns:1fr; }
  .hero-visual { position:absolute; inset:10% -25% auto 35%; min-height:500px; opacity:.55; z-index:-1; }
  .hero-copy { padding-top:45px; }
  .intro-grid, .section-heading { grid-template-columns:110px 1fr; }
  .intro-grid .intro-copy { grid-column:2; }
  .film-item { grid-template-columns:1fr 1.15fr; gap:35px; }
  .film-swatch { min-height:290px; }
  .craft-points article > div { grid-template-columns:1fr; gap:14px; }
  .contact-grid { grid-template-columns:1fr; }
  .faq-grid { gap:5vw; }
}

@media (max-width: 680px) {
  :root { --shell: calc(100% - 28px); }
  body { padding-bottom:66px; }
  .section { padding:80px 0; }
  .brand strong { font-size:1.05rem; }
  .brand small { font-size:.42rem; }
  .hero { min-height:100svh; padding-top:104px; align-items:start; }
  .hero::before { background:linear-gradient(180deg,rgba(7,9,11,.65),rgba(7,9,11,.97) 70%); }
  .hero-grid { background-size:44px 44px; mask-image:linear-gradient(#000,transparent); }
  .hero h1 { margin-top:0; font-size:clamp(3rem,14vw,4.4rem); }
  .hero h1 em { white-space:normal; }
  .hero-context { max-width:300px; font-size:.58rem; }
  .hero-lead { font-size:1rem; max-width:500px; }
  .hero-actions { display:grid; grid-template-columns:1fr; margin-top:28px; }
  .button { width:100%; }
  .hero-facts { grid-template-columns:1fr; margin-top:36px; padding-bottom:50px; }
  .hero-facts div { display:grid; grid-template-columns:90px 1fr; gap:10px; padding:9px 0; border-bottom:1px solid var(--line); }
  .hero-visual { inset:0 -55% auto 5%; opacity:.32; transform:scale(.78); transform-origin:top right; }
  .scroll-cue { bottom:78px; }
  .intro-grid, .section-heading { grid-template-columns:1fr; gap:28px; }
  .intro-grid .intro-copy { grid-column:auto; }
  h2, .intro h2 { font-size:clamp(2.25rem,11vw,3.4rem); }
  .film-item { grid-template-columns:1fr; padding:42px 0 50px; }
  .film-swatch { min-height:245px; }
  .film-copy h3 { font-size:2.35rem; }
  .film-copy dl div { grid-template-columns:78px 1fr; }
  .edge-comparison { grid-template-columns:1fr; gap:44px; }
  .slot-frame strong { font-size:.95rem; }
  .craft-points { margin-top:60px; }
  .craft-points article { grid-template-columns:42px 1fr; gap:14px; padding:32px 0; }
  .craft-points article > div { display:block; }
  .craft-points h3 { margin-bottom:12px; }
  .process-list li { grid-template-columns:44px 1fr; gap:12px; }
  .trust-panel { grid-template-columns:1fr; padding:22px; margin-top:70px; }
  .faq-grid { grid-template-columns:1fr; gap:42px; }
  .contact-actions a { grid-template-columns:90px 1fr auto; gap:10px; }
  .related-links { grid-template-columns:1fr; }
  .related-links a, .related-links a:nth-child(even) { padding:24px 0; border-right:0; }
  .footer-grid { grid-template-columns:1fr; }
  .footer-grid nav { justify-content:flex-start; }
  .footer-bottom { flex-direction:column; gap:8px; }
  .mobile-contact { position:fixed; z-index:90; inset:auto 0 0; display:grid; grid-template-columns:1fr 1fr; height:66px; padding:8px; gap:8px; background:rgba(7,9,11,.94); border-top:1px solid var(--line); backdrop-filter:blur(16px); }
  .mobile-contact a { display:grid; place-items:center; border:1px solid var(--line-strong); font-weight:600; font-size:.8rem; }
  .mobile-contact a:first-child { background:var(--red); border-color:var(--red); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  #certifiedCanvas { display:none; }
  .window-stack { transform:translate(-50%,-50%) rotateY(-12deg); }
}

@media (prefers-contrast: more) {
  :root { --muted:#c5c9cc; --line:rgba(255,255,255,.35); }
}