/* Generated by map/tools/port.py from the artboard's <helmet><style>. Do not edit by hand. */
html,body{margin:0;padding:0;height:100%;background:#dfe7ea}
body{margin:0;background:#dfe7ea;color:#2b241c;font-family:"Source Serif 4",Georgia,"Times New Roman",serif;font-size:14px;line-height:1.45}
a{color:#b3362b}a:hover{color:#7a2219}
*{box-sizing:border-box}
button{font:inherit;color:inherit;cursor:pointer}
.app{position:relative;width:100%;height:100vh;overflow:hidden;background:#dfe7ea}
.mapwrap{position:absolute;inset:0}
#mapcanvas{position:absolute;inset:0}
.maplibregl-ctrl-attrib{font-family:"IBM Plex Mono",monospace;font-size:10px;background:rgba(248,245,236,.85)}
.maplibregl-ctrl-bottom-right{bottom:118px}
.story-mode .maplibregl-ctrl-bottom-right{bottom:10px;right:calc(min(480px,40vw) + 10px)}
.story-mode .maplibregl-ctrl-bottom-left{left:10px}
.card{position:absolute;background:rgba(248,245,236,.94);border:1px solid #cfc5b1;box-shadow:0 1px 0 #fff inset,0 2px 10px rgba(60,40,10,.10);padding:14px 16px}
.kick{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:#b3362b;margin:0 0 4px}
.kick.grey{color:#6f675c}
h1.ttl{font-size:26px;line-height:1.1;font-weight:700;letter-spacing:.02em;text-transform:uppercase;margin:4px 0 10px;color:#2b241c}
.rule{width:120px;height:1px;background:#8a7f6a;margin:6px 0 10px}
.lede{font-style:italic;font-size:13.5px;line-height:1.45;margin:0 0 8px;color:#3a3127}
.body{font-size:13px;line-height:1.5;margin:0 0 8px}
.body b{font-weight:600}
.red{color:#b3362b}
.title-card{left:18px;top:58px;width:330px;max-height:calc(100vh - 190px);overflow:auto}
.crew-card{left:18px;bottom:128px;width:300px}
.crew-card img{width:100%;display:block;filter:sepia(.25) contrast(1.05)}
.roster{display:grid;grid-template-columns:1fr 1fr;gap:3px 10px;font-size:11.5px;margin:8px 0 0}
.roster div{line-height:1.25}
.roster i{display:block;color:#6f675c;font-size:10.5px}
.roster .me{color:#b3362b;font-weight:600}
.cap{font-size:11px;line-height:1.35;color:#6f675c;margin:5px 0 0;font-style:italic}
.panel{right:18px;top:58px;width:380px;max-height:calc(100vh - 190px);overflow:auto;padding:0}
.panel-in{padding:14px 16px}
.panel h2{font-size:21px;line-height:1.15;margin:2px 0 6px;font-weight:700}
.panel h3{font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-family:"IBM Plex Mono",monospace;font-weight:500;color:#6f675c;margin:16px 0 6px}
.tag{display:inline-block;font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.06em;padding:2px 7px;border:1px solid currentColor;margin:0 0 8px}
.tag.doc,.tag.crew{color:#b3362b}.tag.one{color:#b3362b;border-style:dashed}.tag.pos{color:#5c554b}.tag.out{color:#8d8577;border-style:dotted}
.phase{font-family:"IBM Plex Mono",monospace;font-size:12px;color:#2b241c;background:#ece5d3;padding:7px 10px;margin:0 0 10px;display:flex;justify-content:space-between;gap:8px;align-items:center}
.phase b{font-weight:500;color:#b3362b}
.btnrow{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0}
.btn{border:1px solid #8a7f6a;background:#f8f5ec;padding:7px 11px;font-size:12.5px;line-height:1.2;min-height:34px;color:#2b241c}
.btn:hover{background:#efe8d6}
.btn.pri{background:#b3362b;border-color:#8a2a21;color:#fff}
.btn.pri:hover{background:#9c2d23}
.btn.sm{padding:5px 8px;font-size:11.5px;min-height:28px}
.btn.on{background:#2b241c;color:#f8f5ec;border-color:#2b241c}
.btn.light{background:transparent;border-color:rgba(248,245,236,.55);color:#f8f5ec;padding:11px 20px;font-size:14px;min-height:44px;letter-spacing:.02em}
.btn.light:hover{background:rgba(248,245,236,.12)}
.btn.light.pri{background:rgba(248,245,236,.92);color:#2b241c;border-color:rgba(248,245,236,.92)}
.btn.light.pri:hover{background:#fff}
.photo{margin:0 0 12px}
.photo img{width:100%;display:block;border:1px solid #cfc5b1;background:#e9e2d0}
.photo .cap{margin-top:4px}
.photo .match{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#b3362b}
.photo .match.ctx{color:#6f675c}
.loss{border-left:3px solid #b3362b;padding:6px 0 6px 10px;margin:8px 0 12px}
.loss .ser{font-family:"IBM Plex Mono",monospace;font-size:12px;color:#b3362b;letter-spacing:.04em}
.facts{display:grid;grid-template-columns:auto 1fr;gap:3px 10px;font-size:12.5px;margin:0 0 6px}
.facts dt{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:#6f675c;padding-top:3px}
.facts dd{margin:0}
.roe{font-family:"IBM Plex Mono",monospace;font-size:11.5px;line-height:1.5;background:#f1ebdb;padding:9px 11px;border:1px dashed #cfc5b1;white-space:pre-line}
.mlist{list-style:none;margin:0;padding:0}
.mlist li{display:flex;gap:8px;align-items:baseline;padding:5px 0;border-bottom:1px solid #e4dcc9;cursor:pointer;font-size:12.5px}
.mlist li:hover{background:#f1ebdb}
.mlist .d{font-family:"IBM Plex Mono",monospace;font-size:11px;color:#6f675c;white-space:nowrap;min-width:60px}
.sw{width:9px;height:9px;border-radius:50%;flex-shrink:0;position:relative;top:0}
.sw.doc,.sw.crew{background:#b3362b}.sw.one{border:2px dashed #b3362b}.sw.pos{background:#7b756b}.sw.out{border:1.5px dotted #8d8577}
.record{position:absolute;right:18px;top:58px;width:380px;max-height:calc(100vh - 190px);overflow:auto}
.squares{display:flex;flex-wrap:wrap;gap:3px;margin:8px 0 6px}
.sq{width:12px;height:12px;border:1px solid #8a7f6a;background:#f8f5ec}
.sq.on{background:#b3362b;border-color:#8a2a21}
.legrow{display:flex;align-items:center;gap:10px;padding:5px 0;border-top:1px solid #e4dcc9;font-size:12.5px;cursor:pointer;width:100%;background:none;border-left:0;border-right:0;border-bottom:0;text-align:left}
.legrow:hover{background:#f1ebdb}
.legrow.off{opacity:.4}
.legrow .n{margin-left:auto;font-family:"IBM Plex Mono",monospace;font-size:11.5px}
.line{width:34px;height:0;border-top:2px solid #b3362b;flex-shrink:0}
.line.one{border-top:2px dashed #b3362b}.line.pos{border-top:1.5px solid #7b756b}.line.out{border-top:1.5px dotted #a39b8c}
.tl{position:absolute;left:18px;right:18px;bottom:14px;height:96px;background:rgba(248,245,236,.94);border:1px solid #cfc5b1;padding:6px 14px 4px}
.tl-inner{position:relative;height:60px}
.tick{position:absolute;width:12px;height:12px;margin-left:-6px;border-radius:50%;cursor:pointer;border:0;padding:0;background:#7b756b}
.tick.doc,.tick.crew{background:#b3362b;width:14px;height:14px;margin-left:-7px}
.tick.crew{border-radius:2px;transform:rotate(45deg)}
.tick.one{background:#f8f5ec;border:2px solid #b3362b}
.tick.out{background:#f8f5ec;border:1.5px dotted #8d8577}
.tick.sel{box-shadow:0 0 0 3px #f8f5ec,0 0 0 5px #2b241c}
.tick.dim{opacity:.25}
.tick .lossmark{position:absolute;left:50%;top:16px;width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-bottom:7px solid #2b241c;margin-left:-4px}
.tl .mon{position:absolute;bottom:-2px;font-family:"IBM Plex Mono",monospace;font-size:10px;color:#6f675c;letter-spacing:.08em}
.tl .shade{position:absolute;top:0;bottom:0;background:rgba(43,36,28,.07)}
.tl .ann{position:absolute;top:-2px;font-size:10.5px;font-style:italic;color:#6f675c;white-space:nowrap}
.tl .axis{position:absolute;left:0;right:0;bottom:14px;border-top:1px solid #8a7f6a}
.tlhead{display:flex;justify-content:space-between;align-items:center;font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:#6f675c;margin:0 0 4px}
.tlhead .ctl{display:flex;gap:6px}
.lbl{position:absolute;top:0;left:0;will-change:transform;pointer-events:none;white-space:nowrap;font-family:"Source Serif 4",Georgia,serif;text-shadow:0 0 3px #f3eee2,0 0 3px #f3eee2,0 0 2px #f3eee2}
.lbl-country{font-size:12px;letter-spacing:.42em;color:#6f675c;text-transform:uppercase;opacity:.8}
.lbl-sea{font-size:12px;font-style:italic;letter-spacing:.18em;color:#5d7d8c}
.lbl-city{font-size:11px;color:#4a4238;padding-left:9px;position:relative}
.lbl-city:before{content:"";position:absolute;left:0;top:7px;width:4px;height:4px;border-radius:50%;background:#4a4238}
.lbl-target{font-size:13px;font-style:italic;color:#2b241c;padding-left:10px;line-height:1.1}
.lbl-target.doc,.lbl-target.crew{font-weight:600;color:#b3362b}
.lbl-target small{display:block;font-family:"IBM Plex Mono",monospace;font-style:normal;font-size:9.5px;letter-spacing:.08em;color:#b3362b}
.lbl-event{font-size:10.5px;font-style:italic;color:#8c5a2f;max-width:150px;white-space:normal;line-height:1.2}
.lbl-loss{font-family:"IBM Plex Mono",monospace;font-size:10.5px;color:#2b241c;background:rgba(248,245,236,.92);padding:4px 7px;border:1px solid #2b241c;line-height:1.3;text-shadow:none}
.lbl-loss small{display:block;font-family:"Source Serif 4",Georgia,serif;font-style:italic;font-size:10.5px;color:#5c554b}
.lbl-loss.other{border-color:#8d8577;color:#5c554b;border-style:dashed}
.lbl-loss.his{border-color:#b3362b;color:#b3362b}
.lbl-base{font-size:14px;font-weight:700;color:#2b241c;padding-left:10px}
.lbl-base small{display:block;font-size:10.5px;font-style:italic;font-weight:400;color:#6f675c}
.hid{display:none}
.topbtns{position:absolute;left:18px;top:58px;display:flex;gap:6px;flex-wrap:wrap}
.chap{font-size:13px;line-height:1.5}
.chap p{margin:0 0 8px}
.src{font-size:11px;color:#6f675c;line-height:1.4;margin:10px 0 0;font-style:italic}
.ovrow{display:flex;gap:6px;align-items:center;padding:5px 0;border-top:1px solid #e4dcc9;font-size:12.5px}
.ovrow .y{font-family:"IBM Plex Mono",monospace;font-size:11px;color:#6f675c;min-width:42px}
.ovrow .btn{margin-left:auto}
.note{font-size:11.5px;color:#6f675c;font-style:italic}
.names{list-style:none;margin:10px 0 4px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:5px 14px}
.names li{font-size:12.5px;line-height:1.3;padding:3px 0;border-bottom:1px solid #e4dcc9}
.names .nm{display:block;font-weight:600}
.names .nm.me{color:#b3362b}
.names .np{display:block;font-size:11px;color:#6f675c;font-style:italic}
.names.one{grid-template-columns:1fr}
.roll{list-style:none;margin:8px 0 0;padding:0}
.roll li{padding:9px 0 10px;border-top:1px solid #d9d0bb}
.roll .rd{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:#6f675c}
.roll .rs{font-size:15px;font-weight:600;margin:1px 0 2px}
.roll .rs i{font-weight:400;color:#5c554b}
.roll .rf{font-size:13px;line-height:1.5;color:#3a3127}
/* ---- header strip */
.top{position:absolute;left:18px;top:14px;display:flex;align-items:center;gap:10px;background:rgba(248,245,236,.94);border:1px solid #cfc5b1;padding:5px 6px 5px 12px;z-index:5}
.top .brand{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#2b241c;white-space:nowrap}
.top nav{display:flex;gap:4px}
/* ---- story column */
.story{position:absolute;top:0;right:0;bottom:0;width:min(480px,40vw);overflow-y:auto;overflow-x:hidden;z-index:4;scroll-behavior:auto;overscroll-behavior:contain}
.story:focus{outline:0}
.sprog{position:absolute;top:0;right:0;width:min(480px,40vw);height:3px;background:rgba(43,36,28,.12);z-index:6;pointer-events:none}
.sprog i{display:block;height:100%;background:#b3362b;transition:width .25s}
.spad{height:18vh}
.spad-end{height:52vh}
.scene{padding:0 22px 44vh}
.scene.first{padding-top:6vh}
.scene.last{padding-bottom:10vh}
.scard{background:rgba(248,245,236,.96);border:1px solid #cfc5b1;box-shadow:0 1px 0 #fff inset,0 3px 14px rgba(40,28,10,.16);padding:22px 24px 20px;transition:opacity .5s, transform .6s;opacity:.72;transform:translateY(0)}
.scene.on .scard{opacity:1}
.scene.dark .scard{background:rgba(26,22,18,.92);border-color:#4a4238;color:#efe8d6}
.scene.dark .stitle{color:#f8f5ec}
.scene.dark .sp{color:#e4dcc9}
.scene.dark .kick{color:#d98b7f}
.scene.dark .kick.grey{color:#a39b8c}
.scene.dark .quote{border-color:#6f675c;color:#efe8d6}
.scene.dark .quote .who,.scene.dark .note,.scene.dark .src,.scene.dark .fig figcaption,.scene.dark .names .np,.scene.dark .roll .rd{color:#a39b8c}
.scene.dark .names li,.scene.dark .roll li{border-color:#4a4238}
.scene.dark .roll .rs i,.scene.dark .roll .rf{color:#d9d0bb}
.scene.dark .roe{background:rgba(248,245,236,.08);border-color:#5f574c;color:#efe8d6}
.scene.dark .live{background:rgba(248,245,236,.1);color:#efe8d6}
.scene.dark .btn{background:transparent;color:#efe8d6;border-color:#8a7f6a}
.scene.dark .btn.pri{background:#b3362b;color:#fff}
.stitle{font-size:25px;line-height:1.15;font-weight:600;margin:2px 0 12px;color:#2b241c;letter-spacing:-.005em}
.stitle.big{font-size:30px}
.sp{font-size:15.5px;line-height:1.66;margin:0 0 12px;color:#2b241c;text-wrap:pretty}
.sp:last-child{margin-bottom:0}
.quote{margin:14px 0 14px;padding:4px 0 4px 16px;border-left:2px solid #b3362b;font-style:italic;font-size:16px;line-height:1.55;color:#2b241c}
.quote p{margin:0}
.quote .who{margin-top:6px;font-style:normal;font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:#6f675c;margin-top:6px}
.live{font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:#2b241c;background:#ece5d3;padding:7px 10px;margin:0 0 14px;display:flex;justify-content:space-between;gap:8px;align-items:center}
.live b{font-weight:500;color:#b3362b;white-space:nowrap}
.fig{margin:14px 0 6px}
.fig img{width:100%;display:block;border:1px solid #cfc5b1;background:#e9e2d0}
.fig figcaption{font-size:11.5px;line-height:1.4;color:#6f675c;margin:6px 0 0;font-style:italic}
.fig figcaption span{font-style:normal;font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;display:block;margin-top:2px}
.scard .src{margin-top:14px}
.scard .btnrow{margin-top:14px}
/* ---- immersive backdrop, vignette */
.bg{position:absolute;inset:0;background:#13100c;opacity:0;transition:opacity 1.5s ease;pointer-events:none;z-index:2;overflow:hidden}
.bg.on{opacity:1}
.bgimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.08);transition:opacity 1.9s ease, transform 32s linear;filter:sepia(.18) contrast(1.02)}
.bgimg.on{opacity:.92;transform:scale(1.17)}
.bgimg.none{display:none}
.bg:after{content:"";position:absolute;inset:0;background:linear-gradient(to top, rgba(10,8,6,.55), rgba(10,8,6,0) 34%),linear-gradient(to right, rgba(10,8,6,0) 50%, rgba(10,8,6,.28))}
.bgcap{position:absolute;left:22px;bottom:16px;max-width:min(520px,52vw);margin:0;font-size:12.5px;line-height:1.45;font-style:italic;color:#efe8d6;text-shadow:0 1px 3px rgba(0,0,0,.6);z-index:3}
.bgcap .credit{display:block;font-style:normal;font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:#cfc5b1;margin-top:3px}
.vignette{position:absolute;inset:0;pointer-events:none;z-index:1;opacity:0;transition:opacity 2.6s ease;background:radial-gradient(ellipse at 40% 50%, rgba(20,16,10,.18) 20%, rgba(20,16,10,.78) 100%)}
.vignette.on{opacity:1}
/* ---- cover */
.cover{position:absolute;inset:0;z-index:7;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% 60%, rgba(0,0,0,.1), rgba(0,0,0,.55));animation:coverin 2.4s ease both}
@keyframes coverin{from{opacity:0}to{opacity:1}}
.cover-in{max-width:720px;padding:32px 36px;text-align:center;color:#f8f5ec;animation:riseup 2.2s ease .4s both}
@keyframes riseup{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.cover .kick{color:#cfc5b1;margin-bottom:18px}
.cover h1{font-size:48px;line-height:1.05;font-weight:600;letter-spacing:.02em;text-transform:uppercase;margin:0 0 22px;color:#f8f5ec;text-shadow:0 2px 12px rgba(0,0,0,.4)}
.cover .ded{font-size:18px;line-height:1.55;font-style:italic;color:#efe8d6;margin:0 auto 26px;max-width:560px;text-shadow:0 1px 6px rgba(0,0,0,.5)}
.cover .ded b{font-style:normal;font-weight:600}
.cover .btnrow{justify-content:center;gap:12px}
.cover .cap{color:#cfc5b1;margin-top:34px;font-size:11.5px}
/* ---- small screens */
.shandle{display:none}
/* A real phone browser: the app is the height of the visible viewport (100vh also counts the space under the browser's
   toolbars, which would put the foot of the story behind them); the page itself never bounces or pulls to refresh, so
   only the story and the map move under a finger; text keeps its size when the phone is turned. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
html,body{overscroll-behavior:none}
@supports (height:100dvh){ .app{height:100dvh !important} }
.cover{touch-action:none}
/* With no photograph for the cover (the archive site holds some back until their owners agree), the cover still sits on
   the dark ground of the backdrop, not on the pale map and its labels, so its white type keeps its contrast. */
.app.cover-on .bg{opacity:1}
/* Story pictures keep their space before they load (3:2 until the real proportions are known, or the proportions the
   data gives), so nothing below them moves while it is being read; one not yet loaded is an empty space, not alt text. */
.fig img{aspect-ratio:auto 3 / 2}
.fig img[src=""],.fig img:not([src]){opacity:0}
@media (pointer:coarse){ .top .btn.sm{min-height:36px} .scard .btn{min-height:44px} }
@media (max-width:900px){
  .title-card{left:12px;right:12px;top:58px;width:auto;max-height:34vh}
  .crew-card{display:none}
  .topbtns{left:12px;top:auto;bottom:112px}
  .panel{left:12px;right:12px;top:auto;bottom:112px;width:auto;max-height:46vh}
  .record{left:12px;right:12px;top:auto;bottom:112px;width:auto;max-height:40vh;overflow:auto}
  .tl{left:12px;right:12px;bottom:8px}
  .maplibregl-ctrl-bottom-right{bottom:112px}
  .story-mode .maplibregl-ctrl-bottom-right{display:none}
  .scard{padding:18px 18px 16px;background:#f8f5ec}
  .scene.dark .scard{background:#1a1612}
  .stitle{font-size:22px}
  .sp{font-size:15px}
  .top{left:12px;top:10px;padding-left:10px}
  .top .brand{display:none}
  .cover h1{font-size:30px}
  .cover .ded{font-size:15.5px}
  .cover-in{padding:20px}
  .bgcap{max-width:calc(100% - 44px);bottom:auto;top:12vh;left:22px;font-size:11.5px}
  .app.cover-on .bgcap{display:none}
  .names{grid-template-columns:1fr}
}
/* ---- a phone held upright: the story is a sheet docked at the foot of the screen (--sheet is its height); the map,
   the photographs and the vignette keep the part above it, and the camera is padded to match. Drag or tap the handle. */
@media (max-width:900px) and (orientation:portrait){
  .app{--sheet:46vh}
  .app.sheet-low{--sheet:15vh}
  .app.sheet-tall{--sheet:84vh}
  @supports (height:100dvh){ .app{--sheet:46dvh} .app.sheet-low{--sheet:15dvh} .app.sheet-tall{--sheet:84dvh} }
  .story{top:auto;bottom:0;left:0;right:0;width:100%;height:var(--sheet);background:#efe9db;border-top:1px solid #cfc5b1;box-shadow:0 -4px 18px rgba(40,28,10,.18);transition:height .35s ease;scroll-snap-type:y mandatory;scroll-padding-top:50px}
  .sprog{top:auto;bottom:var(--sheet);width:100%;transition:bottom .35s ease}
  .shandle{display:flex;position:sticky;top:0;z-index:3;width:100%;height:40px;margin:0;padding:0;border:0;border-bottom:1px solid #e4dcc9;background:#efe9db;align-items:center;justify-content:center;touch-action:none;cursor:grab}
  .shandle i{display:block;width:40px;height:5px;border-radius:3px;background:#a39b8c}
  .spad{height:10px}
  .spad-end{height:24px}
  /* one section per page of the sheet: a card is at least a sheet tall, and the sheet snaps so its top sits under the handle.
     Each card ends in a run-out (a blank end zone with a thin rule) that still belongs to it, so the last picture can be
     brought fully into view with slack below it, and moving on to the next section takes a further, deliberate scroll. */
  .scene{padding:0 12px 0;min-height:calc(var(--sheet) - 50px);scroll-snap-align:start}
  .scene::after{content:"";display:block;height:calc(var(--sheet) * .45);background:linear-gradient(#a39b8c,#a39b8c) center 22px / 36px 1px no-repeat}
  .scene.first{padding-top:0}
  .scene.last{padding-bottom:28px}
  .scene.last::after{display:none}
  .scard{box-shadow:0 1px 0 #fff inset,0 2px 8px rgba(40,28,10,.10);opacity:.6}
  .scene.on .scard{opacity:1}
  .app.sheet-drag .story{scroll-snap-type:none}
  .bg{bottom:var(--sheet);transition:opacity 1.5s ease, bottom .35s ease}
  .vignette{bottom:var(--sheet);transition:opacity 2.6s ease, bottom .35s ease;background:radial-gradient(ellipse at 50% 50%, rgba(20,16,10,.18) 20%, rgba(20,16,10,.78) 100%)}
  .bgcap{top:auto;bottom:12px;left:16px;max-width:calc(100% - 32px)}
  .story-mode .maplibregl-ctrl-bottom-left{bottom:calc(var(--sheet) + 6px)}
  .app.sheet-drag .story,.app.sheet-drag .sprog,.app.sheet-drag .bg,.app.sheet-drag .vignette{transition:none}
  .app.cover-on .bg,.app.cover-on .vignette{bottom:0}
  .app.cover-on .bgcap{display:none}
}