/* designated-2026 · insights. Overgenomen uit concepten/2026-10-08-insights-overzicht.html; base.css staat er niet in. */
.progress { position: fixed; z-index: 120; left: 0; top: 0; height: calc(3 * var(--u)); width: 100%; background: var(--lime); transform: scaleX(var(--p, 0)); transform-origin: 0 50%; }
#art-head { background: var(--light); color: var(--ink-dark); padding: calc(150 * var(--u)) var(--rand) 0; }
#art-head .in { display: grid; grid-template-columns: calc(240 * var(--u)) minmax(0, calc(720 * var(--u))) 1fr; column-gap: calc(56 * var(--u)); justify-content: center; }
#art-head .in > * { grid-column: 2 / 4; justify-self: start; }
#art-head .in > .hero-im { grid-column: 1 / -1; justify-self: stretch; }
#art-head .crumb { font-family: "Fragment Mono", monospace; font-size: calc(11 * var(--u)); letter-spacing: .08em; text-transform: uppercase; color: var(--soft-dark); display: flex; gap: calc(10 * var(--u)); align-items: center; flex-wrap: wrap; }
#art-head .crumb a:hover { color: var(--ink-dark); }
#art-head .crumb span { opacity: .5; }
#art-head .tag { display: inline-flex; gap: calc(8 * var(--u)); align-items: center; margin-top: calc(30 * var(--u)); font-family: "Fragment Mono", monospace; font-size: calc(11 * var(--u)); letter-spacing: .08em; text-transform: uppercase; padding: calc(8 * var(--u)) calc(12 * var(--u)); border-radius: calc(999 * var(--u)); background: var(--lime); color: var(--navy); }
#art-head h1 { margin-top: calc(22 * var(--u)); font-size: clamp(calc(44 * var(--u)), min(6vw, calc(86.4 * var(--u))), calc(100 * var(--u))); max-width: 16ch; }
#art-head h1 em { color: var(--navy); }
#art-head .lede { margin-top: calc(28 * var(--u)); font-size: clamp(calc(19 * var(--u)), min(1.6vw, calc(23.04 * var(--u))), calc(24 * var(--u))); line-height: 1.45; letter-spacing: -.015em; max-width: 46ch; color: var(--ink-dark); }
#art-head .meta { margin-top: calc(34 * var(--u)); display: flex; gap: calc(16 * var(--u)); align-items: center; flex-wrap: wrap; font-size: calc(14 * var(--u)); color: var(--soft-dark); }
#art-head .meta .mono { width: calc(48 * var(--u)); height: calc(48 * var(--u)); border-radius: 50%; background: var(--navy); color: var(--lime); display: grid; place-items: center; font-weight: 700; letter-spacing: -.03em; flex: none; }
#art-head .meta b { display: block; color: var(--ink-dark); font-size: calc(15 * var(--u)); }
#art-head .meta .dot { width: calc(4 * var(--u)); height: calc(4 * var(--u)); border-radius: 50%; background: var(--soft-dark); opacity: .5; }
#art-head .hero-im { margin-top: calc(56 * var(--u)); border-radius: calc(var(--r) * 1.3); overflow: hidden; aspect-ratio: 21 / 9; background: #dfe4e7; }
#art-head .hero-im img { width: 100%; height: 110%; object-fit: cover; display: block; transform: translateY(var(--py, 0px)); }
#art-head .hero-im.rise { transition-delay: .3s; }
#art-body { background: var(--light); color: var(--ink-dark); padding: calc(70 * var(--u)) var(--rand) calc(120 * var(--u) * var(--sy-b)); display: grid; grid-template-columns: calc(240 * var(--u)) minmax(0, calc(720 * var(--u))) 1fr; gap: calc(56 * var(--u)); justify-content: center; }
#art-body aside { position: sticky; top: calc(120 * var(--u)); align-self: start; }
#art-body .toc small { font-family: "Fragment Mono", monospace; font-size: calc(11 * var(--u)); letter-spacing: .1em; text-transform: uppercase; color: var(--soft-dark); }
#art-body .toc ol { list-style: none; padding: 0; margin-top: calc(14 * var(--u)); border-left: 1px solid var(--line-light); }
#art-body .toc a { display: block; padding: calc(8 * var(--u)) 0 calc(8 * var(--u)) calc(16 * var(--u)); margin-left: -1px; border-left: 2px solid transparent; font-size: calc(14.5 * var(--u)); line-height: 1.35; color: var(--soft-dark); transition: color .25s, border-color .25s; }
#art-body .toc a:hover { color: var(--ink-dark); }
#art-body .toc a.on { color: var(--ink-dark); font-weight: 600; border-left-color: var(--navy); }
#art-body .share { margin-top: calc(30 * var(--u)); display: flex; gap: calc(8 * var(--u)); align-items: center; }
#art-body .share small { font-family: "Fragment Mono", monospace; font-size: calc(11 * var(--u)); letter-spacing: .1em; text-transform: uppercase; color: var(--soft-dark); margin-right: calc(4 * var(--u)); }
#art-body .share button, #art-body .share a { font: inherit; width: calc(38 * var(--u)); height: calc(38 * var(--u)); border-radius: 50%; border: 1px solid var(--line-light); background: #fff; display: grid; place-items: center; cursor: pointer; color: var(--ink-dark); transition: background .25s, color .25s; }
#art-body .share button:hover, #art-body .share a:hover { background: var(--navy); color: var(--ink); }
#art-body .share svg { width: calc(16 * var(--u)); height: calc(16 * var(--u)); }
#art-body .share .ok { font-size: calc(12 * var(--u)); color: var(--soft-dark); opacity: 0; transition: opacity .3s; margin-left: calc(4 * var(--u)); }
#art-body .share .ok.on { opacity: 1; }
.prose { font-size: calc(19 * var(--u)); line-height: 1.65; letter-spacing: -.005em; }
.prose > * + * { margin-top: 1.1em; }
.prose h2 { margin-top: 2.2em; font-size: clamp(calc(28 * var(--u)), min(2.6vw, calc(37.44 * var(--u))), calc(38 * var(--u))); font-weight: 700; letter-spacing: -.05em; line-height: 1.05; scroll-margin-top: calc(120 * var(--u)); }
.prose h2 + p { margin-top: .8em; }
.prose ul { list-style: none; padding: 0; }
.prose ul li { position: relative; padding-left: calc(28 * var(--u)); }
.prose ul li + li { margin-top: .5em; }
.prose ul li::before { content: ""; position: absolute; left: calc(4 * var(--u)); top: .62em; width: calc(8 * var(--u)); height: calc(8 * var(--u)); border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 calc(3 * var(--u)) rgba(200,245,96,.25); }
.prose b { font-weight: 650; }
.prose .tldr { margin-top: 0; padding: calc(26 * var(--u)) calc(28 * var(--u)); border-radius: var(--r); background: #fff; border: 1px solid var(--line-light); }
.prose .tldr small { font-family: "Fragment Mono", monospace; font-size: calc(11 * var(--u)); letter-spacing: .1em; text-transform: uppercase; color: var(--soft-dark); }
.prose .tldr ul { margin-top: calc(12 * var(--u)); font-size: calc(17 * var(--u)); line-height: 1.5; }
.prose blockquote { margin: 1.8em 0; padding: calc(6 * var(--u)) 0 calc(6 * var(--u)) calc(28 * var(--u)); border-left: calc(3 * var(--u)) solid var(--lime); font-family: "Instrument Serif", serif; font-style: italic; font-size: clamp(calc(30 * var(--u)), min(3vw, calc(43.2 * var(--u))), calc(44 * var(--u))); line-height: 1.1; letter-spacing: -.015em; }
.cmp { margin: 1.6em 0; display: grid; grid-template-columns: 1fr 1fr; gap: calc(12 * var(--u)); font-size: calc(15 * var(--u)); line-height: 1.4; }
.cmp .c { padding: calc(24 * var(--u)); border-radius: var(--r); background: #fff; border: 1px solid var(--line-light); }
.cmp .c.win { background: var(--navy); color: var(--ink); border-color: var(--navy); }
.cmp .c .t { display: flex; justify-content: space-between; align-items: center; gap: calc(10 * var(--u)); }
.cmp .c .t b { font-size: calc(18 * var(--u)); letter-spacing: -.02em; }
.cmp .c .t span { font-family: "Fragment Mono", monospace; font-size: calc(10.5 * var(--u)); letter-spacing: .08em; text-transform: uppercase; padding: calc(6 * var(--u)) calc(9 * var(--u)); border-radius: calc(999 * var(--u)); border: 1px solid var(--line-light); color: var(--soft-dark); }
.cmp .c.win .t span { background: var(--lime); color: var(--navy); border-color: var(--lime); }
.cmp .row { margin-top: calc(18 * var(--u)); }
.cmp .row .l { display: flex; justify-content: space-between; font-size: calc(13.5 * var(--u)); color: var(--soft-dark); }
.cmp .c.win .row .l { color: var(--soft); }
.cmp .row .l b { color: var(--ink-dark); font-size: calc(14 * var(--u)); }
.cmp .c.win .row .l b { color: var(--ink); }
.cmp .bar { margin-top: calc(7 * var(--u)); height: calc(8 * var(--u)); border-radius: calc(999 * var(--u)); background: rgba(10,29,41,.07); overflow: hidden; }
.cmp .c.win .bar { background: rgba(255,255,255,.1); }
.cmp .bar i { display: block; height: 100%; width: var(--w); border-radius: inherit; background: rgba(10,29,41,.35); transform: scaleX(0); transform-origin: 0 50%; transition: transform 1.3s var(--ease); }
.cmp .c.win .bar i { background: var(--lime); }
.cmp .c.win .row.cost .bar i { background: rgba(255,255,255,.35); }
.cmp.in .bar i { transform: none; }
.cmp .row:nth-of-type(2) .bar i { transition-delay: .25s; }
.cmp .row:nth-of-type(3) .bar i { transition-delay: .5s; }
.cmp .res { margin-top: calc(20 * var(--u)); padding-top: calc(16 * var(--u)); border-top: 1px solid var(--line-light); display: flex; justify-content: space-between; align-items: baseline; gap: calc(10 * var(--u)); }
.cmp .c.win .res { border-top-color: var(--line); }
.cmp .res small { font-size: calc(13.5 * var(--u)); color: var(--soft-dark); }
.cmp .c.win .res small { color: var(--soft); }
.cmp .res b { font-size: calc(34 * var(--u)); font-weight: 700; letter-spacing: -.06em; }
.cmp .c.win .res b { color: var(--lime); }
.cmp .cap { grid-column: 1 / -1; font-family: "Fragment Mono", monospace; font-size: calc(11 * var(--u)); color: var(--soft-dark); }
.prose .cta { margin: 1.8em 0; padding: calc(26 * var(--u)) calc(28 * var(--u)); border-radius: var(--r); background: var(--navy); color: var(--ink); display: grid; grid-template-columns: 1fr auto; gap: calc(20 * var(--u)); align-items: center; }
.prose .cta p { font-size: calc(19 * var(--u)); font-weight: 700; letter-spacing: -.025em; line-height: 1.3; }
.prose .cta p span { display: block; margin-top: calc(4 * var(--u)); font-size: calc(15 * var(--u)); font-weight: 400; letter-spacing: 0; color: var(--soft); }
.prose .author { margin-top: 2.6em; padding: calc(24 * var(--u)); border-radius: var(--r); background: #fff; border: 1px solid var(--line-light); display: grid; grid-template-columns: calc(60 * var(--u)) 1fr; gap: calc(18 * var(--u)); align-items: center; font-size: calc(15 * var(--u)); line-height: 1.5; color: var(--soft-dark); }
.prose .author .mono { width: calc(60 * var(--u)); height: calc(60 * var(--u)); border-radius: 50%; background: var(--navy); color: var(--lime); display: grid; place-items: center; font-weight: 700; font-size: calc(18 * var(--u)); letter-spacing: -.03em; }
.prose .author b { display: block; font-size: calc(17 * var(--u)); color: var(--ink-dark); }
@media (max-width: 1100px) {
  #art-body, #art-head .in { grid-template-columns: calc(200 * var(--u)) minmax(0, 1fr); gap: calc(40 * var(--u)); }
  #art-head .in > * { grid-column: 2; }
}
@media (max-width: 820px) {
  #art-body, #art-head .in { grid-template-columns: 1fr; }
  #art-body { padding-top: calc(40 * var(--u)); }
  #art-head .in > * { grid-column: 1; }
  #art-body aside { position: static; }
  #art-body .toc { display: none; }
  #art-body .share { margin-top: 0; }
  #art-head .hero-im { aspect-ratio: 4 / 3; }
  .cmp { grid-template-columns: 1fr; }
  .prose .cta { grid-template-columns: 1fr; }
}
#art-more { background: #fff; color: var(--ink-dark); padding: calc(100 * var(--u) * var(--sy-t)) var(--rand) calc(110 * var(--u) * var(--sy-b)); border-top: 1px solid var(--line-light); }
#art-more .top { display: flex; justify-content: space-between; align-items: end; gap: calc(20 * var(--u)); margin-bottom: calc(36 * var(--u)); flex-wrap: wrap; }
#art-more .top a { font-size: calc(15 * var(--u)); font-weight: 500; border-bottom: 1px solid var(--line-light); padding-bottom: calc(3 * var(--u)); }
.acard { display: flex; flex-direction: column; gap: calc(16 * var(--u)); color: inherit; }
.acard .th { position: relative; border-radius: var(--r); overflow: hidden; aspect-ratio: 3 / 2; background: #dfe4e7; }
.acard .th img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1.1s var(--ease); }
.acard:hover .th img { transform: scale(1.05); }
.acard .th .tg { position: absolute; left: calc(14 * var(--u)); top: calc(14 * var(--u)); font-family: "Fragment Mono", monospace; font-size: calc(10.5 * var(--u)); letter-spacing: .07em; text-transform: uppercase; padding: calc(7 * var(--u)) calc(10 * var(--u)); border-radius: calc(999 * var(--u)); color: var(--ink); background: linear-gradient(135deg, rgba(10,29,41,.72), rgba(10,29,41,.52)); border: 1px solid rgba(255,255,255,.16); backdrop-filter: blur(calc(12 * var(--u))); -webkit-backdrop-filter: blur(calc(12 * var(--u))); }
.acard h3 { font-size: clamp(calc(21 * var(--u)), min(1.7vw, calc(24.48 * var(--u))), calc(26 * var(--u))); font-weight: 700; letter-spacing: -.045em; line-height: 1.12; text-decoration: underline; text-decoration-thickness: calc(1.5 * var(--u)); text-underline-offset: .14em; text-decoration-color: transparent; transition: text-decoration-color .3s; }
.acard:hover h3 { text-decoration-color: currentColor; }
.acard p { font-size: calc(15 * var(--u)); line-height: 1.5; color: var(--soft-dark); }
.acard .by { display: flex; gap: calc(10 * var(--u)); align-items: center; font-size: calc(13 * var(--u)); color: var(--soft-dark); margin-top: auto; }
.acard .by img { width: calc(28 * var(--u)); height: calc(28 * var(--u)); border-radius: 50%; object-fit: cover; flex: none; }
.acard .by i { font-style: normal; width: calc(28 * var(--u)); height: calc(28 * var(--u)); border-radius: 50%; background: var(--navy); color: var(--lime); display: grid; place-items: center; font-weight: 700; font-size: calc(11 * var(--u)); }
.agrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: calc(40 * var(--u)) calc(22 * var(--u)); }
@media (max-width: 1000px) {
  .agrid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 620px) {
  .agrid { grid-template-columns: 1fr; }
}
#art-news { background: var(--navy); color: var(--ink); padding: calc(90 * var(--u) * var(--sy-t)) var(--rand) calc(90 * var(--u) * var(--sy-b)); display: grid; grid-template-columns: 1fr 1fr; gap: calc(40 * var(--u)); align-items: center; position: relative; overflow: hidden; }
#art-news > * { position: relative; z-index: 1; }
#art-news .mark { position: absolute; z-index: 0; width: 46vw; max-width: calc(700 * var(--u)); right: -12vw; top: -30%; color: rgba(255,255,255,.04); pointer-events: none; }
#art-news .h { font-size: clamp(calc(36 * var(--u)), min(4vw, calc(57.6 * var(--u))), calc(64 * var(--u))); margin-top: calc(16 * var(--u)); }
#art-news .h em { color: var(--lime); }
#art-news p { margin-top: calc(18 * var(--u)); font-size: calc(17 * var(--u)); line-height: 1.5; color: var(--soft); max-width: 40ch; }
#art-news form { display: flex; gap: calc(6 * var(--u)); padding: calc(6 * var(--u)); border-radius: calc(999 * var(--u)); background: #fff; max-width: calc(520 * var(--u)); justify-self: end; width: 100%; }
#art-news input { flex: 1; min-width: 0; font: inherit; font-size: calc(16 * var(--u)); border: 0; outline: 0; background: none; color: var(--ink-dark); padding: 0 calc(18 * var(--u)); }
#art-news button { font: inherit; font-weight: 700; font-size: calc(15 * var(--u)); border: 0; border-radius: calc(999 * var(--u)); padding: calc(7 * var(--u)) calc(7 * var(--u)) calc(7 * var(--u)) calc(20 * var(--u)); background: var(--lime); color: var(--navy); cursor: pointer; }
#art-news .fine { grid-column: 2; justify-self: end; margin-top: calc(-26 * var(--u)); font-size: calc(13 * var(--u)); color: var(--soft); max-width: calc(520 * var(--u)); width: 100%; padding-left: calc(18 * var(--u)); }
@media (max-width: 900px) {
  #art-news { grid-template-columns: 1fr; }
  #art-news form, #art-news .fine { justify-self: start; grid-column: 1; }
  #art-news .fine { margin-top: calc(-20 * var(--u)); }
}
#ins-hero { background: var(--navy); color: var(--ink); position: relative; overflow: hidden; padding: calc(150 * var(--u)) var(--rand) calc(90 * var(--u)); display: grid; grid-template-columns: 1.1fr .9fr; gap: calc(40 * var(--u)); align-items: end; }
#ins-hero > * { position: relative; z-index: 1; }
#ins-hero .mark { position: absolute; z-index: 0; width: 64vw; max-width: calc(1000 * var(--u)); right: -18vw; top: -36%; color: rgba(255,255,255,.035); transform: rotate(var(--rot, 0deg)); pointer-events: none; }
#ins-hero .crumb { font-family: "Fragment Mono", monospace; font-size: calc(11 * var(--u)); letter-spacing: .08em; text-transform: uppercase; color: var(--soft); display: flex; gap: calc(10 * var(--u)); }
#ins-hero .crumb span { opacity: .5; }
#ins-hero h1 { margin-top: calc(26 * var(--u)); font-size: clamp(calc(54 * var(--u)), min(7vw, calc(100.8 * var(--u))), calc(128 * var(--u))); }
#ins-hero h1 em { color: var(--lime); }
#ins-hero .lede { font-size: calc(18 * var(--u)); line-height: 1.5; color: var(--soft); max-width: 42ch; }
#ins-hero .find { margin-top: calc(22 * var(--u)); display: flex; gap: calc(10 * var(--u)); align-items: center; padding: calc(6 * var(--u)) calc(6 * var(--u)) calc(6 * var(--u)) calc(18 * var(--u)); border-radius: calc(999 * var(--u)); background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16); max-width: calc(460 * var(--u)); }
#ins-hero .find svg { width: calc(16 * var(--u)); height: calc(16 * var(--u)); opacity: .7; flex: none; }
#ins-hero .find input { flex: 1; min-width: 0; font: inherit; font-size: calc(15 * var(--u)); color: var(--ink); background: none; border: 0; outline: 0; padding: calc(10 * var(--u)) 0; }
#ins-hero .find input::placeholder { color: var(--soft); }
#ins-hero .find kbd { font-family: "Fragment Mono", monospace; font-size: calc(11 * var(--u)); color: var(--soft); padding: calc(6 * var(--u)) calc(9 * var(--u)); border-radius: calc(8 * var(--u)); border: 1px solid var(--line); }
#ins-list { background: var(--light); color: var(--ink-dark); padding: calc(70 * var(--u)) var(--rand) calc(120 * var(--u) * var(--sy-b)); }
#ins-list .feat { display: grid; grid-template-columns: 1.25fr 1fr; gap: 0; border-radius: calc(var(--r) * 1.2); overflow: hidden; background: #fff; border: 1px solid var(--line-light); transition: transform .6s var(--ease), box-shadow .6s; }
#ins-list .feat:hover { box-shadow: 0 calc(40 * var(--u)) calc(90 * var(--u)) rgba(10,29,41,.12); }
#ins-list .feat .im { position: relative; min-height: calc(460 * var(--u)); overflow: hidden; }
#ins-list .feat .im img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
#ins-list .feat:hover .im img { transform: scale(1.05); }
#ins-list .feat .tx { padding: calc(40 * var(--u)); display: flex; flex-direction: column; gap: calc(18 * var(--u)); }
#ins-list .feat .k { display: flex; gap: calc(8 * var(--u)); flex-wrap: wrap; }
#ins-list .feat .k span { font-family: "Fragment Mono", monospace; font-size: calc(10.5 * var(--u)); letter-spacing: .08em; text-transform: uppercase; padding: calc(7 * var(--u)) calc(11 * var(--u)); border-radius: calc(999 * var(--u)); background: var(--light); color: var(--soft-dark); }
#ins-list .feat .k .new { background: var(--lime); color: var(--navy); }
#ins-list .feat h2 { font-size: clamp(calc(32 * var(--u)), min(3.2vw, calc(46.08 * var(--u))), calc(54 * var(--u))); font-weight: 700; letter-spacing: -.05em; line-height: .98; }
#ins-list .feat h2 em { font-family: "Instrument Serif", serif; font-style: italic; font-weight: 400; letter-spacing: -.015em; }
#ins-list .feat p { font-size: calc(17 * var(--u)); line-height: 1.5; color: var(--soft-dark); max-width: 44ch; }
#ins-list .feat .ft { margin-top: auto; display: flex; justify-content: space-between; align-items: center; gap: calc(16 * var(--u)); padding-top: calc(20 * var(--u)); border-top: 1px solid var(--line-light); }
#ins-list .feat .by { display: flex; gap: calc(12 * var(--u)); align-items: center; font-size: calc(14 * var(--u)); color: var(--soft-dark); }
#ins-list .feat .by img { width: calc(40 * var(--u)); height: calc(40 * var(--u)); border-radius: 50%; object-fit: cover; flex: none; }
#ins-list .feat .by i { font-style: normal; width: calc(40 * var(--u)); height: calc(40 * var(--u)); border-radius: 50%; background: var(--navy); color: var(--lime); display: grid; place-items: center; font-weight: 700; font-size: calc(13 * var(--u)); }
#ins-list .feat .by b { display: block; color: var(--ink-dark); font-size: calc(15 * var(--u)); }
#ins-list .feat .read { display: inline-flex; gap: calc(10 * var(--u)); align-items: center; font-weight: 700; font-size: calc(15 * var(--u)); padding: calc(12 * var(--u)) calc(18 * var(--u)); border-radius: calc(999 * var(--u)); background: var(--lime); color: var(--navy); }
#ins-list .topics { scroll-margin-top: calc(110 * var(--u)); margin: calc(64 * var(--u)) 0 calc(30 * var(--u)); display: flex; justify-content: space-between; align-items: end; gap: calc(20 * var(--u)); flex-wrap: wrap; }
#ins-list .chips { display: flex; gap: calc(6 * var(--u)); flex-wrap: wrap; }
#ins-list .chip { font: inherit; font-size: calc(14 * var(--u)); font-weight: 500; cursor: pointer; display: inline-flex; gap: calc(8 * var(--u)); align-items: center; padding: calc(9 * var(--u)) calc(14 * var(--u)); border-radius: calc(999 * var(--u)); border: 1px solid var(--line-light); background: #fff; color: var(--ink-dark); transition: background .25s, color .25s, border-color .25s; }
#ins-list .chip i { font-style: normal; font-family: "Fragment Mono", monospace; font-size: calc(11 * var(--u)); color: var(--soft-dark); }
#ins-list .chip:hover { border-color: var(--navy); }
#ins-list .chip.on { background: var(--navy); color: var(--ink); border-color: var(--navy); }
#ins-list .chip.on i { color: var(--lime); }
#ins-list .acard.out { display: none; }
#ins-list .acard.enter { animation: enter .6s var(--ease) both; animation-delay: calc(var(--o, 0) * 50ms); }
@keyframes enter { from { opacity: 0; transform: translateY(calc(20 * var(--u))); } }
#ins-list .empty { display: none; padding: calc(40 * var(--u)); border-radius: var(--r); border: 1.5px dashed var(--line-light); text-align: center; color: var(--soft-dark); font-size: calc(16 * var(--u)); }
#ins-list .empty.on { display: block; }
#ins-list .note { margin-top: calc(40 * var(--u)); font-family: "Fragment Mono", monospace; font-size: calc(11 * var(--u)); color: var(--soft-dark); text-align: center; }
@media (max-width: 960px) {
  #ins-hero { grid-template-columns: 1fr; padding-top: calc(128 * var(--u)); }
  #ins-list .feat { grid-template-columns: 1fr; }
  #ins-list .feat .im { min-height: calc(280 * var(--u)); }
  #ins-list .feat .tx { padding: calc(26 * var(--u)); }
}
@media (prefers-reduced-motion: reduce) {
  .sp .h .ln > span, .sp .rise, #footer .rise { opacity: 1 !important; transform: none !important; }
}