/* Slide-specific styles for index.html */

.reveal h2 { font-size: 52px; }
.reveal .credit { font: italic 400 14px "Inter", sans-serif; color: var(--ink-soft); }
.trigger { display: block; width: 0; height: 0; }

/* 1 · title */
#title .t-text { position: absolute; left: 40px; top: 220px; width: 760px; }
#title h1.title { font-size: 58px; line-height: 1.08; margin-top: 22px; }
#title .authors { font-size: 26px; margin-top: 30px; }
#title .affil { font: 500 19px "Inter", sans-serif; color: var(--ink-soft); margin-top: 8px; }
.jigsaw { position: absolute; }
.jigsaw .tile {
  position: absolute; box-shadow: 0 6px 14px rgba(60, 40, 20, .28);
  transition: transform 1.4s cubic-bezier(.2, .8, .2, 1), box-shadow 1.4s;
}
.jigsaw.solved .tile { transform: none !important; box-shadow: 0 0 0 .5px rgba(255, 255, 255, .3); }
#title .jigsaw { right: 110px; top: 150px; width: 540px; height: 540px; }

/* 4 · can AI help? */
#ai .jigsaw { left: 200px; top: 190px; width: 520px; height: 520px; }
#ai .side { position: absolute; left: 860px; width: 680px; }
#ai .big { font: 700 60px/1.05 "Fraunces", serif; }
#ai .chip { display: inline-block; font: 600 22px "Inter", sans-serif; border: 2px solid var(--ink); border-radius: 999px; padding: 7px 18px; margin: 0 10px 10px 0; }
#ai .chip small { font-weight: 400; color: var(--ink-soft); margin-left: 6px; }
#ai .illus { position: absolute; left: 200px; top: 790px; width: 520px; text-align: center; font: 600 15px "Inter", sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-soft); }

/* 2 · pieces fly in */
.frag { position: absolute; filter: drop-shadow(0 10px 16px rgba(60, 40, 20, .25)); }
.fly { opacity: 0; transition: transform 1.6s cubic-bezier(.2, .8, .2, 1), opacity 1.2s; }
.reveal section.present .fly { opacity: 1; transform: rotate(var(--r)) !important; }
#pieces .b-head { position: absolute; left: 40px; top: 560px; width: 1100px; }
#pieces .big, #pieces .line2 { font: 700 76px/1.05 "Fraunces", serif; }
#pieces .line2 { color: var(--rust); }
#pieces .b-goal { position: absolute; left: 40px; top: 760px; font: 600 30px "Inter", sans-serif; }

/* 3 · damage */
#damage .c-img { position: absolute; left: 250px; top: 130px; width: 1000px; }
.callout { position: absolute; font: 600 26px "Inter", sans-serif; color: var(--rust); }
.callout span { display: block; font: 400 20px "Source Serif 4", serif; color: var(--ink-soft); margin-top: 4px; }
svg.arrows { position: absolute; left: 0; top: 0; width: 1600px; height: 900px; overflow: visible; pointer-events: none; }
svg.arrows path { fill: none; stroke: var(--rust); stroke-width: 4; stroke-linecap: round; }
#damage .c-bottom { position: absolute; left: 40px; right: 40px; top: 760px; text-align: center; font: 700 44px "Fraunces", serif; }

/* 3×3 grid shuffle (shared) */
.g3 { position: absolute; transition: opacity .6s; }
.g3.hidden { opacity: 0; }
.g3 .t { position: absolute; background-repeat: no-repeat; box-shadow: 0 4px 10px rgba(60, 40, 20, .22);
  transition: left .9s cubic-bezier(.2, .8, .2, 1), top .9s cubic-bezier(.2, .8, .2, 1); }

/* 5 · from the real problem to a first step */
#step .divider { position: absolute; left: 790px; top: 150px; width: 2px; height: 600px; background: var(--line); }
#step .col-label { position: absolute; top: 130px; }
#step .q { position: absolute; font: 700 40px/1.15 "Fraunces", serif; }
#step .g3 { left: 960px; top: 210px; width: 450px; height: 450px; }
#step .small { position: absolute; font: 500 19px/1.4 "Inter", sans-serif; color: var(--ink-soft); }

