/* PROJECT MAPLE: the end of a phase. The quiz and the portfolio. Design only, no words.
   Version 3, 5 October 2026. © 2026 Hublinko Limited */

:root{
  --coral:#E63946;--coral-dk:#c0202d;--navy:#1D3557;--navy-dk:#122440;
  --sage:#C8DEC8;--sage-bg:rgba(200,222,200,.32);--sage-faint:rgba(200,222,200,.16);
  --paper:#F5F6F8;--border:#E5E7EB;--grey:#6B7280;--ink:#2b3a52;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'DM Sans',system-ui,sans-serif;background:var(--paper);color:var(--navy);line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3,.serif{font-family:'DM Serif Display',Georgia,serif;font-weight:400;letter-spacing:-.5px;line-height:1.1}
h1 em,h2 em,h3 em{color:var(--coral);font-style:normal}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
img{display:block}

.mock{background:var(--navy-dk);color:#fff;padding:10px 20px}
.mock .lab{font-size:11px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;color:var(--sage)}
.nav{background:#fff;border-bottom:1px solid var(--border);height:80px;display:flex;align-items:center;padding:0 28px;gap:18px}
.nav img{height:52px;width:auto}
.nav .crumb{font-weight:800;font-size:15px;padding-left:18px;border-left:2px solid var(--border)}

.hero{background:var(--navy);color:#fff;padding:40px 28px 44px;position:relative;overflow:hidden}
.hero::before{content:'';position:absolute;width:420px;height:420px;border-radius:50%;background:rgba(230,57,70,.16);top:-150px;right:-110px}
.hero::after{content:'';position:absolute;width:300px;height:300px;border-radius:50%;background:rgba(255,255,255,.05);bottom:-170px;left:-90px}
.hero-in{max-width:1080px;margin:0 auto;position:relative;z-index:1}
.pill{display:inline-block;font-size:12px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;padding:9px 16px;border-radius:100px;margin:0 8px 14px 0}
.pill.soft{background:rgba(255,255,255,.12);color:var(--sage)}
.pill.hot{background:var(--coral);color:#fff}
.hero h1{font-size:clamp(40px,6vw,68px);letter-spacing:-1.5px}
.hero p{font-size:18px;color:rgba(255,255,255,.82);margin-top:8px;max-width:640px}

/* the four phases, as a row of steps */
.phases{display:flex;gap:10px;margin-top:26px;flex-wrap:wrap}
.ph{flex:1 1 200px;border-radius:16px;padding:14px 16px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18)}
.ph small{display:block;font-size:10.5px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--sage)}
.ph b{display:block;font-size:15px;line-height:1.3;margin-top:2px}
.ph.done{background:var(--sage);border-color:var(--sage);color:var(--navy)}
.ph.done small{color:var(--navy)}
.ph.next{border-color:var(--coral)}

.wrap{max-width:1080px;margin:0 auto;padding:30px 28px 90px}
.card{background:#fff;border:1.5px solid var(--border);border-radius:20px;padding:26px 28px;margin-bottom:22px}
.hd{display:flex;gap:16px;align-items:center;margin-bottom:14px}
.n{width:54px;height:54px;border-radius:14px;background:var(--coral);color:#fff;font-family:'DM Serif Display',serif;font-size:28px;display:flex;align-items:center;justify-content:center;flex:none}
.n.navy{background:var(--navy)}
.k{font-size:11.5px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;color:var(--grey)}
.hd h2{font-size:30px}
.lede{font-size:16px;color:var(--ink);max-width:720px}
.btn{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:15px;padding:13px 24px;border-radius:100px;background:var(--coral);color:#fff;text-decoration:none;transition:.15s}
.btn:hover{background:var(--coral-dk)}
.btn.navy{background:var(--navy)}
.btn.navy:hover{background:var(--navy-dk)}
.btn.line{background:#fff;color:var(--navy);border:1.5px solid var(--border)}
.btn.line:hover{border-color:var(--navy)}
.hide{display:none!important}

/* quiz */
.qbar{display:flex;gap:6px;margin:18px 0 20px}
.qbar i{flex:1;height:8px;border-radius:100px;background:var(--border)}
.qbar i.on{background:var(--navy)}
.qbar i.ok{background:var(--sage)}
.qbar i.no{background:var(--coral)}
.qk{font-size:11.5px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;color:var(--coral-dk)}
.qq{font-family:'DM Serif Display',serif;font-size:26px;line-height:1.2;margin:4px 0 16px;max-width:760px}
.opts{display:grid;gap:10px;max-width:760px}
.opt{text-align:left;font-size:16px;font-weight:600;padding:15px 18px;border-radius:14px;border:1.5px solid var(--border);background:#fff;transition:.15s;color:var(--navy)}
.opt:hover{border-color:var(--navy)}
.opt.right{background:var(--sage-bg);border-color:var(--sage)}
.opt.wrong{background:rgba(230,57,70,.07);border-color:var(--coral)}
.opt[disabled]{cursor:default}
.opt[disabled]:not(.right):not(.wrong){opacity:.55}
.why{max-width:760px;margin-top:14px;padding:14px 16px;border-radius:14px;background:var(--sage-faint);border:1.5px solid var(--sage);font-size:15.5px;color:var(--ink)}
.why b{color:var(--navy)}
.qnext{margin-top:16px}
.score{display:flex;gap:22px;align-items:center;flex-wrap:wrap}
.ring{width:112px;height:112px;border-radius:50%;background:var(--navy);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;flex:none}
.ring b{font-family:'DM Serif Display',serif;font-weight:400;font-size:38px;line-height:1}
.ring span{font-size:10.5px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--sage)}
.score h3{font-size:28px}
.score p{font-size:16px;color:var(--ink);max-width:560px;margin-top:4px}
.score .acts{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}

/* portfolio */
.pf-top{display:flex;gap:16px;align-items:flex-end;flex-wrap:wrap;margin-bottom:16px}
.pf-top h2{font-size:34px}
.pf-top .sp{flex:1}
.meter{min-width:240px}
.meter b{font-size:14px;font-weight:800}
.meter .bar{height:10px;border-radius:100px;background:var(--border);margin-top:6px;overflow:hidden}
.meter .bar i{display:block;height:100%;width:0;background:var(--coral);border-radius:100px;transition:width 1.2s ease}

.doc{background:#fff;border:1.5px solid var(--border);border-radius:20px;overflow:hidden;box-shadow:0 18px 50px rgba(29,53,87,.10)}
.cover{background:var(--navy);color:#fff;padding:38px 40px 34px;position:relative;overflow:hidden}
.cover::before{content:'';position:absolute;width:340px;height:340px;border-radius:50%;background:rgba(230,57,70,.18);top:-140px;right:-90px}
.cover>*{position:relative}
.cover .k{color:var(--sage)}
.cover h3{font-size:44px;letter-spacing:-1px;margin-top:6px}
.cover h3 em{color:var(--sage)}
.cover .by{margin-top:10px;font-size:15px;color:rgba(255,255,255,.8)}
.sec{padding:30px 40px;border-top:1.5px solid var(--border)}
.sec-h{display:flex;gap:12px;align-items:baseline;flex-wrap:wrap;margin-bottom:14px}
.sec-h .num{font-size:11.5px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;color:var(--coral-dk)}
.sec-h h4{font-family:'DM Serif Display',serif;font-weight:400;font-size:26px;letter-spacing:-.4px}
.sec-h .sp{flex:1}
.stamp{font-size:10.5px;font-weight:800;letter-spacing:1px;text-transform:uppercase;padding:5px 12px;border-radius:100px;background:var(--sage);color:var(--navy)}
.stamp.new{background:var(--coral);color:#fff}
.sec p{font-size:15.5px;color:var(--ink);max-width:760px}

.brief{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:6px}
.brief div{border:1.5px solid var(--border);border-radius:14px;padding:13px 15px}
.brief small{display:block;font-size:10.5px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--grey)}
.brief b{display:block;font-size:15.5px;line-height:1.35;margin-top:2px}
.brief .wide{grid-column:1 / -1;background:var(--sage-faint);border-color:var(--sage)}

.sec table{width:100%;border-collapse:collapse;font-size:14.5px;margin-top:4px}
.sec th{text-align:left;font-size:10.5px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--grey);padding:8px 10px;border-bottom:1.5px solid var(--navy)}
.sec td{padding:10px;border-bottom:1px solid var(--border);vertical-align:top;color:var(--ink)}
.sec td b{color:var(--navy)}
.themes{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.themes span{font-size:13.5px;font-weight:700;background:var(--paper);border:1.5px solid var(--border);border-radius:100px;padding:6px 14px}

.two{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:start}
.wheel{width:100%;max-width:430px;margin:0 auto}
.wheel text{font-family:'DM Sans',sans-serif}
.wlist{display:none;list-style:none;margin-bottom:18px}
.wlist li{display:flex;gap:10px;padding:9px 0;border-top:1px solid var(--border);font-size:15px;color:var(--ink)}
.wlist li:first-child{border-top:0}
.wlist b{flex:0 0 108px;font-size:12px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--coral-dk);padding-top:2px}
#confetti{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:50}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:8px;position:relative;margin:0 0 22px 22px}
.grid2 .box{border-radius:14px;padding:12px 14px;min-height:118px;border:1.5px solid var(--border);background:#fff}
.grid2 .box small{display:block;font-size:10.5px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--grey);margin-bottom:6px}
.grid2 .box.hot{background:rgba(230,57,70,.06);border-color:var(--coral)}
.grid2 .box.sage{background:var(--sage-faint);border-color:var(--sage)}
.chip{display:inline-block;font-size:12.5px;font-weight:700;background:var(--navy);color:#fff;border-radius:100px;padding:3px 10px;margin:0 4px 5px 0}
.ax{position:absolute;font-size:10.5px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--grey)}
.ax.y{left:-22px;top:50%;transform:rotate(-90deg) translateX(50%);transform-origin:left top;white-space:nowrap}
.ax.x{bottom:-22px;left:50%;transform:translateX(-50%)}

.stats{display:flex;gap:12px;flex-wrap:wrap;margin:4px 0 16px}
.stat{flex:1 1 150px;border-radius:16px;background:var(--navy);color:#fff;padding:14px 16px}
.stat b{display:block;font-family:'DM Serif Display',serif;font-weight:400;font-size:32px;line-height:1.1}
.stat span{display:block;font-size:10.5px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;color:var(--sage);margin-top:3px}
.seen{list-style:none}
.seen li{display:flex;gap:12px;padding:10px 0;border-top:1px solid var(--border);font-size:15px;color:var(--ink)}
.seen li:first-child{border-top:0}
.seen i{font-style:normal;font-size:10.5px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;border-radius:100px;padding:3px 10px;height:max-content;flex:none;margin-top:2px}
.seen i.s{background:var(--coral);color:#fff}
.seen i.t{background:var(--sage);color:var(--navy)}

.locked{background:var(--paper);color:var(--grey)}
.locked .sec-h h4{color:var(--grey)}
.locked .stamp{background:#fff;border:1.5px solid var(--border);color:var(--grey)}
.locked ul{display:flex;flex-wrap:wrap;gap:8px;list-style:none}
.locked li{font-size:13.5px;font-weight:700;border:1.5px dashed #c9ced6;border-radius:100px;padding:6px 14px}

/* each piece arrives one at a time */
.piece{opacity:0;transform:translateY(26px);transition:opacity .6s ease, transform .6s ease}
.piece.in{opacity:1;transform:none}

.onward{background:var(--navy);color:#fff;border-color:var(--navy);display:flex;gap:20px;align-items:center;flex-wrap:wrap;margin-top:22px}
.onward h3{font-size:28px}
.onward p{color:rgba(255,255,255,.82);font-size:16px;max-width:560px}
.onward .sp{flex:1}

@media (max-width:760px){
  .nav{height:64px;padding:0 16px}.nav img{height:40px}.nav .crumb{display:none}
  .hero{padding:28px 16px 30px}.wrap{padding:18px 14px 70px}
  .card{padding:20px 18px}.hd h2{font-size:25px}.qq{font-size:22px}
  .cover{padding:26px 20px}.cover h3{font-size:32px}.sec{padding:22px 18px}
  .brief{grid-template-columns:1fr}.two{grid-template-columns:1fr}
  .sec table,.sec tbody,.sec tr,.sec td{display:block;width:100%}.sec thead{display:none}
  .sec tr{border-bottom:1.5px solid var(--border);padding:8px 0}.sec td{border:0;padding:3px 0}
  .ph{flex:1 1 44%;padding:11px 12px}.ph b{font-size:14px}
  .opt{padding:16px}.btn{width:100%;justify-content:center}
  .score{gap:14px}.score .acts{width:100%}
  .pf-top h2{font-size:28px}.meter{min-width:0;width:100%}
  .sec-h h4{font-size:22px;width:100%}.sec-h .sp{display:none}
  .grid2{grid-template-columns:1fr;margin-left:0}.grid2 .box{min-height:0}.ax{display:none}
  .stat{flex:1 1 100%}
  .mock .lab,.ph small,.k,.qk,.ring span,.brief small,.sec-h .num,.stamp,.grid2 .box small,.stat span,.seen i{font-size:12px;letter-spacing:.6px}
  .chip,.themes span,.locked li{font-size:13.5px}
  .wheel{display:none}.wlist{display:block!important}.onward .sp{display:none}
}
@media print{
  .mock,.nav,.hero,#quizCard,.pf-top,.onward,.locked,#flow,.flow-rail,.flow-btn,.flow-shade,#bahub-billie-widget,#bahub-billie-fab,.bahub-support-footer,#confetti{display:none!important}
  body{background:#fff!important;padding:0!important;margin:0!important}.wrap{padding:0!important;max-width:none!important}
  .cover{break-inside:avoid}.gap-map{overflow:visible!important}.gap-map svg{width:100%!important}
  .doc{box-shadow:none;border:0}.piece{opacity:1;transform:none}
}

/* added for the real screens */
.nav .sp{flex:1}
.nav .tool{font-weight:700;font-size:14px;padding:9px 16px;border-radius:100px;border:1.5px solid var(--border);background:#fff;color:var(--navy);text-decoration:none}
.nav .tool:hover{border-color:var(--navy)}
.stamp.was{background:var(--sage);color:var(--navy)}
.gap-map{border:1.5px solid var(--border);border-radius:14px;overflow:hidden;background:#fff;margin-top:14px}
.gap-map svg{display:block}
.gap-map .ln{fill:none;stroke:#1D3557;stroke-width:2.5}
.slide{display:none;font-size:13px;color:var(--grey);margin-top:6px}
.note{font-size:13.5px;color:var(--grey);margin-top:10px}
.state{margin-top:8px;border:1.5px solid var(--sage);background:var(--sage-faint);border-radius:16px;padding:6px 18px}
.state div{padding:11px 0;border-top:1px solid var(--sage);font-size:16px;color:var(--ink)}
.state div:first-child{border-top:0}
.state b{display:block;font-size:12px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;color:var(--coral-dk)}
.stories{list-style:none;counter-reset:st;margin-top:6px}
.stories li{counter-increment:st;display:flex;gap:14px;padding:12px 0;border-top:1px solid var(--border);font-size:15.5px;color:var(--ink)}
.stories li:first-child{border-top:0}
.stories li::before{content:counter(st);flex:none;width:30px;height:30px;border-radius:10px;background:var(--navy);color:#fff;font-weight:800;font-size:14px;display:flex;align-items:center;justify-content:center}
.stories b{color:var(--navy)}
.stories small{display:block;font-size:12.5px;color:var(--grey);margin-top:2px}
.sub{font-size:12px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;color:var(--grey);margin:18px 0 4px}
.mos{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:10px}
.mos.four{grid-template-columns:repeat(4,1fr)}
.mos .col{border:1.5px solid var(--border);border-radius:16px;padding:14px;background:#fff}
.mos .col.must{border-color:var(--coral);background:rgba(230,57,70,.05)}
.mos .col.should{border-color:var(--navy)}
.mos .col.could{border-color:var(--sage);background:var(--sage-faint)}
.mos h5{font-family:'DM Serif Display',serif;font-weight:400;font-size:20px;margin-bottom:8px}
.mos h5 span{font-family:'DM Sans',sans-serif;font-size:12px;font-weight:800;color:var(--grey);margin-left:6px}
.mos p{font-size:14px;line-height:1.4;padding:8px 0;border-top:1px solid var(--border);color:var(--ink)}
.mos p:first-of-type{border-top:0}
.opts3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:10px}
.op{border:1.5px solid var(--border);border-radius:16px;padding:16px;background:#fff;position:relative}
.op.pick{border-color:var(--coral);box-shadow:0 0 0 3px rgba(230,57,70,.12)}
.op small{display:block;font-size:12px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;color:var(--coral-dk)}
.op h5{font-family:'DM Serif Display',serif;font-weight:400;font-size:20px;line-height:1.2;margin:2px 0 8px}
.op p{font-size:14px;color:var(--ink);max-width:none}
.op .tot{margin-top:10px;font-size:13px;font-weight:800;color:var(--navy)}
.op .tot b{font-family:'DM Serif Display',serif;font-weight:400;font-size:26px;margin-right:4px}
.op .rec{position:absolute;top:-11px;right:14px;font-size:11px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;background:var(--coral);color:#fff;border-radius:100px;padding:3px 11px}
.recbox{margin-top:16px;border-radius:16px;background:var(--navy);color:#fff;padding:20px 22px}
.recbox h5{font-family:'DM Serif Display',serif;font-weight:400;font-size:22px;margin-bottom:8px}
.recbox h5 em{color:var(--sage);font-style:normal}
.recbox p{color:rgba(255,255,255,.88);font-size:15px;max-width:none;margin-top:8px}
.recbox b{color:#fff}
.onward .acts{display:flex;gap:10px;flex-wrap:wrap}
.onward .btn.line{background:transparent;color:#fff;border-color:rgba(255,255,255,.5)}
.was-score{font-size:14px;color:var(--grey);margin-top:6px}
@media (max-width:760px){
  .slide{display:block}
  .mos,.mos.four,.opts3{grid-template-columns:1fr}
  .stories li{gap:10px}
  .state b,.sub,.op small,.op .rec,.mos h5 span{font-size:12px}
  .stories small,.note,.slide,.was-score{font-size:13px}
  .nav .tool{font-size:13px;padding:7px 12px}
}

/* version 2: export */
.exp{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.exp small{font-size:12.5px;color:var(--grey)}
.pf-top{align-items:center}
.printfoot{display:none}
@media (max-width:760px){ .exp{align-items:stretch;width:100%} .exp small{font-size:13px} }
@media print{
  *{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}
  /* no page margin, so the browser has nowhere to print the web address, the date or the page title */
  @page{margin:0}
  .has-flow,body{padding-left:0!important;margin-left:0!important}
  #pfWrap{display:block!important}
  .doc{border-radius:0}
  .piece{opacity:1!important;transform:none!important}
  .stamp{display:none!important}
  .wheel{display:block!important;max-width:380px}.wlist{display:none!important}
  .two{grid-template-columns:1fr 1fr!important}.grid2{grid-template-columns:1fr 1fr!important;margin:0 0 22px 22px!important}.ax{display:block!important}
  .brief{grid-template-columns:repeat(3,1fr)!important}.mos{grid-template-columns:repeat(3,1fr)!important}.mos.four{grid-template-columns:repeat(4,1fr)!important}.opts3{grid-template-columns:repeat(3,1fr)!important}
  .slide,.note:empty{display:none!important}
  .sec{padding:22px 26px}.cover{padding:30px 26px}
  .stories li,.mos .col,.op,.recbox,.state,.sec table tr,.gap-map,.two{break-inside:avoid}
  .sec-h,.sec>p,.sub{break-after:avoid}
  .printfoot{display:block;padding:14px 26px;border-top:1.5px solid var(--border);font-size:11px;color:var(--grey)}
}

/* version 3: the export is the document only */
.ptable,.ptable>tbody,.ptable>tbody>tr,.ptable>tbody>tr>td{display:block;width:100%;margin:0;padding:0;border:0;font-size:inherit}
.ptable>thead,.ptable>tfoot{display:none}
.exp{flex-direction:row;align-items:flex-end;flex-wrap:wrap;justify-content:flex-end;gap:10px}
.exp small{flex-basis:100%;text-align:right}
.exp .nm span{display:block;font-size:12px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--grey);margin-bottom:3px}
.exp .nm input{font:600 15px 'DM Sans',sans-serif;color:var(--navy);padding:11px 14px;border:1.5px solid var(--border);border-radius:12px;width:220px;background:#fff}
.exp .nm input:focus{outline:none;border-color:var(--navy)}
@media (max-width:760px){ .exp{flex-direction:column;align-items:stretch} .exp .nm input{width:100%;font-size:16px} .exp small{text-align:left} }
@media print{
  .ptable{display:table!important;width:100%!important;border-collapse:collapse}
  .ptable>thead{display:table-header-group!important}.ptable>tfoot{display:table-footer-group!important}
  .ptable>tbody{display:table-row-group!important}.ptable>tbody>tr,.ptable>thead>tr,.ptable>tfoot>tr{display:table-row!important}
  .ptable>tbody>tr>td{display:table-cell!important;padding:0 12mm!important;border:0!important}
  .ptable>thead>tr>td,.ptable>tfoot>tr>td{display:table-cell!important;height:11mm;padding:0!important;border:0!important}
  .doc{border:0!important;overflow:visible!important}
  .cover{border-radius:14px}
  .sec{padding:20px 4px!important}.printfoot{padding:12px 4px!important}
}
@media print{ .sec table{display:table!important}.sec thead{display:table-header-group!important}.sec tbody{display:table-row-group!important}.sec tr{display:table-row!important;border:0!important;padding:0!important}.sec td,.sec th{display:table-cell!important;width:auto!important;padding:9px!important;border-bottom:1px solid var(--border)!important} }
@media print{ #pfWrap .gap-map{overflow:visible!important} #pfWrap .gap-map svg{width:100%!important;max-width:100%!important} html,body{width:auto!important;overflow:visible!important} }
@media print{ .sec>p{break-inside:avoid;orphans:3;widows:3} }
.morecard{display:flex;gap:16px;align-items:center;flex-wrap:wrap;justify-content:space-between;margin-top:0}
.morecard p{font-size:16px;color:var(--ink);max-width:640px}
@media print{ .morecard{display:none!important} }
/* 6 October 2026: where there is no Export button yet, one line says the portfolio is kept */
.kept{font-size:14.5px;color:var(--grey);max-width:340px;text-align:right;line-height:1.45}
@media (max-width:760px){ .kept{text-align:left;max-width:none} }

/* Version 5, 9 October 2026. Jo, with a picture of a MoSCoW card cut in half across two pages of the PDF: "make sure
   nothing cuts off when portfolio exported to pdf". A MoSCoW column taller than a page now carries on to the next
   page, and no card, row, story or box is ever cut in half. Billie's bubble and Start again never print. */
@media print{
  .mos .col{break-inside:auto!important}
  .mos p,.mos h5,.stories li,.state div,.op,.recbox p,.sec li,.sec tr,.sec td,.sec th,.grid2 .box,.brief>*,.cover,.gap-map,.wheel{break-inside:avoid!important}
  #mapleBilBub,#bilFab,.bahub-restart,#mapleAgain,#mapleAgainBox{display:none!important}
}