/* ============================================================
   Word course: document mock-ups (<wd-doc>, <wd-ribbon>) + the
   Word-blue tone for the chrome. Load AFTER excel.css: the window,
   ribbon, dialog (.xd), menu (.xm) and Backstage (.xb) styles are
   shared, and anything inside a .wd wrapper turns Word blue because
   the --xg tokens are re-pointed there.
   ============================================================ */

:root{
  --wb:#185abd; --wb-deep:#0f3f8a; --wb-soft:#d9e5f7; --wb-fill:#e8f0fb;
  --wd-font:Aptos,"Segoe UI Variable",Calibri,"Segoe UI",system-ui,sans-serif;
  --wd-display:"Aptos Display",Aptos,Calibri,"Segoe UI",sans-serif;
  --wd-fs:13.5px; --wd-head:#0f4761;
}
/* Word chrome is blue: dialogs, menus and Backstage written inside .wd pick it up too */
.wd,wd-doc,wd-ribbon,.wd .xd,.wd .xm,.wd .xb,.xd.wd,.xm.wd,.xb.wd{--xg:#185abd;--xg-deep:#0f3f8a;--xg-soft:#d9e5f7;--xg-fill:#e8f0fb}
.t-wb{color:var(--wb)} [data-theme="dark"] .t-wb{color:#6ea8ff}
.tone-wb{--c:var(--wb);--cd:var(--wb-deep)} [data-theme="dark"] .tone-wb{--cd:#6ea8ff}
.kicker.k-wb{color:var(--wb);background:color-mix(in srgb,var(--wb) 14%,transparent)} [data-theme="dark"] .kicker.k-wb{color:#6ea8ff}
.btn-wb{background:var(--wb);color:#fff;box-shadow:0 16px 40px rgba(24,90,189,.3)} .btn-wb:hover{transform:translateY(-3px)}
.badge-365{background:var(--wb)}
.cardx.blue{--c:var(--wb)}
.asg .sb.xl{background:var(--wb);box-shadow:0 6px 14px rgba(24,90,189,.28)}
/* code / command names in the course text are blue, not Excel green */
.howto code,.steps code,.note code,.tip code,.slide-sub code,.fn-what code,.lead code,.q-text code,.asg code,.cards code,.tbl code,.fx b{color:var(--wb);background:color-mix(in srgb,var(--wb) 10%,transparent)}
[data-theme="dark"] .howto code,[data-theme="dark"] .steps code,[data-theme="dark"] .note code,[data-theme="dark"] .tip code,[data-theme="dark"] .slide-sub code,[data-theme="dark"] .fn-what code,[data-theme="dark"] .lead code,[data-theme="dark"] .q-text code,[data-theme="dark"] .asg code,[data-theme="dark"] .cards code,[data-theme="dark"] .tbl code,[data-theme="dark"] .fx b{color:#6ea8ff}
.fx b{background:none}

/* ---------- the window ---------- */
wd-doc,wd-ribbon{display:inline-block;max-width:100%;vertical-align:top;line-height:1.2;text-align:left}
wd-doc.block,wd-ribbon.block{display:block}
wd-doc .xs{display:flex;flex-direction:column;width:100%}
.wd-work{position:relative;display:flex;align-items:stretch;background:#e6e6e6;overflow:hidden}
.wd-area{position:relative;flex:1;min-width:0;padding:16px 20px;overflow:hidden;background:#e6e6e6;display:flex;justify-content:center;gap:16px;align-items:flex-start}
.wd-pages{display:flex;flex-direction:column;gap:14px;flex:none;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.wd-layer{position:absolute;inset:0;pointer-events:none;z-index:9}

/* ruler */
.wd-ruler{height:22px;background:#f3f3f3;border-bottom:1px solid #d4d4d4;display:flex;justify-content:center;align-items:center}
.wd-ruler-in{position:relative;height:14px;background:linear-gradient(90deg,#c9c9c9 0 var(--ml),#fff var(--ml) calc(100% - var(--mr)),#c9c9c9 calc(100% - var(--mr)));border:1px solid #bdbdbd;
  background-image:repeating-linear-gradient(90deg,transparent 0 11px,#8a8a8a 11px 12px),linear-gradient(90deg,#c9c9c9 0 var(--ml),#fff var(--ml) calc(100% - var(--mr)),#c9c9c9 calc(100% - var(--mr)));background-size:100% 4px,100% 100%;background-position:0 100%,0 0;background-repeat:repeat-x,no-repeat}
.wd-ruler-in i{position:absolute;top:-3px;width:0;height:0;border:5px solid transparent;border-top:7px solid #555}
.wd-ruler-in .wd-ind-l{left:calc(var(--ml) - 5px)} .wd-ruler-in .wd-ind-r{right:calc(var(--mr) - 5px)}

/* the page */
.wd-page{position:relative;width:var(--pw);min-height:var(--ph);background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.3);padding:var(--mt) var(--mr) var(--mb) var(--ml);font-family:var(--wd-font);font-size:var(--wd-fs);line-height:1.3;color:#111;font-weight:400;overflow:hidden}
.wd-body{column-count:var(--cols,1);column-gap:30px;min-height:40px}
.wd-hdr,.wd-ftr{position:absolute;left:var(--ml);right:var(--mr);color:#666;font-size:.92em;display:flex;align-items:flex-end}
.wd-hdr{top:0;height:var(--mt);padding-bottom:8px}
.wd-ftr{bottom:0;height:var(--mb);align-items:flex-start;padding-top:8px}
.wd-hdr-in,.wd-ftr-in{flex:1;position:relative;min-height:1.3em}
.wd-hf-tag{display:none;position:absolute;left:0;bottom:-18px;font-size:9px;font-family:var(--xl-ui);font-weight:600;color:#fff;background:#4a90e2;padding:1px 6px;border-radius:0 0 4px 4px;z-index:2}
.wd-ftr .wd-hf-tag{top:-18px;bottom:auto;border-radius:4px 4px 0 0}
.wd.hf .wd-body{opacity:.4}
.wd.hf .wd-hdr{border-bottom:1px dashed #4a90e2} .wd.hf .wd-ftr{border-top:1px dashed #4a90e2}
.wd.hf .wd-hf-tag{display:block}
.wd-pn{position:absolute;right:0;top:0} .wd-pn.center{left:0;right:0;text-align:center} .wd-pn.left{left:0;right:auto} .wd-pn.right{right:0}
.wd-ftr-in > *{display:inline}

/* document typography (Word 2024 defaults: Aptos 11 pt, 8 pt after, 1.15 lines) */
.wd-page p,.wd-page ul,.wd-page ol,.wd-page table,.wd-page figure,.wd-page h1,.wd-page h2,.wd-page h3,.wd-page .title,.wd-page .wd-shape,.wd-page .wd-textbox{margin:0 0 .65em}
.wd-page p{line-height:1.35;min-height:1.35em}
.wd-page h1,.wd-page .h1{font-family:var(--wd-display);font-weight:400;font-size:1.85em;line-height:1.15;color:var(--wd-head);margin-top:.6em}
.wd-page h2,.wd-page .h2{font-family:var(--wd-display);font-weight:400;font-size:1.5em;line-height:1.15;color:var(--wd-head);margin-top:.5em}
.wd-page h3,.wd-page .h3{font-family:var(--wd-display);font-weight:400;font-size:1.25em;color:var(--wd-head);margin-top:.4em}
.wd-page .title{font-family:var(--wd-display);font-size:2.6em;line-height:1.05;letter-spacing:-.01em;color:#111;margin-bottom:.3em}
.wd-page .subtitle{font-size:1.1em;color:#595959;letter-spacing:.04em}
.wd-page ul,.wd-page ol{padding-left:2em}
.wd-page li{margin:0;line-height:1.35}
.wd-page .b,.wd-page b,.wd-page strong{font-weight:700} .wd-page .i,.wd-page em{font-style:italic} .wd-page .u{text-decoration:underline} .wd-page .s{text-decoration:line-through}
.wd-page .us{text-decoration:underline line-through}
.wd-page .sup{vertical-align:super;font-size:.7em} .wd-page .sub{vertical-align:sub;font-size:.7em}
.wd-page .hl{background:#ffff00} .wd-page .hl-green{background:#00ff00} .wd-page .hl-cyan{background:#00ffff}
.wd-page .red{color:#c00000} .wd-page .blue{color:#0070c0} .wd-page .green{color:#00b050} .wd-page .orange{color:#ed7d31} .wd-page .grey{color:#7f7f7f}
.wd-page .center{text-align:center} .wd-page .right{text-align:right} .wd-page .justify{text-align:justify}
.wd-page .caps{text-transform:uppercase} .wd-page .smallcaps{font-variant:small-caps} .wd-page .lower{text-transform:lowercase}
.wd-page .big{font-size:1.5em} .wd-page .bigger{font-size:2em} .wd-page .small{font-size:.85em}
.wd-page .ind{text-indent:2.5em} .wd-page .indl{margin-left:2.5em} .wd-page .hang{padding-left:2.5em;text-indent:-2.5em}
.wd-page .nospace{margin-bottom:0;line-height:1.15}
.wd-page .double{line-height:2} .wd-page .space15{line-height:1.5}
.wd-page .quote{margin:.5em 2em;padding-left:.8em;border-left:3px solid var(--wd-head);color:#404040;font-style:italic}
.wd-page .tnr,.wd-page .serif{font-family:"Times New Roman",Times,serif} .wd-page .mono,.wd-page code{font-family:Consolas,"Cascadia Code",monospace;font-size:.95em}
.wd-page .arial{font-family:Arial,Helvetica,sans-serif} .wd-page .script{font-family:"Segoe Script","Brush Script MT",cursive}
.wd-page .boxed{border:1px solid #111;padding:4px 8px} .wd-page .shaded{background:#d9e2f3;padding:4px 8px}
.wd-page .bdr-b{border-bottom:1px solid #111} .wd-page .bdr-t{border-top:1px solid #111}
.wd-page .dropcap::first-letter{float:left;font-family:var(--wd-display);font-size:3.2em;line-height:.8;padding:.05em .08em 0 0;color:var(--wd-head)}
.wd-page .wd-hidden{display:none!important}
.wd-page .tab{display:inline-block;width:2.5em}
.wd-page .mf{color:#0b5fc4;background:#e6f0ff;padding:0 2px;border-radius:2px}
.wd-page .fld{color:#444;background:#e5e5e5;padding:0 2px;font-family:Consolas,monospace;font-size:.92em}
.wd-page .ins{color:#c00000;text-decoration:underline} .wd-page .del{color:#c00000;text-decoration:line-through}
.wd-page .ins2{color:#2e75b6;text-decoration:underline} .wd-page .del2{color:#2e75b6;text-decoration:line-through}
.wd-page .cmref{background:#fde6c4;border-bottom:2px solid #e98f2e}
.wd-page .link{color:#0563c1;text-decoration:underline}
.wd-page .fn{vertical-align:super;font-size:.7em;color:#0563c1}
.wd-page .pb{border-top:1px dashed #999;margin:.8em 0;text-align:center;font-size:.75em;color:#777;font-family:var(--xl-ui)}
.wd-page .pb::before{content:"Page Break"} .wd-page .sb::before{content:"Section Break (Next Page)"}
.wd-page .sb{border-top:1px double #999;margin:.8em 0;text-align:center;font-size:.75em;color:#777;font-family:var(--xl-ui)}
.wd-page .toc div{display:flex;align-items:baseline;gap:4px}
.wd-page .toc div::before{content:"";order:2;flex:1;border-bottom:1px dotted #555;margin:0 2px 3px}
.wd-page .toc div span:last-child{order:3} .wd-page .toc .l2{padding-left:1.5em} .wd-page .toc .l3{padding-left:3em}
.wd-page .cc{display:inline-block;border:1px solid #9bb7e0;background:#f4f8ff;padding:0 6px;color:#555;border-radius:2px}
.wd-page .cc.chk::before{content:"☐ "} .wd-page .cc.chk.on::before{content:"☒ "}
.wd-page .cc.dd::after{content:" ▾";color:#777}

/* formatting marks */
.wd.marks .wd-page p::after,.wd.marks .wd-page li::after,.wd.marks .wd-page h1::after,.wd.marks .wd-page h2::after{content:"¶";color:#2e75b6;margin-left:2px;font-weight:400}
.wd.marks .wd-page .tab::before{content:"→";color:#2e75b6}
.wd.marks .wd-page .sp{color:#2e75b6}

/* selection, caret, reveals */
.wd-sel{background:#bbd6fb}
.wd-selall .wd-body,.wd-selall .wd-body *{background:#bbd6fb}
.wd-caret{display:inline-block;width:1.5px;height:1.15em;background:#111;vertical-align:text-bottom;margin-left:1px;animation:xs-caret 1s steps(2) infinite}
.wd-page [data-step]:not(.is-shown){display:none}
.slide .wd-page [data-step]{transition:none;transform:none;opacity:1}
.wd-page .wd-new{animation:wd-in .5s ease both}
@keyframes wd-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* tables (Table Grid, Grid Table 4 Accent 1, List Table, Plain) */
.wd-page table.wd-t{border-collapse:collapse;width:100%;font-size:.96em}
.wd-page .wd-t td,.wd-page .wd-t th{border:1px solid #111;padding:3px 7px;text-align:left;vertical-align:top;font-weight:400}
.wd-page .wd-t th{font-weight:700}
.wd-page .wd-t.auto{width:auto}
.wd-page .wd-t .num,.wd-page .wd-t td.r{text-align:right} .wd-page .wd-t td.c{text-align:center}
.wd-page .wd-t.ts-blue td,.wd-page .wd-t.ts-blue th{border-color:#8eaadb}
.wd-page .wd-t.ts-blue tr:first-child th,.wd-page .wd-t.ts-blue tr:first-child td{background:#4472c4;color:#fff;font-weight:700;border-color:#4472c4}
.wd-page .wd-t.ts-blue tr:nth-child(even) td{background:#d9e2f3}
.wd-page .wd-t.ts-list td,.wd-page .wd-t.ts-list th{border:none;border-top:1px solid #4472c4;border-bottom:1px solid #4472c4}
.wd-page .wd-t.ts-list tr:first-child th,.wd-page .wd-t.ts-list tr:first-child td{font-weight:700;color:#2f5496;border-top:none;border-bottom:2px solid #4472c4}
.wd-page .wd-t.ts-plain td,.wd-page .wd-t.ts-plain th{border:none;border-bottom:1px solid #bfbfbf}
.wd-page .wd-t.ts-plain tr:first-child th,.wd-page .wd-t.ts-plain tr:first-child td{border-bottom:2px solid #111;font-weight:700}
.wd-page .wd-t.ts-green tr:first-child th,.wd-page .wd-t.ts-green tr:first-child td{background:#70ad47;color:#fff;font-weight:700;border-color:#70ad47}
.wd-page .wd-t.ts-green tr:nth-child(even) td{background:#e2efd9} .wd-page .wd-t.ts-green td,.wd-page .wd-t.ts-green th{border-color:#a9d18e}
.wd-page .wd-t td.sel,.wd-page .wd-t tr.sel td{background:#bbd6fb}
.wd-page .wd-t td.hl{background:#fff1e3;box-shadow:inset 0 0 0 2px #f47629}
.wd-page .wd-t .tot td{font-weight:700;border-top:2px solid #111}
.wd-page .wd-t.center-h td,.wd-page .wd-t.center-h th{text-align:center}

/* pictures: placeholder images drawn with gradients + an icon */
.wd-page figure.wd-img{--w:46%;position:relative;display:block;width:var(--w);aspect-ratio:4/3;border-radius:2px;background:linear-gradient(160deg,#9ad0ff,#2e8de8 55%,#1a5fa8);overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.wd-page figure.wd-img::before{content:"";position:absolute;inset:auto 0 0;height:38%;background:linear-gradient(0deg,#1f8a3a,#58c267 60%,transparent)}
.wd-page figure.wd-img::after{content:"";position:absolute;right:16%;top:14%;width:18%;aspect-ratio:1;border-radius:50%;background:#ffe07a;box-shadow:0 0 18px #ffe07a}
.wd-page figure.wd-img.sunset{background:linear-gradient(160deg,#ffb36b,#f06a3f 55%,#7a2d6b)} .wd-page figure.wd-img.sunset::before{background:linear-gradient(0deg,#3b1f4e,#6a3d7a 60%,transparent)}
.wd-page figure.wd-img.city{background:linear-gradient(160deg,#c9d6e2,#7f93a8 60%,#43556b)} .wd-page figure.wd-img.city::before{background:repeating-linear-gradient(90deg,#2e3b4b 0 9%,transparent 9% 14%);height:55%} .wd-page figure.wd-img.city::after{background:#fff;box-shadow:none;width:10%;right:14%;top:10%}
.wd-page figure.wd-img.mavi{background:#eaf5ff url("../images/mavi.svg") center/55% no-repeat} .wd-page figure.wd-img.mavi::before,.wd-page figure.wd-img.mavi::after{display:none}
.wd-page figure.wd-img.logo{background:#fff url("../images/mflogo.png") center/80% no-repeat;border:1px solid #ddd} .wd-page figure.wd-img.logo::before,.wd-page figure.wd-img.logo::after{display:none}
.wd-page figure.wd-img.inline{display:inline-block;vertical-align:bottom;margin:0 0 .2em}
.wd-page figure.wd-img.left{float:left;margin:0 12px 6px 0} .wd-page figure.wd-img.right{float:right;margin:0 0 6px 12px}
.wd-page figure.wd-img.wide{--w:100%;aspect-ratio:21/9}
.wd-page figure.wd-img.behind{position:absolute;inset:var(--mt) var(--mr) var(--mb) var(--ml);width:auto;aspect-ratio:auto;opacity:.25;z-index:0}
.wd-page figure.wd-img.center{margin-left:auto;margin-right:auto}
.wd-page figure.wd-img.round{border-radius:50%;aspect-ratio:1}
.wd-page figure.wd-img.frame{border:4px solid #fff;outline:1px solid #bbb;box-shadow:0 4px 10px rgba(0,0,0,.3)}
.wd-page figure.wd-img.soft{border-radius:10px;box-shadow:0 0 0 6px rgba(255,255,255,.6),0 6px 14px rgba(0,0,0,.25)}
.wd-page figure.wd-img.bw{filter:grayscale(1)} .wd-page figure.wd-img.bright{filter:brightness(1.25)}
.wd-page figure.wd-img.sel{outline:1.5px solid #4a90e2;outline-offset:1px}
.wd-page figure.wd-img.sel::after{box-shadow:0 0 18px #ffe07a,0 0 0 0}
.wd-page figure.wd-img[data-cap]{margin-bottom:1.6em} .wd-page figure.wd-img[data-cap]::before{z-index:0}
.wd-page figure.wd-img .cap,.wd-page .wd-cap{position:absolute;left:0;right:0;top:100%;padding-top:4px;font-size:.85em;font-style:italic;color:#44546a;background:#fff;text-align:left}
.wd-page figure.wd-img.crop{clip-path:inset(0 25% 0 0)}
.wd-page .handles::before{content:"";position:absolute;inset:-2px;border:1px solid #4a90e2;pointer-events:none}
.wd-page .handles::after{content:"";position:absolute;left:-5px;top:-5px;width:7px;height:7px;border-radius:50%;background:#fff;border:1px solid #4a90e2;box-shadow:calc(var(--hw,100px)) 0 0 0 #fff,calc(var(--hw,100px)) 0 0 1px #4a90e2}
.wd-page .wd-anchor{position:absolute;left:-18px;top:0;color:#4a90e2;font-size:14px}

/* shapes, icons, WordArt, text boxes */
.wd-page .wd-shape{--c:#156082;display:inline-grid;place-items:center;width:140px;height:70px;background:var(--c);color:#fff;font-family:var(--wd-font);text-align:center;padding:4px;vertical-align:top;box-shadow:0 2px 4px rgba(0,0,0,.25)}
.wd-page .wd-shape.rect{border-radius:0} .wd-page .wd-shape.round{border-radius:12px} .wd-page .wd-shape.oval{border-radius:50%}
.wd-page .wd-shape.arrow{clip-path:polygon(0 25%,70% 25%,70% 0,100% 50%,70% 100%,70% 75%,0 75%);box-shadow:none}
.wd-page .wd-shape.star{clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);width:90px;height:90px;box-shadow:none}
.wd-page .wd-shape.tri{clip-path:polygon(50% 0,100% 100%,0 100%);box-shadow:none}
.wd-page .wd-shape.callout{border-radius:10px;position:relative;overflow:visible}
.wd-page .wd-shape.callout::after{content:"";position:absolute;left:20px;bottom:-12px;border:8px solid transparent;border-top:12px solid var(--c);border-bottom:0}
.wd-page .wd-shape.line{height:3px;width:200px;display:block;box-shadow:none}
.wd-page .wd-shape.outline{background:#fff;color:var(--c);border:2px solid var(--c)}
.wd-page .wd-shape.c-orange{--c:#e97132} .wd-page .wd-shape.c-mint{--c:#196b24} .wd-page .wd-shape.c-violet{--c:#a02b93} .wd-page .wd-shape.c-grey{--c:#7f7f7f} .wd-page .wd-shape.c-sun{--c:#ffc000;color:#111}
.wd-page .wd-shape.sel{outline:1.5px solid #4a90e2;outline-offset:2px}
.wd-page .wd-shape.left{float:left;margin:0 12px 6px 0} .wd-page .wd-shape.right{float:right;margin:0 0 6px 12px}
.wd-page .wd-shapes{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.wd-page i.wd-icon{display:inline-grid;place-items:center;width:44px;height:44px;color:#111;vertical-align:middle;font-style:normal}
.wd-page i.wd-icon svg{width:36px;height:36px;stroke-width:1.3}
.wd-page i.wd-icon.blue{color:#156082} .wd-page i.wd-icon.orange{color:#e97132} .wd-page i.wd-icon.fill{background:#e8f0fb;border-radius:8px}
.wd-page i.wd-icon.big{width:70px;height:70px} .wd-page i.wd-icon.big svg{width:58px;height:58px}
.wd-page .wd-icons{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.wd-page .wd-wordart{display:inline-block;font-family:var(--wd-display);font-weight:800;font-size:2.4em;line-height:1.1;letter-spacing:.01em;color:#156082;text-shadow:2px 2px 0 #9dc3e6}
.wd-page .wd-wordart.wa-blue{background:linear-gradient(180deg,#5aa9ff,#0b4ea2);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none;filter:drop-shadow(2px 2px 0 #cfe2ff)}
.wd-page .wd-wordart.wa-fire{background:linear-gradient(180deg,#ffd166,#f3722c 55%,#c9184a);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none;filter:drop-shadow(2px 3px 0 #ffd9b3)}
.wd-page .wd-wordart.wa-outline{color:#fff;-webkit-text-stroke:1.5px #156082;text-shadow:none}
.wd-page .wd-wordart.wa-shadow{color:#e97132;text-shadow:3px 3px 0 #3a3a3a}
.wd-page .wd-wordart.wa-arch{transform:perspective(200px) rotateX(18deg)}
.wd-page .wd-wordart.wa-glow{color:#196b24;text-shadow:0 0 10px #8ee28c,0 0 2px #196b24}
.wd-page .wd-textbox{display:inline-block;width:46%;border:1px solid #111;padding:6px 10px;background:#fff;vertical-align:top}
.wd-page .wd-textbox.left{float:left;margin:0 12px 6px 0} .wd-page .wd-textbox.right{float:right;margin:0 0 6px 12px}
.wd-page .wd-textbox.pull{border:none;border-top:3px solid var(--wd-head);border-bottom:3px solid var(--wd-head);font-size:1.15em;font-style:italic;color:var(--wd-head)}
.wd-page .wd-textbox.sel{outline:1.5px solid #4a90e2;outline-offset:2px}

/* SmartArt */
.wd-page .wd-sa{display:flex;align-items:center;gap:6px;margin:.5em 0;font-family:var(--wd-font);font-size:.9em;text-align:center}
.wd-page .wd-sa > div{--c:#4472c4;background:var(--c);color:#fff;padding:10px 8px;min-width:80px;flex:1;border-radius:4px}
.wd-page .wd-sa > i{font-style:normal;color:#4472c4;font-size:1.4em}
.wd-page .wd-sa.v{flex-direction:column;align-items:stretch} .wd-page .wd-sa.v > i{transform:rotate(90deg)}
.wd-page .wd-sa.cycle{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.wd-page .wd-sa.cycle > div{border-radius:50%;aspect-ratio:1;display:grid;place-items:center;min-width:0}
.wd-page .wd-sa .c2{--c:#ed7d31} .wd-page .wd-sa .c3{--c:#a5a5a5} .wd-page .wd-sa .c4{--c:#ffc000;color:#111} .wd-page .wd-sa .c5{--c:#5b9bd5} .wd-page .wd-sa .c6{--c:#70ad47}
.wd-page .wd-sa.hier{flex-direction:column;gap:14px}
.wd-page .wd-sa.hier .row{display:flex;gap:8px;justify-content:center;width:100%;position:relative}
.wd-page .wd-sa.hier .row + .row::before{content:"";position:absolute;left:20%;right:20%;top:-9px;border-top:2px solid #4472c4}
.wd-page .wd-sa.hier .row > div{flex:0 1 110px}
.wd-page .wd-sa.list > div{text-align:left;padding:8px 12px;border-radius:0;flex:1}
.wd-page .wd-sa.sel{outline:1.5px solid #4a90e2;outline-offset:4px}

/* charts inside a document */
.wd-page xl-chart{display:block;margin:.4em auto;box-shadow:none;border-color:#d9d9d9}

/* columns and drop caps etc. */
.wd-page .wd-body.two{column-count:2}

/* comments column */
.wd-cmts{display:none;flex:none;width:180px;flex-direction:column;gap:10px}
.wd.has-cmts .wd-cmts{display:flex}
.wd-cm{background:#fff;border:1px solid #d9d9d9;border-left:3px solid #e98f2e;border-radius:4px;padding:8px 10px;font-family:var(--xl-ui);font-size:11.5px;box-shadow:0 2px 6px rgba(0,0,0,.12)}
.wd-cm-by{display:flex;align-items:center;gap:6px;margin-bottom:4px}
.wd-cm-by i{width:20px;height:20px;border-radius:50%;background:#e98f2e;color:#fff;display:grid;place-items:center;font-style:normal;font-weight:700;font-size:10px}
.wd-cm-by b{font-weight:600} .wd-cm-by span{color:#777;font-size:10.5px;margin-left:auto}
.wd-cm-t{line-height:1.35;color:#222} .wd-cm-r{margin-top:6px;color:#777;font-size:10.5px;border-top:1px solid #eee;padding-top:4px}
.wd-cm.wd-new{animation:wd-in .5s ease both}

/* navigation pane */
.wd-nav{display:none;flex:none;width:170px;background:#fff;border-right:1px solid #d4d4d4;font-family:var(--xl-ui);font-size:12px;padding:8px 0;color:#222}
.wd.has-nav .wd-nav{display:block}
.wd-nav-t{font-weight:600;padding:2px 10px 6px;font-size:13px}
.wd-nav-s{margin:0 10px 6px;padding:3px 6px;border:1px solid #c6c6c6;border-radius:3px;color:#777;display:flex;gap:6px;align-items:center}
.wd-nav-tabs{display:flex;gap:10px;padding:0 10px 4px;border-bottom:1px solid #e5e5e5;margin-bottom:4px;font-size:11.5px;color:#666}
.wd-nav-tabs .on{color:var(--xg);border-bottom:2px solid var(--xg);font-weight:600}
.wd-nav-i{padding:3px 10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wd-nav-i.l1{font-weight:600} .wd-nav-i.l2{padding-left:22px} .wd-nav-i.l3{padding-left:34px;color:#555}
.wd-nav-i.on{background:var(--xg-fill);box-shadow:inset 3px 0 0 var(--xg)}

/* views */
.wd[data-view="web"] .wd-area,.wd[data-view="draft"] .wd-area{background:#fff;padding:10px 24px}
.wd[data-view="web"] .wd-page,.wd[data-view="draft"] .wd-page{width:100%;min-height:0;box-shadow:none;padding:10px 0}
.wd[data-view="web"] .wd-hdr,.wd[data-view="web"] .wd-ftr,.wd[data-view="draft"] .wd-hdr,.wd[data-view="draft"] .wd-ftr{display:none}
.wd[data-view="web"] .wd-pages{width:100%}
.wd[data-view="draft"] .wd-page figure,.wd[data-view="draft"] .wd-page .wd-shape{display:none}
.wd[data-view="read"] .wd-area{background:#f8f3e9;padding:20px 40px}
.wd[data-view="read"] .wd-page{width:100%;min-height:0;box-shadow:none;background:transparent;padding:0;font-size:1.1em;column-count:2;column-gap:40px}
.wd[data-view="read"] .wd-hdr,.wd[data-view="read"] .wd-ftr{display:none}
.wd[data-view="read"] .wd-pages{width:100%}
.wd[data-view="outline"] .wd-area{background:#fff;padding:10px 24px}
.wd[data-view="outline"] .wd-page{width:100%;min-height:0;box-shadow:none;padding:0}
.wd[data-view="outline"] .wd-page h1::before,.wd[data-view="outline"] .wd-page h2::before,.wd[data-view="outline"] .wd-page p::before{content:"⊕";color:#777;margin-right:6px;font-size:.8em}
.wd[data-view="outline"] .wd-page p::before{content:"•"} .wd[data-view="outline"] .wd-page h2{margin-left:1.5em} .wd[data-view="outline"] .wd-page p{margin-left:3em}
.wd[data-view="outline"] .wd-hdr,.wd[data-view="outline"] .wd-ftr{display:none}

/* status bar bits */
.wd .xs-status span + span::before{content:"";display:inline-block;width:1px;height:12px;background:#ccc;margin:0 10px -2px -8px}
.wd .xs-status .xs-stats::before,.wd .xs-status .xs-views::before,.wd .xs-status .xs-zoom::before{display:none}
.wd .xs-status .xs-views{margin-left:auto}

/* ---------- Word-flavoured title art and course bits ---------- */
.title-art wd-doc{position:absolute;left:0;top:30px;transform:rotate(-5deg);z-index:2;box-shadow:var(--shadow-lg)}
.title-art .mavi-xl{z-index:3}
.wd-demo{flex:1;min-height:0;display:grid;grid-template-columns:1fr 400px;gap:26px;align-items:start;margin-top:14px}
.wd-demo.n{grid-template-columns:1fr 340px} .wd-demo.w{grid-template-columns:1fr 460px} .wd-demo.stack{grid-template-columns:1fr}
.wd-demo.rev{grid-template-columns:400px 1fr} .wd-demo.rev > :first-child{order:2}
.wd-demo > *{min-width:0}
/* a page thumbnail (static) for layout galleries: <div class="pg-thumb [land]"><i></i><i class="w60"></i>…</div> */
.pg-thumb{display:inline-flex;flex-direction:column;gap:5px;width:72px;height:96px;padding:10px 8px;background:#fff;border:1px solid #c9c9c9;box-shadow:0 2px 6px rgba(0,0,0,.18)}
.pg-thumb.land{width:96px;height:72px}
.pg-thumb i{display:block;height:4px;border-radius:2px;background:#9a9a9a;width:100%}
.pg-thumb i.w60{width:60%} .pg-thumb i.w80{width:80%} .pg-thumb i.w40{width:40%} .pg-thumb i.h{background:#185abd;height:6px}
.pg-thumb i.img{height:22px;background:linear-gradient(160deg,#9ad0ff,#2e8de8);border-radius:2px}
.pg-thumb.on{outline:2.5px solid var(--cta);outline-offset:2px}
.pg-row{display:flex;gap:14px;align-items:flex-end;flex-wrap:wrap}
.pg-row figure{display:flex;flex-direction:column;align-items:center;gap:6px;margin:0;font-family:var(--display);font-weight:700;font-size:15px;text-align:center}
.pg-row figure small{font-family:var(--body);font-weight:600;font-size:12.5px;color:var(--muted)}

/* ---------- small shared fixes (found while authoring the decks) ---------- */
/* the Recent / Pinned / Shared with me row of a Backstage mock-up is a tab row, not a 3-column grid */
.xb .xb-recent > div:first-child{display:flex;gap:18px;font-weight:600;color:#555}
.xb .xb-recent > div:first-child span.on{color:var(--xg);box-shadow:inset 0 -2px 0 var(--xg)}
/* a manual line break (Shift+Enter) shown as ↵ when formatting marks are on */
.wd.marks .wd-page .lb::after{content:"↵";color:#2e75b6;margin-left:2px}
/* several check boxes / radio buttons on one dialog row sit side by side */
.xd .xd-row.full{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:center}