/* 6 · why a dataset? */
#why .lead { position: absolute; left: 40px; top: 150px; width: 1520px; font: 700 50px/1.15 "Fraunces", serif; }
#why .lead .muted { font-weight: 500; }
#why .dsets { position: absolute; left: 40px; right: 40px; top: 300px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
#why .ds { background: #fff8ee; border: 1px solid var(--line); border-radius: 10px; padding: 22px 24px; position: relative; }
#why .ds .name { font: 700 34px "Fraunces", serif; }
#why .ds .what { font-size: 24px; margin-top: 8px; line-height: 1.35; }
#why .ds .pic { height: 190px; margin: -22px -24px 16px; border-radius: 10px 10px 0 0; background: #fff center/cover no-repeat; }
#why .ds .pic.ph { display: flex; align-items: center; justify-content: center; text-align: center; background: repeating-linear-gradient(45deg, #efe6d8, #efe6d8 12px, #e7dccb 12px, #e7dccb 24px); font: 600 18px Inter, sans-serif; color: var(--ink-soft); }
#why .ds .x { position: absolute; right: 16px; top: 200px; font: 700 48px "Inter", sans-serif; color: var(--rust); }
#why .punch { position: absolute; left: 40px; right: 40px; top: 735px; text-align: center; font: 700 56px "Fraunces", serif; }

/* 7 · building TEXMET */
.wall { position: absolute; display: grid; grid-template-columns: repeat(10, 1fr); gap: 6px; }
.wall img { width: 100%; aspect-ratio: 1; object-fit: cover; display: block; border-radius: 3px;
  transition: opacity .8s, transform .8s, filter .8s, outline-color .4s; outline: 4px solid transparent; outline-offset: -4px; }
.wall.flag img.bad { outline-color: #d9482b; }
.wall.clean img.bad { opacity: .06; transform: scale(.6); filter: grayscale(1); }
.step-off { opacity: 0 !important; pointer-events: none; }

/* solvers slide */
#solvers .col { position: absolute; top: 140px; width: 470px; }
#solvers .g3 { position: relative; width: 300px; height: 300px; margin: 24px auto 0; }
#solvers .name { font: 700 40px "Fraunces", serif; margin-top: 34px; }
#solvers .venue { font: 500 18px "Inter", sans-serif; color: var(--ink-soft); margin-left: 8px; }
#solvers .idea { font-size: 25px; line-height: 1.38; margin-top: 8px; }
/* JPDVT: noisy guess that gets cleaned up */
#solvers .m-jpdvt .t { filter: blur(6px) saturate(.4); transition: left .9s cubic-bezier(.2,.8,.2,1), top .9s cubic-bezier(.2,.8,.2,1), filter 1.6s .3s; }
#solvers .m-jpdvt.is-solved .t { filter: none; }
/* FCViT: each piece gets coordinates */
#solvers .m-fcvit .t::after { content: attr(data-xy); position: absolute; left: 6px; top: 4px; font: 700 15px "Inter", sans-serif; color: #fff;
  background: rgba(164,71,31,.85); padding: 2px 6px; border-radius: 3px; opacity: 1; transition: opacity .5s 1s; }
#solvers .m-fcvit.is-solved .t::after { opacity: 0; }
/* DiffAssemble: pieces as a graph */
#solvers svg.graph { position: absolute; left: 0; top: 0; width: 300px; height: 300px; pointer-events: none; opacity: 0; transition: opacity .6s .9s; }
#solvers .m-diff:not(.hidden) + svg.graph { opacity: 1; transition-delay: .3s; }
#solvers .m-diff .t { transition: left 1.8s cubic-bezier(.4,0,.2,1), top 1.8s cubic-bezier(.4,0,.2,1); }
#solvers svg.graph line { stroke: #fff; stroke-width: 3; opacity: .9; }
#solvers svg.graph circle { fill: var(--rust); stroke: #fff; stroke-width: 2; }

