/* /FLOW/: the app screens from the video (frames f-12_5 to f-26_2), on the real pages' ids and behavior.
   Tokens come from ../goyo-video-theme.css (html[data-vtheme]). */
html[data-vtheme] main#main .vg-card>h2:first-child,html[data-vtheme] main#main .vg-card h2#p2h{margin:0 0 6px}
html[data-vtheme] main#main .vg-sub{margin:0 0 18px}
.gatecard{max-width:720px;margin:24px auto}
.gatecard h1{margin-bottom:10px}

/* add the papers: the card from f-12_5 */
.upcard{max-width:1200px;margin-left:auto;margin-right:auto}
.drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:240px;border:4px dashed var(--gv-mint-line);border-radius:12px;background:var(--gv-mint-2);padding:28px 16px;text-align:center;cursor:pointer;margin:6px 0 16px}
.drop[hidden]{display:none}
.drop b{font:700 28px/1.2 var(--f-ui);color:var(--gv-teal-ink)}
.drop span{font-size:19px;color:var(--gv-ink-2)}
.drop.over{background:var(--gv-tint);border-color:var(--gv-teal)}
.photo-buttons{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 14px}
.btn-photo{flex:1 1 200px;display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:10px 18px;border:2px solid var(--gv-field);border-radius:10px;background:#fff;color:var(--gv-teal-ink);font:700 19px/1.25 var(--f-ui);cursor:pointer}
.btn-photo:hover{border-color:var(--gv-teal);background:var(--gv-mint-2)}
.btn-photo span{font-size:19px}
@media(min-width:900px){.photo-buttons{flex-wrap:nowrap}.btn-photo{flex:0 1 auto;min-height:52px;font-size:18px}.btn-photo span{font-size:18px}}
.chips{display:flex;flex-wrap:wrap;gap:12px;margin:4px 0 10px}
.chip{display:inline-flex;flex-wrap:wrap;align-items:center;gap:8px 10px;max-width:100%;padding:10px 16px;border-radius:12px;background:#fff;box-shadow:0 4px 14px rgba(0,0,0,.08);border:1px solid var(--gv-div);font:700 19px/1.3 var(--f-ui);color:var(--gv-ink)}
.chip i{font-style:normal}
.chip .n{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:260px}
.chip .pct{color:var(--gv-ink-2);font-weight:400;font-size:18px}
.rmbtn{min-height:48px;min-width:48px;padding:6px 14px;border:2px solid var(--gv-field);border-radius:12px;background:#fff;color:var(--gv-teal-ink);font:700 18px/1 var(--f-ui);cursor:pointer}
.rmbtn:hover{border-color:var(--gv-teal)}
.rmbtn.yes{background:var(--gv-bad-ink);border-color:var(--gv-bad-ink);color:#fff}
.rmask{font-size:18px;font-weight:700;color:var(--gv-ink)}
.fbar{height:14px;border-radius:7px;background:var(--gv-skel);overflow:hidden;margin:14px 0 0}
.fbar[hidden]{display:none}
.fbar i{display:block;height:100%;width:0;background:var(--gv-teal);border-radius:7px;transition:width 1s linear}
.st{margin:12px 0 0;font:700 20px/1.4 var(--f-ui);color:var(--gv-ink-2)}
.st.ok{color:var(--gv-teal-ink)}
.st.bad{color:var(--gv-bad-ink)}

/* the stay, with the finding cards beside it: f-16_9 */
.stayrow{display:grid;gap:24px;grid-template-columns:1fr;align-items:start}
@media(min-width:1000px){.stayrow{grid-template-columns:minmax(0,1.45fr) minmax(0,1fr)}}
.stayrow>.vg-card{margin:0}
.stayrow{margin:0 0 24px}
#finds:empty{display:none}
#finds .vg-flag:last-child{margin-bottom:0}
.day{display:grid;grid-template-columns:96px minmax(0,1fr);gap:16px;align-items:start;padding:12px 16px;border-radius:12px;font-size:19px;line-height:1.45}
.day>b{font:700 19px/1.45 var(--f-ui);color:var(--gv-ink-2)}
.day .t{color:var(--gv-ink)}
.day .m{color:var(--gv-ink-2);font-size:18px;margin-top:2px}
.day.warn{background:var(--gv-warn)}
.day.bad{background:var(--gv-bad)}
.day.bad>b{color:var(--gv-bad-ink)}
.day+.day{margin-top:4px}
@media(max-width:520px){.day{grid-template-columns:1fr;gap:2px;padding:12px}}

/* check what goyo read, and the place: two cards side by side */
.tworow{display:grid;gap:24px;grid-template-columns:1fr;align-items:start;margin:0 0 24px}
@media(min-width:1000px){.tworow{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.tworow>.vg-card{margin:0}
.lbl{display:block;font:700 19px/1.3 var(--f-ui);margin:16px 0 8px;color:var(--gv-ink)}
.grid2{display:grid;gap:12px;grid-template-columns:1fr 1fr}
@media(max-width:420px){.grid2{grid-template-columns:1fr}}
#placeedit input,#placeedit select{width:100%}
#facsaid{margin-top:12px}
.cq{margin:0 0 20px}
.cq:last-child{margin-bottom:0}
.cqlabel{font:700 20px/1.3 var(--f-ui);color:var(--gv-ink);margin:0 0 10px}
.ccards{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:480px){.ccards{grid-template-columns:1fr}}
.ccard{min-height:56px;padding:14px 16px;border:2px solid var(--gv-field);border-radius:12px;background:#fff;color:var(--gv-ink);font:700 19px/1.3 var(--f-ui);cursor:pointer;text-align:left}
.ccard small{display:block;font:400 18px/1.3 var(--f-ui);color:var(--gv-ink-2);margin-top:2px}
.ccard.on{border-color:var(--gv-teal);background:var(--gv-mint)}
.ccard.pre{cursor:default}
.ccard.ghost{color:var(--gv-ink-2);border-style:dashed}
.csel{display:block;font:700 18px/1.3 var(--f-ui);color:var(--gv-teal-ink);margin-bottom:2px}
.cbtns{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.cbtn{min-height:52px;min-width:48px;padding:10px 20px;border:2px solid var(--gv-teal);border-radius:10px;background:var(--gv-teal);color:#fff;font:700 18px/1.2 var(--f-ui);cursor:pointer}
.cbtn.sec{background:#fff;color:var(--gv-teal-ink);border-color:var(--gv-field)}
.cbtn.on,.cbtn.sec.on{background:var(--gv-mint);border-color:var(--gv-teal);color:var(--gv-teal-ink)}
.cqnote{margin:8px 0 0;font-size:18px;color:var(--gv-ink-2)}
.clink{min-height:48px;padding:4px 2px;border:0;background:none;color:var(--gv-teal-ink);font:700 18px/1.3 var(--f-ui);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.cfix{display:block;width:100%;margin-top:10px}
.cchips{display:flex;gap:10px;flex-wrap:wrap}
.cchip{min-height:52px;padding:10px 18px;border:2px solid var(--gv-field);border-radius:10px;background:#fff;color:var(--gv-ink);font:700 18px/1.2 var(--f-ui);cursor:pointer}
.cchip.on{border-color:var(--gv-teal);background:var(--gv-mint);color:var(--gv-teal-ink)}
.cchip.ghost{color:var(--gv-ink-2);border-style:dashed}
.cmissing ul{list-style:none;margin:0;padding:0}
.cmissing li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0;border-top:1px solid var(--gv-div);font-size:18px}
.cmissing li:first-child{border-top:0}
.cdet{margin-top:28px;padding-top:20px;border-top:1px solid var(--gv-div)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* what do you need: five full-width rows, a 30px box on the left, 72px high. Selected is a checked box, a teal ring and mint, never colour alone. */
.choices{display:grid;grid-template-columns:minmax(0,1fr);gap:0;margin:12px 0 8px;border-top:1px solid var(--gv-div)}
.choice{display:flex;align-items:center;gap:16px;width:100%;min-height:72px;text-align:left;padding:14px 12px;border:0;border-bottom:1px solid var(--gv-div);border-radius:0;background:#fff;color:var(--gv-ink);font-family:var(--f-ui);cursor:pointer;grid-column:1/-1}
.choice:hover{background:var(--gv-mint-2)}
.choice:active{transform:scale(.995)}
.choice .box{width:30px;height:30px;flex:none;border:2px solid var(--gv-tick);border-radius:6px;display:inline-flex;align-items:center;justify-content:center;color:#fff;font:700 18px/1 var(--f-ui)}
.choice .ct b{display:block;font:700 21px/1.3 var(--f-ui)}
.choice .ct small{display:block;font:400 18px/1.4 var(--f-ui);color:var(--gv-ink-2);margin-top:2px}
.choice[aria-pressed=true]{background:var(--gv-mint);box-shadow:inset 0 0 0 2px var(--gv-teal)}
.choice[aria-pressed=true] .box{background:var(--gv-teal);border-color:var(--gv-teal)}
.choice[aria-pressed=true] .box::after{content:"\2713"}
.exlink{grid-column:1/-1;justify-self:start;min-height:48px;margin:0 0 0 58px;padding:0 4px;border:0;background:none;color:var(--gv-teal-ink);font:700 18px/1.3 var(--f-ui);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.exlink:hover{text-decoration-thickness:2px}
.choice.has-ex{border-bottom:0}
.exlink{border-bottom:1px solid var(--gv-div);width:100%;text-align:left;margin:0;padding:0 0 8px 58px;min-height:48px;background:#fff}
@media(max-width:560px){.choice{min-height:72px}}
.wordslbl{margin-top:24px}
.opt{font-weight:400;color:var(--gv-ink-2)}
textarea#words{width:100%;min-height:96px}
.askcard .actions{margin-top:20px}
#p1msg{margin-top:10px}

/* page 2: who has to answer (f-19_9), then your documents (f-21, f-22) */
.hd2{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}
#rows{margin:4px 0 0}
#rows.offs .row{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:18px;align-items:start;padding:16px 0;border-bottom:1px solid var(--gv-div)}
#rows.offs .row:last-child{border-bottom:0}
.row .ic{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;background:var(--gv-tint);color:var(--gv-teal-ink);font:700 19px/1 var(--f-ui)}
.row .o{display:none}
.row h3{margin:0;font:700 21px/1.3 var(--f-ui);color:var(--gv-ink)}
.row .d{color:var(--gv-ink-2);font-size:18px;margin-top:2px}
.row .f{font-size:18px;margin-top:4px;color:var(--gv-ink-2)}
.row .f.ok{color:var(--gv-teal-ink);font-weight:700}
.row .f.warn{color:#6b4c00;font-weight:700}
.row .act{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px 10px;max-width:100%}
.row .act>*{max-width:100%;min-width:0}
.ch{display:inline-flex;align-items:center;min-height:34px;padding:4px 12px;border-radius:6px;background:var(--gv-tint);color:var(--gv-teal-ink);font:700 18px/1.2 var(--f-ui);white-space:nowrap}
.row .btn.small{min-height:48px;font-size:18px;padding:8px 16px}
.due{font:700 19px/1.3 var(--f-ui);color:var(--gv-ink-2);text-align:right}
.due small{display:block;font-weight:400;font-size:18px;color:var(--gv-ink-2)}
@media(max-width:600px){#rows.offs .row{grid-template-columns:44px minmax(0,1fr)}#rows.offs .row .act{grid-column:1/-1;justify-content:flex-start}}
/* document cards */
#rows.docs{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:20px;margin-top:18px}
#rows.docs .row{display:flex;flex-direction:column;gap:10px;padding:22px;border:2px solid var(--gv-doc);border-radius:12px;background:#fff;min-width:0}
#rows.docs .row .bd{display:contents}
#rows.docs .row .ic,#rows.docs .row .d{display:none}
#rows.docs .row .o{display:block;order:1;font:600 18px/1.3 var(--f-ui);color:var(--gv-ink-2)}
#rows.docs .row h3{order:2;font-size:22px;line-height:1.2}
#rows.docs .row .act{order:3;justify-content:flex-start;flex-direction:row}
#rows.docs .row .sk{order:4;display:grid;gap:12px;margin:6px 0 4px}
#rows.docs .row .sk i{display:block;height:9px;border-radius:5px;background:var(--gv-skel)}
#rows.docs .row .sk i.s{width:60%}
#rows.docs .row .f{order:5;margin-top:auto;font-size:19px}
#rows.docs .row .script{order:6}
#rows.docs .row.ready,#rows.docs .row.sent{border-color:var(--gv-teal);background:var(--gv-mint-2)}
#rows.docs .row .act .due{text-align:left}
.row .script{grid-column:1/-1;margin-top:6px}
#rows.offs .row.ready,#rows.offs .row.sent{background:var(--gv-mint-2)}
/* what happens next: f-26_2 */
#track{margin:6px 0 4px}
.remrow{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:22px;font:700 22px/1.3 var(--f-ui)}
.remrow span{font-weight:400;font-size:19px;color:var(--gv-ink-2)}
#remn{display:inline-flex;align-items:center;justify-content:center;min-width:56px;min-height:52px;padding:0 14px;border-radius:10px;background:var(--gv-teal);color:#fff}
.pm{width:52px;height:52px;border-radius:10px;border:2px solid var(--gv-teal);background:#fff;color:var(--gv-teal-ink);font:700 24px/1 var(--f-ui);cursor:pointer}
.pm:hover{background:var(--gv-mint-2)}

/* sheets: the letter and the note picker */
.sheet{position:fixed;inset:0;background:rgba(19,32,47,.55);display:flex;align-items:flex-end;justify-content:center;z-index:70;padding:0}
@media(min-width:700px){.sheet{align-items:center;padding:20px}}
.pane{background:#fff;color:var(--gv-ink);width:100%;max-width:820px;max-height:92vh;overflow:auto;border-radius:12px 22px 0 0;padding:22px 24px 18px;box-shadow:var(--gv-lift)}
@media(min-width:700px){.pane{border-radius:12px}}
.pane .hd{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.pane .kick{font:700 18px/1.3 var(--f-ui);color:var(--gv-teal-ink);margin-bottom:2px}
html[data-vtheme] main#main .pane h2{margin:0;font-size:24px}
.pane .x{border:0;background:none;font-size:32px;line-height:1;cursor:pointer;color:var(--gv-ink-2);width:48px;height:48px;border-radius:12px}
.pane .x:hover{background:var(--gv-room)}
#shText{width:100%;font:19px/1.55 var(--f-ui);padding:14px;margin-top:10px;white-space:pre-wrap}
.pane .ft{display:flex;gap:10px;justify-content:flex-end;align-items:center;flex-wrap:wrap;margin-top:12px}
.pane .ft .fine{margin-right:auto}
.pane .fine,.pane .shnotice,.pane .btn,.pane label{font-size:18px}
.pane .btn{min-height:48px}
.shnotice{background:var(--gv-room);color:var(--gv-ink);border-radius:10px;padding:12px 16px;margin:10px 0;font-size:18px;line-height:1.5}
.shbar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:10px 0;font-size:18px;font-weight:700}
.shtools{justify-content:flex-start}
a.btn#shDl{display:inline-flex;align-items:center;text-decoration:none}
html[data-vtheme] main#main .paper{background:#fff;color:var(--gv-ink);font:20px/1.6 var(--f-ui);max-width:36em;margin:12px auto;padding:26px 24px;border:2px solid var(--gv-doc);border-radius:12px;box-shadow:none;overflow-wrap:anywhere}
.paper:focus{outline:3px solid var(--gv-teal);outline-offset:3px}
.paper .lb{margin:0 0 1.1em;font-size:20px;white-space:normal}
.paper .lb.date{text-align:right}
.paper .lb.list{padding-left:.5em}
.paper .lb.sig{margin-bottom:.1em}
.paper .lb.close{margin-bottom:1.6em}
.bl{display:inline-block;min-height:48px;padding:6px 14px;margin:2px 0;border:2px solid var(--gv-flag-line);border-radius:12px;background:var(--gv-flag);color:var(--gv-ink);font:700 20px/1.3 var(--f-ui);cursor:pointer;text-align:left;max-width:100%}
.bl.att.done{background:var(--gv-mint);border-color:var(--gv-teal)}
html[data-vtheme] main#main .bled{background:var(--gv-room);color:var(--gv-ink);border:2px solid var(--gv-teal);border-radius:10px;padding:14px;margin:0 0 1.1em;font:18px/1.5 var(--f-ui)}
.bled .bl-q{display:block;font-weight:700;font-size:20px;margin-bottom:8px}
.bled input{width:100%;min-height:52px;font:20px/1.3 var(--f-ui);padding:8px 12px;box-sizing:border-box}
.bled .bl-btns{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
@media print{
  body>*:not(main),main#main>*:not(#sheet){display:none!important}
  .sheet{position:static!important;background:none!important;display:block!important;padding:0!important}
  .pane{max-height:none!important;overflow:visible!important;padding:0!important;border-radius:0!important;box-shadow:none!important;background:#fff!important}
  .pane>*:not(#paper){display:none!important}
  .paper{box-shadow:none;max-width:none;margin:0;padding:0;background:#fff;border:0!important}
  .bl{border:0;border-bottom:1px solid #000;border-radius:0;background:none;min-height:0;padding:0 4em 0 0;color:transparent}
  .bl span{display:none}
  .bl.att.done{display:none}
}

/* note picker */
#pick{z-index:75}
#pick .pane,#pick .pane *{font-size:18px}
html[data-vtheme] main#main #pick h2{font-size:22px}
#pick .pkgrp{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:10px 0}
#pick .pkgl{font-weight:700;margin-right:4px}
#pick .pkchip{min-height:48px;padding:8px 14px;border:2px solid var(--gv-field);border-radius:12px;background:#fff;color:var(--gv-ink);font-family:var(--f-ui);font-weight:700;cursor:pointer}
#pick .pkchip.on{background:var(--gv-mint);border-color:var(--gv-teal);color:var(--gv-teal-ink)}
#pick .pkbtns{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0}
#pick .pksearch{margin:10px 0}
#pick .pksearch label,#pick .pkfld label{display:block;font-weight:700;margin-bottom:6px}
#pick input[type=text],#pick textarea{width:100%;box-sizing:border-box;min-height:48px}
#pick .pkfld{margin:14px 0}
#pick .pklist{list-style:none;margin:10px 0;padding:0;display:grid;gap:10px}
#pick .pkcard{border:2px solid var(--gv-doc);border-radius:12px;padding:8px}
#pick .pkcard.on{border-color:var(--gv-teal);background:var(--gv-mint)}
#pick .pksel{display:block;width:100%;text-align:left;min-height:48px;padding:8px 10px;border:0;background:none;color:var(--gv-ink);font-family:var(--f-ui);cursor:pointer}
#pick .pksel>*{display:block}
#pick .pkst{font-weight:700;color:var(--gv-teal-ink)}
#pick .pkq{margin-top:4px;overflow-wrap:anywhere}
#pick .pkcard .pg{display:inline-block;min-height:48px;line-height:48px;padding:0 10px}
#pick .pkbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;margin-top:14px;position:sticky;bottom:0;background:#fff;padding:10px 0}
#pick .pkcount{font-weight:700}
#pick .pkempty{margin:12px 0}
#pick .pkconf,#pick .pkundo{background:var(--gv-room);border:0;border-radius:10px;padding:12px 16px;margin:12px 0}
#pick button:disabled{opacity:.6}
.row .btn.small[data-pick]{min-height:48px;font-size:18px}

/* photo capture */
.photo-preview{display:none;margin:10px 0;padding:14px;background:var(--gv-room);border-radius:12px}
.photo-preview:not([hidden]){display:block}
.photo-hint{font-size:18px;color:var(--gv-ink-2);margin:0 0 12px}
.photo-counter{font-size:18px;font-weight:700;color:var(--gv-ink);margin:0 0 12px}
.photo-thumbnails{display:flex;flex-wrap:wrap;gap:12px;margin:12px 0}
.photo-thumb{position:relative;width:80px;height:100px;border:2px solid var(--gv-doc);border-radius:10px;overflow:hidden;background:#fff}
.photo-thumb img{width:100%;height:100%;object-fit:cover}
.photo-thumb-btns{position:absolute;inset:0;background:rgba(19,32,47,.85);opacity:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;transition:opacity .2s;padding:4px}
.photo-thumb:hover .photo-thumb-btns,.photo-thumb:focus-within .photo-thumb-btns{opacity:1}
.photo-action-btn{min-height:48px;min-width:48px;padding:4px 12px;border:2px solid #fff;border-radius:6px;background:transparent;color:#fff;font:700 18px/1 var(--f-ui);cursor:pointer}
.photo-actions{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.portal-steps{display:flex;flex-direction:column;gap:12px;margin:12px 0}
.portal-step{display:flex;align-items:flex-start;gap:14px;padding:14px;background:var(--gv-room);border-radius:10px}
.portal-step-num{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:var(--gv-tint);color:var(--gv-teal-ink);border-radius:50%;font-weight:700;font-size:18px;flex:none}
.portal-step p{margin:0;font-size:18px;color:var(--gv-ink);line-height:1.4}
@media(max-width:480px){.photo-thumb{width:70px;height:90px}.btn-photo{flex:1 1 100%}}
/* specificity fixes against the theme's general type rules */
html[data-vtheme] main#main .row h3{margin:0}
html[data-vtheme] main#main #remn{color:#fff}
html[data-vtheme] main#main .vg-trow .dl{border:0;background:none;padding:0;margin:0;box-shadow:none}
#rows.docs .row .script{max-height:340px;overflow:auto;font-size:18px}
#rows.docs .row:has(.script){grid-column:span 2}
@media(max-width:600px){#rows.docs .row:has(.script){grid-column:auto}}

/* ---------- seven screens: one at a time (body[data-step]; each card lists its steps in data-v) ---------- */
body[data-step="1"] [data-sv]:not([data-sv~="1"]),body[data-step="2"] [data-sv]:not([data-sv~="2"]),body[data-step="3"] [data-sv]:not([data-sv~="3"]),body[data-step="4"] [data-sv]:not([data-sv~="4"]),body[data-step="5"] [data-sv]:not([data-sv~="5"]),body[data-step="6"] [data-sv]:not([data-sv~="6"]),body[data-step="7"] [data-sv]:not([data-sv~="7"]),body[data-step="7b"] [data-sv]:not([data-sv~="7b"]){display:none!important}
.flowbar{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:1200px;margin:0 auto 12px;min-height:48px}
.flowbar[hidden]{display:none}
.stepline{margin:0;font:700 18px/1.3 var(--f-ui);color:var(--gv-ink-2)}
.flowbar .btn[hidden]{display:none}
html[data-vtheme] main#main h2.stepttl{margin:0 0 14px;font:700 clamp(26px,3.4vw,34px)/1.2 var(--f-ui);color:var(--gv-ink)}
.upcard .actions{margin-top:18px}
.upcard #go1[hidden]{display:none}
#gate .sl{display:inline-flex;align-items:center;min-height:48px;font:700 19px/1.3 var(--f-ui);color:var(--gv-teal-ink);text-decoration:none}
#gate .sl:hover{text-decoration:underline}
.rmbtn.rmx{font-size:26px;line-height:1;padding:0;width:48px;border-color:transparent;background:transparent;color:var(--gv-ink-2)}
.rmbtn.rmx:hover{background:var(--gv-room);border-color:var(--gv-field)}
.confcard,.offcard,.askcard,.remind{max-width:1200px;margin-left:auto;margin-right:auto}
.confcard .actions{margin-top:22px}
.wordsbox{margin:18px 0 6px}
.wordsbox summary{display:inline-flex;align-items:center;min-height:48px;font:700 19px/1.3 var(--f-ui);color:var(--gv-teal-ink);cursor:pointer}
.wordsbox .wordslbl{margin-top:10px}
.placecard{margin:0 0 18px;padding:0 0 18px;border-bottom:1px solid var(--gv-div)}
.placeline{margin:0;font:400 21px/1.4 var(--f-ui);color:var(--gv-ink)}
.placeline .btn{margin-left:8px}
.placeline b{font-weight:700}
.placeline[hidden],#placeedit[hidden]{display:none}
.placecard .lbl:first-child{margin-top:0}
.detcard{margin:26px 0 8px;padding-top:20px;border-top:1px solid var(--gv-div)}
html[data-vtheme] main#main .dethd{margin:0 0 10px;font:700 22px/1.3 var(--f-ui);color:var(--gv-ink)}
.detcard .cdet{margin:0 0 14px}
.offcard>.actions{margin-top:22px}
.offcard>.actions[data-sv]{margin-top:22px}
/* send: panels, two across on a desktop, one on a phone */
#rows.sends{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;margin-top:18px}
#rows.sends .row.send{display:flex;flex-direction:column;gap:10px;padding:22px;border:2px solid var(--gv-doc);border-radius:12px;background:#fff;min-width:0}
#rows.sends .row.send .bd{display:contents}
#rows.sends .row.send .o{display:block;order:1;font:600 18px/1.3 var(--f-ui);color:var(--gv-ink-2)}
#rows.sends .row.send h3{order:2;font-size:22px;line-height:1.2}
#rows.sends .row.send .d,#rows.sends .row.send .arts,#rows.sends .row.send .f,#rows.sends .row.send .due{order:3}
#rows.sends .row.send .act{order:4;justify-content:flex-start;margin-top:auto}
#rows.sends .row.send .script{order:5}
#rows.sends .row.send.sent{border-color:var(--gv-teal);background:var(--gv-mint-2)}
#rows.sends .row.send .due{text-align:left}
.arts{display:flex;flex-wrap:wrap;gap:8px}
.art{display:inline-flex;align-items:center;min-height:34px;padding:4px 12px;border:2px solid var(--gv-field);border-radius:6px;background:#fff;font:700 18px/1.2 var(--f-ui);color:var(--gv-ink);overflow-wrap:anywhere}
.remind .actions{margin-top:24px}
.remind .btn.quiet{text-decoration:none}
@media(max-width:600px){.flowbar{margin-bottom:8px}#rows.sends{grid-template-columns:1fr}}

/* ---------- the ladders: start at any level, the answer tap, and 7b (no countdown, no colour-only state) ---------- */
.ladlink{margin:0 0 6px}
html[data-vtheme] main#main .ladlink .btn.quiet{padding-left:0;min-height:48px;font-size:19px;text-decoration:underline;text-underline-offset:3px}
.ladcard,.nxcard{max-width:1200px;margin-left:auto;margin-right:auto}
.ladcard[hidden]{display:none}
.ladlist{display:grid;gap:12px;margin:16px 0 8px}
.lbtn{display:block;width:100%;text-align:left;min-height:56px;padding:14px 18px;border:2px solid var(--gv-field);border-radius:10px;background:#fff;color:var(--gv-ink);font:700 20px/1.3 var(--f-ui);cursor:pointer}
.lbtn:hover{border-color:var(--gv-teal);background:var(--gv-mint-2)}
.lbtn b{display:block;font:700 20px/1.3 var(--f-ui)}
.lbtn small{display:block;font:400 18px/1.4 var(--f-ui);color:var(--gv-ink-2);margin-top:4px}
.ladcard .actions,.nxcard .actions{margin-top:20px;display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.ladstrip{list-style:none;margin:18px 0;padding:0;display:grid;gap:10px}
.ladstrip .lv{border:2px solid var(--gv-field);border-radius:10px;background:#fff;padding:14px 18px}
.ladstrip .lv.s-here{border-color:var(--gv-teal);background:var(--gv-mint);border-width:3px}
.ladstrip .lv.s-done,.ladstrip .lv.s-told{background:var(--gv-room)}
.ladstrip .lv.s-later{border-style:dashed}
.lv-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px}
.lv-ic{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;border:2px solid var(--gv-teal);font:700 18px/1 var(--f-ui);color:var(--gv-teal-ink);flex:none}
.lv.s-here .lv-ic{background:var(--gv-teal);color:#fff}
/* step circle: done filled, here filled with a ring, next open, later dashed */
.lv-ic{align-self:center}
.lv.s-done .lv-ic,.lv.s-told .lv-ic{background:var(--gv-teal)}
.lv.s-here .lv-ic{box-shadow:0 0 0 3px var(--gv-mint),0 0 0 5px var(--gv-teal)}
.lv.s-later .lv-ic{border-style:dashed}
.lv-n{font:700 18px/1.3 var(--f-ui);color:var(--gv-teal-ink)}
.lv-name{font:700 21px/1.3 var(--f-ui)}
.lv-st{margin-left:auto;font:700 18px/1.3 var(--f-ui);color:var(--gv-ink-2)}
.ladstrip p,.nxone p{margin:6px 0 0;font-size:19px;line-height:1.45}
.lv-off{color:var(--gv-ink-2);font-size:18px!important}
.lv-more>summary{min-height:48px;display:flex;align-items:center;font:700 18px/1.3 var(--f-ui);color:var(--gv-teal-ink);cursor:pointer}
.lv-due{margin:10px 0 0}
.lv-due .lv-d1{font:700 22px/1.3 var(--f-ui)!important;color:var(--gv-ink)}
.lv-due .lv-d2,.lv-min{font-size:18px!important;color:var(--gv-ink-2)}
.lv-short{font:700 19px/1.3 var(--f-ui)!important;color:var(--gv-bad-ink)}
.nxone{border:2px solid var(--gv-teal);border-radius:10px;background:var(--gv-mint);padding:14px 18px;margin:18px 0}
.dayq{margin:16px 0 4px}
.gbfield{position:relative;display:inline-block;margin-top:10px;min-width:220px}
.gbfield input{min-height:52px;padding:8px 14px;border:2px solid var(--gv-field);border-radius:12px;background:#fff;font:400 20px/1.2 var(--f-ui);color:var(--gv-ink);width:100%}
.gbfield.empty input{color:transparent}
.gbfield.empty input::-webkit-datetime-edit{color:transparent}
.gbfield .gbbar{display:none}
.gbfield.empty .gbbar{display:block;position:absolute;left:14px;top:50%;width:62%;height:14px;margin-top:-7px;border-radius:7px;background:var(--gv-skel);pointer-events:none}
.gbfield.empty input:focus{color:var(--gv-ink)}
.vg-trow .ans{flex:1 0 100%;display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.vg-trow .ans .btn{min-height:48px}
.vg-trow .vg-ans{font-weight:700;color:var(--gv-ink-2)}
@media(max-width:560px){.lv-st{margin-left:0;flex-basis:100%}.gbfield{display:block}.ladcard .actions .btn,.nxcard .actions .btn{flex:1 1 100%}}

.rung{margin:10px 0 0;padding:10px 14px;border-left:4px solid var(--gv-teal);background:#fff}
.rung p{margin:4px 0!important;font-size:18px!important}
.nxcard details.lv-more{margin:12px 0}

/* ---------- look 2: the step line, the rail and the title live in the blue band ---------- */
html[data-vtheme] .vt-in .flowbar{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px 12px;max-width:none;margin:0 0 12px;min-height:48px}
html[data-vtheme] .vt-in .flowbar .stepline{grid-column:1;grid-row:1}
html[data-vtheme] .vt-in .flowbar #back1{grid-column:2;grid-row:1;min-height:48px}
html[data-vtheme] .vt-in .flowbar .steprail{grid-column:1/-1;grid-row:2}
.steprail{list-style:none;display:flex;align-items:center;margin:0;padding:6px 0 0}
.steprail li{position:relative;flex:none;width:14px;height:14px;border-radius:50%;background:var(--mk-disc);box-shadow:0 0 0 2px rgba(201,214,228,.5)}
.steprail li+li{margin-left:30px}
.steprail li+li::before{content:"";position:absolute;right:100%;top:50%;width:30px;height:2px;margin-top:-1px;background:rgba(201,214,228,.45)}
.steprail li.done{background:#fff;box-shadow:0 0 0 2px #fff}
.steprail li.cur{box-shadow:0 0 0 2px #fff}
.steprail li.cur::after{content:"";position:absolute;left:50%;top:-12px;width:20px;height:7px;margin-left:-12px;border:2px solid var(--vb-gold);border-radius:50%}
html[data-vtheme] .vt-band .flowbar[hidden]{display:none}
/* sending and what happens next are plain solid blue; the letters screens are compact */
html[data-vtheme] body[data-step="6"] .vt-band,html[data-vtheme] body[data-step="7"] .vt-band,html[data-vtheme] body[data-step="7b"] .vt-band{background-image:none}
html[data-vtheme] body:is([data-step="5"],[data-step="6"]) .vt-band .steprail,html[data-vtheme] body:is([data-step="2"],[data-step="3"],[data-step="4"],[data-step="5"],[data-step="6"],[data-step="7"],[data-step="7b"]) #flowlede{display:none}
html[data-vtheme] body:is([data-step="5"],[data-step="6"]) .vt-band{padding-top:12px}
/* the finding card is a button: the whole card opens the page */
#finds button.vg-flag{width:100%;text-align:left;font:inherit;color:var(--gv-ink);cursor:pointer}
#finds button.vg-flag:hover{border-color:#a85d00}
.pg[data-ei]{vertical-align:baseline}
html.vt-lock{overflow:hidden}
/* the letter sheet and the note picker: white sheets, letters in the document font with the blue spine */
html[data-vtheme] main#main .paper{font-family:var(--f-doc);border:1px solid var(--gv-hair);border-left:4px solid var(--vb-sea);border-radius:6px}

/* livefix: stays, resume line, page notices, signer, approval reason */
.enc{border:1px solid var(--gv-div);border-radius:14px;padding:12px 14px;margin:0 0 12px;background:#fff}
.enc.sel{border-color:var(--gv-ink,#1E3650);box-shadow:0 4px 14px rgba(0,0,0,.08)}
.enchd{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 14px}
.enchd small{display:block;font-size:18px;color:var(--gv-ink-2)}
.encon{font-weight:700;font-size:18px}
.encdays>summary{cursor:pointer;font-size:18px;padding:8px 0;min-height:48px;display:flex;align-items:center}
.pgnote{margin:8px 0;padding:10px 14px;border-radius:10px;background:#FFF6E0;border:1px solid #E5C77A;font-size:18px}
.chip.ghost{opacity:.55}
.signer{margin:0 0 14px;display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center}
.signer label{font-weight:700;font-size:18px;flex:1 0 100%}
.signer input{flex:1 1 220px;min-height:48px;font-size:18px;padding:8px 12px}
.signer .fine{flex:1 0 100%;margin:0}
.shreason{margin:6px 0;font-size:18px}
.lets{font-weight:700}
@media print{.signer,.shreason{display:none!important}}
/* QA repeat: sources on dates, status words, cleaned finding lists */
.cchip.cdate{text-align:left;display:inline-flex;flex-direction:column;gap:2px}
.cchip small{display:block;font:400 14px/1.3 var(--f-ui);color:var(--gv-ink-2)}
.cchip .csug,.encsug,.gtag{font-weight:700}
.cstate{display:inline-block;margin-left:8px;padding:2px 10px;border-radius:6px;font:700 14px/1.4 var(--f-ui);border:2px solid var(--gv-field)}
.cstate.need{border-color:#9a5b00;color:#6b3f00;background:#fff4dc}
.cstate.ok{border-color:var(--gv-teal);color:var(--gv-teal-ink);background:var(--gv-mint)}
.gtag{display:inline-block;padding:0 8px;border-radius:6px;border:1px solid #9a5b00;color:#6b3f00;background:#fff4dc;font:700 13px/1.5 var(--f-ui)}
.cfinemore{margin-top:8px}
.cfinemore summary{cursor:pointer;font:700 16px/1.4 var(--f-ui);color:var(--gv-teal-ink)}
.pgs-err{border:2px solid var(--gv-field);border-radius:12px;padding:16px;margin:12px 0}
.badge-old,.badge-need{display:inline-block;padding:2px 10px;border-radius:6px;font:700 14px/1.4 var(--f-ui);border:2px solid #9a5b00;color:#6b3f00;background:#fff4dc;margin:0 6px 6px 0}
.badge-sent{display:inline-block;padding:2px 10px;border-radius:6px;font:700 14px/1.4 var(--f-ui);border:2px solid var(--gv-teal);color:var(--gv-teal-ink);background:var(--gv-mint);margin:0 6px 6px 0}

.rwcols{display:grid;grid-template-columns:1fr 1fr;gap:16px}.rwcols pre{white-space:pre-wrap;word-break:break-word;font:15px/1.5 var(--f-ui);max-height:50vh;overflow:auto;border:2px solid var(--gv-field);border-radius:10px;padding:12px;margin:0}@media(max-width:700px){.rwcols{grid-template-columns:1fr}}