/* 9 · introducing TEXMET */
#glance .big { font: 700 150px/0.95 "Fraunces", serif; letter-spacing: -.03em; color: var(--rust); }
#glance .stat { font: 700 52px/1 "Fraunces", serif; }
#glance .stat.acc { color: var(--rust); }
#glance .stat-l { font: 500 21px/1.35 "Inter", sans-serif; color: var(--ink-soft); margin-top: 6px; }
#glance .qr { background: var(--paper); padding: 8px; border: 2px solid var(--rust); border-radius: 12px; }
#glance .qr img { display: block; width: 100%; }
#glance .qr-cap { font: 600 16px "Inter", sans-serif; color: var(--ink-soft); text-align: center; margin-top: 8px; }
.dbar { position: absolute; left: 40px; right: 40px; top: 420px; height: 70px; display: flex; border-radius: 8px; overflow: hidden; }
.dbar div { height: 100%; display: flex; align-items: center; padding-left: 16px; font: 600 20px "Inter", sans-serif; color: #fff; white-space: nowrap; width: 0; transition: width 1.2s cubic-bezier(.2, .8, .2, 1); }
.dbar.visible div { width: var(--w); }
.thumbs { position: absolute; top: 510px; display: flex; gap: 8px; }
.thumbs img { width: 96px; height: 96px; object-fit: cover; border-radius: 4px; }

/* dataset color tags (fixed on every results slide; validated for CVD) */
:root { --tx: #00897b; --os: #a4471f; }
.tag { display: inline-block; font: 700 15px "Inter", sans-serif; letter-spacing: .1em; text-transform: uppercase; color: #fff; padding: 4px 10px; border-radius: 4px; vertical-align: middle; }
.tag.tx { background: var(--tx); } .tag.os { background: var(--os); }

/* 10 · round 1 */
#round1 .setup { position: absolute; left: 40px; top: 118px; font: 500 22px "Inter", sans-serif; color: var(--ink-soft); }
#round1 svg.chart { position: absolute; left: 40px; top: 205px; width: 1100px; height: 600px; overflow: visible; }
#round1 svg.chart text { font-family: "Inter", sans-serif; }
#round1 .bar { transition: height 1s cubic-bezier(.2,.8,.2,1), y 1s cubic-bezier(.2,.8,.2,1); }
#round1 .side { position: absolute; left: 1180px; width: 380px; }
#round1 .call { font: 700 30px/1.2 "Fraunces", serif; margin-bottom: 22px; }
#round1 .call small { display: block; font: 500 19px/1.35 "Inter", sans-serif; color: var(--ink-soft); margin-top: 4px; }

/* 11 · does learning from TEXMET help? */
#ft .q { font: 700 60px/1.1 "Fraunces", serif; }
#ft .ftline { position: absolute; left: 40px; top: 205px; font: 700 36px/1.2 "Fraunces", serif; display: flex; align-items: center; gap: 14px; }
#ft .ftline .tag { font-size: 20px; padding: 6px 12px; }
#ft .rows { position: absolute; left: 40px; top: 300px; width: 1520px; }
#ft .r { display: grid; grid-template-columns: 300px 1fr 360px; align-items: center; padding: 18px 0; border-bottom: 1px solid var(--line); }
#ft .r .n { font: 700 36px "Fraunces", serif; }
#ft .r .what { font-size: 27px; }
#ft .r .num { font: 700 34px "Fraunces", serif; text-align: right; }
#ft .r .num small { font: 500 18px "Inter", sans-serif; color: var(--ink-soft); display: block; }
#ft .r.win { background: linear-gradient(90deg, rgba(0,137,123,.09), transparent); padding: 22px 0; }
#ft .bad { color: var(--os); } #ft .good { color: var(--tx); }
#ft .caps { display: flex; gap: 34px; margin-top: 14px; }
#ft .capi { display: flex; align-items: center; gap: 12px; font: 600 21px "Inter", sans-serif; color: var(--ink); }
#ft .capi svg { width: 54px; height: 54px; }
#ft .capi svg rect { fill: #cfe7e3; stroke: var(--tx); stroke-width: 2; }
#ft .capi svg rect.miss { fill: none; stroke-dasharray: 3 3; }
#ft .capi svg path { fill: none; stroke: var(--tx); stroke-width: 2.5; stroke-linecap: round; }

/* 12 · payoff */
#payoff svg.chart { position: absolute; left: 60px; top: 170px; width: 1000px; height: 640px; overflow: visible; }
#payoff svg.chart text { font-family: "Inter", sans-serif; }
#payoff .grow { transition: all 1.1s cubic-bezier(.2,.8,.2,1); }
#payoff .side { position: absolute; left: 1150px; top: 300px; width: 400px; }
#payoff .times { font: 700 96px/1 "Fraunces", serif; color: var(--os); }
#payoff .mini { font: 500 22px/1.45 "Inter", sans-serif; color: var(--ink-soft); }

/* 13 · real reconstructions */
#solved .solvedcell { position: absolute; width: 300px; height: 300px; }
#solved .jigsaw { left: 0; top: 0; width: 300px; height: 300px; }
#solved .jigsaw .tile { box-shadow: 0 4px 10px rgba(0,0,0,.25); }
#solved .okb { position: absolute; right: 8px; top: 8px; z-index: 5; font: 700 18px "Inter", sans-serif; color: #fff; background: #2e7d4f; padding: 4px 10px; border-radius: 4px; }
#solved .side { position: absolute; left: 1100px; top: 300px; width: 460px; }
#solved .mini { font: 500 22px/1.45 "Inter", sans-serif; color: var(--ink-soft); }

/* 14 · fabric or outline? */
#fabric .fragimg { position: absolute; left: 40px; top: 150px; width: 700px; transition: opacity .8s; }
#fabric .fragimg.dim { opacity: .25; }
#fabric .ibox { position: absolute; border: 4px solid var(--os); box-sizing: border-box; }
#fabric .crop { position: absolute; opacity: 0; border-radius: 4px; box-shadow: 0 8px 18px rgba(60,40,20,.25);
  transition: left 1s cubic-bezier(.2,.8,.2,1), top 1s cubic-bezier(.2,.8,.2,1), width 1s, height 1s, opacity .3s; }
#fabric .crop.a { left: 161px; top: 236px; width: 146px; height: 146px; }
#fabric .crop.b { left: 325px; top: 264px; width: 199px; height: 199px; }
#fabric .crop.out { opacity: 1; width: 190px; height: 190px; top: 625px; }
#fabric .crop.a.out { left: 40px; }
#fabric .crop.b.out { left: 250px; }
#fabric .cap { position: absolute; left: 40px; top: 555px; width: 760px; font: 500 20px/1.4 "Inter", sans-serif; color: var(--ink-soft); }
#fabric svg.chart { position: absolute; left: 870px; top: 150px; width: 700px; height: 520px; overflow: visible; }
#fabric svg.chart text { font-family: "Inter", sans-serif; }
#fabric .grow { transition: all 1s cubic-bezier(.2,.8,.2,1); }
#fabric .verdict { position: absolute; left: 870px; top: 720px; width: 690px; font: 700 30px/1.25 "Fraunces", serif; }

/* Slide 15 holes */
  #holes .stack { position:absolute; left:40px; top:170px; width:480px; height:480px; }
  #holes .stack img { position:absolute; left:0; top:0; width:100%; height:100%; border-radius:6px; transition:opacity 1s; }
  #holes .stack img.off { opacity:0; }
  #holes .imgcap { position:absolute; left:40px; top:665px; width:480px; font:500 20px/1.4 Inter,sans-serif; color:var(--ink-soft); }
  #holes .imgcap b { color:var(--ink); }
  #holes svg.c { position:absolute; left:620px; top:150px; width:940px; height:420px; overflow:visible; }
  #holes svg.c text { font-family:Inter,sans-serif; }
  #holes .ln { transition: stroke-dashoffset 1s ease; }
  #holes .fade { transition: opacity .6s; }
  #holes .qa { position:absolute; left:620px; width:940px; }
  #holes .qa .q { font:700 28px/1.25 Fraunces,serif; }
  #holes .qa .a { font:500 22px/1.4 Inter,sans-serif; color:var(--ink-soft); margin-top:6px; }
  #holes .qa .a b { color:var(--ink); }
  #holes .illus { position:absolute; left:52px; top:182px; font:600 12px Inter,sans-serif; letter-spacing:.12em; text-transform:uppercase; color:#fff; background:rgba(43,36,32,.55); padding:3px 8px; border-radius:4px; transition:opacity .6s; z-index:5; }
  #holes .final { position:absolute; left:40px; top:760px; width:1520px; font:700 30px/1.25 Fraunces,serif; }

/* Slides 16-17 limitations, takeaways */
  #limits .sec, #takes .sec { font:700 16px Inter,sans-serif; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); }
  /* limitations -> future work */
  #limits .hdr { position:absolute; top:150px; }
  #limits .pair { position:absolute; left:40px; width:1520px; height:170px; }
  #limits .box { position:absolute; top:0; width:690px; height:170px; border-radius:14px; box-sizing:border-box; display:flex; align-items:center; gap:24px; padding:0 26px; }
  #limits .lim { left:0; background:#ebe3d6; }
  #limits .fut { left:830px; background:#fff8ee; border:2px solid var(--rust); }
  #limits .box svg { flex:0 0 150px; height:130px; }
  #limits .tt { font:700 27px/1.2 Fraunces,serif; }
  #limits .tt small { display:block; font:500 19px/1.35 Inter,sans-serif; color:var(--ink-soft); margin-top:6px; }
  #limits .arr { position:absolute; left:700px; top:55px; width:120px; text-align:center; font:700 50px Inter; color:var(--rust); }
  #limits .foot { position:absolute; left:40px; top:800px; font:500 21px Inter,sans-serif; color:var(--ink-soft); }
  /* key takeaways */
  #takes .panel { position:absolute; top:150px; width:490px; height:640px; background:#fff8ee; border:1px solid var(--line); border-radius:14px; box-sizing:border-box; padding:26px 28px; }
  #takes .vis { height:260px; border-radius:10px; overflow:hidden; position:relative; }
  #takes .vis img { width:100%; height:100%; object-fit:cover; display:block; }
  #takes .vis svg { width:100%; height:100%; overflow:visible; }
  #takes .vis svg text { font-family:Inter,sans-serif; }
  #takes .num { font:700 20px Inter,sans-serif; color:#fff; background:var(--rust); width:36px; height:36px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; margin-top:24px; }
  #takes .big { font:700 52px/1 Fraunces,serif; color:var(--rust); margin-top:16px; }
  #takes .kh { font:700 29px/1.2 Fraunces,serif; margin-top:12px; }
  #takes .kb { font:500 20px/1.45 Inter,sans-serif; color:var(--ink-soft); margin-top:10px; }
  #takes .bar { transition: y 1s cubic-bezier(.2,.8,.2,1), height 1s cubic-bezier(.2,.8,.2,1); }

/* Slide 18 promo */
  #promo .qr { background:var(--paper); padding:8px; border:2px solid var(--rust); border-radius:12px; box-sizing:border-box; }
  #promo .qr img { display:block; width:100%; }
  #promo .qcap { font:700 20px Inter,sans-serif; text-align:center; margin-top:10px; }
  #promo .qcap small { display:block; font:500 15px Inter,sans-serif; color:var(--ink-soft); margin-top:3px; }
  #promo .browser { position:absolute; border-radius:12px; overflow:hidden; border:1px solid var(--line); box-shadow:0 14px 40px rgba(43,36,32,.18); background:#fff; }
  #promo .browser .bar { height:34px; background:#ebe3d6; display:flex; align-items:center; gap:8px; padding:0 14px; font:500 15px Inter,sans-serif; color:var(--ink-soft); }
  #promo .browser .bar i { width:11px; height:11px; border-radius:50%; background:#d9cdbb; display:inline-block; }
  #promo .browser .bar span { margin-left:14px; background:#f4efe6; padding:3px 12px; border-radius:6px; }
  #promo .browser img { display:block; width:100%; }
  #promo .count { font:700 110px/1 Fraunces,serif; color:var(--rust); }
  #promo .count small { font:700 34px Fraunces,serif; color:var(--ink); margin-left:12px; }
  #promo .sub { font:500 21px/1.4 Inter,sans-serif; color:var(--ink-soft); margin-top:8px; }
  #promo .lq { position:relative; }
  #promo .lq .logo { position:absolute; left:50%; top:50%; width:22%; height:22%; transform:translate(-50%,-50%); background:var(--paper); border-radius:8px; display:flex; align-items:center; justify-content:center; }
  #promo .lq .logo svg { width:78%; height:78%; }
  #promo .lq .logo.emo { font-size:30px; line-height:1; }
  #promo .lq .logo.doi { font:800 15px Inter,sans-serif; color:var(--rust); letter-spacing:.02em; }

/* Slide 19 thanks + UNCHANGE */
  #thanks .flyer { position:absolute; border-radius:6px; box-shadow:0 14px 40px rgba(43,36,32,.22); }
  #thanks .ty { font:700 96px/1 Fraunces,serif; }
  #thanks .qq { font:500 40px/1.2 "Source Serif 4",serif; color:var(--ink-soft); margin-top:18px; }
  #thanks .hire { font:700 34px/1.25 Fraunces,serif; }
  #thanks .hire small { display:block; font:500 21px/1.45 Inter,sans-serif; color:var(--ink-soft); margin-top:10px; }
  #thanks .names { font:500 22px/1.5 Inter,sans-serif; color:var(--ink-soft); }
  #thanks .names b { color:var(--ink); }

/* Slide 8 build flow (curation desk) */
  /* pipeline chips */
  #build .chips { position:absolute; left:40px; top:112px; display:flex; align-items:center; gap:8px; font:600 16px Inter,sans-serif; }
  #build .chips .c { padding:6px 12px; border-radius:20px; border:1.5px solid var(--line); color:var(--ink-soft); background:var(--paper); transition: all .5s; }
  #build .chips .c.on { background:var(--rust); border-color:var(--rust); color:#fff; }
  #build .chips .c.done { color:var(--ink); border-color:#b9ad9b; }
  #build .chips .a { color:#b9ad9b; }
  /* V1 desk */
  #build .desk { position:absolute; left:40px; top:170px; width:1000px; height:640px; }
  #build .t { position:absolute; left:0; top:0; border-radius:4px; background-size:cover; background-position:center; box-shadow:0 2px 6px rgba(43,36,32,.18);
    transition: transform 1.1s cubic-bezier(.2,.8,.2,1), width 1.1s cubic-bezier(.2,.8,.2,1), height 1.1s cubic-bezier(.2,.8,.2,1), opacity .6s, box-shadow .4s, outline-color .4s; outline:3px solid transparent; outline-offset:1px; }
  #build .t.flag { outline-color: var(--rust); }
  #build .t .fp { position:absolute; left:4px; right:4px; bottom:4px; height:16px; display:flex; align-items:flex-end; gap:1px; background:rgba(244,239,230,.92); padding:2px; border-radius:2px; opacity:0; transition:opacity .4s; }
  #build .t .fp i { flex:1; background:var(--rust); }
  #build.fp .t .fp { opacity:1; }
  #build .scan { position:absolute; top:0; height:600px; width:6px; background:linear-gradient(90deg, transparent, rgba(164,71,31,.55), transparent); opacity:0; }
  #build.fp .scan { animation: scan 1.6s ease-in-out 1; }
  @keyframes scan { 0% { left:150px; opacity:0 } 10% { opacity:1 } 90% { opacity:1 } 100% { left:850px; opacity:0 } }
  #build svg.map { position:absolute; left:0; top:0; width:1000px; height:480px; overflow:visible; opacity:0; transition:opacity .8s; }
  #build.map svg.map { opacity:1; }
  #build svg.map text { font-family:Inter,sans-serif; }
  #build .lasso { opacity:0; transition:opacity .6s; }
  #build.flagged .lasso { opacity:1; }
  #build .bin { position:absolute; top:492px; width:205px; height:148px; border:2px dashed #b9ad9b; border-radius:12px; opacity:0; transition:opacity .6s; }
  #build.bins .bin { opacity:1; }
  #build .bin .bl { position:absolute; left:12px; bottom:8px; font:700 17px Inter,sans-serif; }
  #build .bin .bl b { font:700 28px Fraunces,serif; color:var(--rust); display:block; }
  #build .bin .bl small { font:500 14px Inter,sans-serif; color:var(--ink-soft); }
  #build .side { position:absolute; left:1090px; top:165px; width:470px; }
  #build .big { font:700 92px/1 Fraunces,serif; letter-spacing:-.02em; }
  #build .lab { font:500 21px/1.35 Inter,sans-serif; color:var(--ink-soft); margin-top:6px; min-height:56px; }
  #build .say { font:700 36px/1.18 Fraunces,serif; margin-top:34px; }
  #build .say small { display:block; font:500 21px/1.4 Inter,sans-serif; color:var(--ink-soft); margin-top:12px; }
  #build .split { margin-top:26px; opacity:0; transition:opacity .6s; }
  #build .split .bar { display:flex; height:22px; border-radius:5px; overflow:hidden; }
  #build .split .bar i { display:block; }
  #build .split .keys { display:flex; justify-content:space-between; font:600 16px Inter,sans-serif; color:var(--ink-soft); margin-top:8px; }
  /* V2 cards */


/* Big logos on title and thanks slides; footer logos hidden there */
.deck-footer { transition: opacity .5s; }
.nologo .deck-footer { opacity: 0; }
.reveal .biglogos { display: flex; align-items: center; gap: 56px; }
.reveal .biglogos img { height: 72px; width: auto; margin: 0; }
.reveal .biglogos img.ntnu { height: 46px; }
#title .biglogos { margin-top: 56px; }

/* Slide 2 context line + technical headline */
#pieces .b-ctx { position: absolute; left: 40px; top: 440px; width: 540px; }
#pieces .b-ctx .k { font: 700 16px "Inter", sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--rust); }
#pieces .b-ctx .s { font: 500 20px/1.4 "Inter", sans-serif; color: var(--ink-soft); margin-top: 8px; }
#pieces .b-head { top: 575px; }
#pieces .line2 small { display: block; font: 500 22px/1.3 "Inter", sans-serif; color: var(--ink-soft); margin-top: 8px; }
#pieces .b-goal { top: 790px; }
