/* Crew catalog mini UI mockups. Everything scales with the card width (cqw). */
.ck-mock{container-type:inline-size;aspect-ratio:16/10;width:100%;border-radius:12px;overflow:hidden;background:#fff;border:1px solid #e3e9ef;box-shadow:0 1px 2px rgba(15,23,32,.04),0 8px 22px rgba(15,23,32,.06);position:relative}
.ck-mock .mk{position:absolute;inset:0;font:500 3.25cqw/1.35 "Hanken Grotesk",system-ui,sans-serif;color:#1e2833;display:flex;flex-direction:column;background:linear-gradient(180deg,#fff,#fbfcfd)}
.mk-bar{display:flex;align-items:center;gap:.4em;height:2.3em;padding:0 .9em;border-bottom:1px solid #edf1f5;background:#f6f8fa;flex:none}
.mk-bar i{width:.6em;height:.6em;border-radius:50%;background:#dbe2e9}
.mk-bar span{margin-left:.5em;font-weight:700;font-size:.92em;color:#5b6b7a;letter-spacing:.01em}
.mk-bar em{margin-left:auto;font-style:normal;font-weight:700;font-size:.8em;color:color-mix(in srgb,var(--rc) 76%,#000);background:color-mix(in srgb,var(--rc) 11%,#fff);padding:.25em .7em;border-radius:99px;white-space:nowrap}
.mk-body{flex:1;padding:.9em 1.1em;min-height:0;overflow:hidden}
.mk-h{font-weight:800;font-size:1.02em;margin-bottom:.55em;color:#0f1720;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mk-row{display:flex;gap:.6em;padding:.28em 0;border-bottom:1px solid #eef2f5;white-space:nowrap;overflow:hidden}
.mk-row b{color:#5f6b78;font-weight:600;min-width:3.6em}
.mk-row span{font-weight:700;overflow:hidden;text-overflow:ellipsis}
.mk-txt{padding:.5em 0 .2em}
.mk-txt p{margin:0 0 .15em;color:#3b4855;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mk-txt i,.mk-doc i{display:block;height:.42em;border-radius:99px;background:#e9eef3;margin:.42em 0}
.mk-txt i.s,.mk-doc i.s{width:62%}
.mk-btns{display:flex;gap:.5em;margin-top:.55em}
.mk-b{font-weight:700;font-size:.88em;padding:.4em .9em;border-radius:.55em;border:1px solid #d9e1e8;color:#3b4855;background:#fff;white-space:nowrap}
.mk-b--p{background:var(--rc);border-color:var(--rc);color:#fff}
.mk-tbl{width:100%;border-collapse:separate;border-spacing:0;font-size:.95em;table-layout:fixed}
.mk-tbl th{font-weight:700;color:#5f6b78;text-align:left;padding:.35em .5em;background:#f4f7fa;font-size:.88em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mk-tbl td{padding:.48em .5em;border-bottom:1px solid #eef2f5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:600}
.mk-tbl tr.hl td{background:color-mix(in srgb,var(--rc) 10%,#fff);color:#0f1720}

.mk-cal{display:grid;grid-template-columns:repeat(5,1fr);grid-template-rows:auto repeat(6,1.72em);gap:1px;background:#e6ebf0;border:1px solid #e6ebf0;border-radius:.35em;overflow:hidden}
.mk-cal .cl{display:block;background:#fff}
.mk-cal .ev{margin:.12em;position:relative;z-index:1}
.mk-cal .dh{font-weight:700;color:#3d4752;font-size:.85em;text-align:center;padding:.3em 0;background:#f6f8fa}
.mk-cal .ev{background:color-mix(in srgb,var(--rc) 14%,#fff);color:color-mix(in srgb,var(--rc) 75%,#0f1720);border-radius:.4em;font-weight:700;font-size:.82em;padding:.2em .4em;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:1.25}
.mk-sms{display:flex;flex-direction:column;gap:.5em;padding-top:.2em}
.mk-sms .b{max-width:78%;padding:.5em .8em;border-radius:1.1em;font-weight:600;line-height:1.3}
.mk-sms .in{align-self:flex-start;background:#eef2f5;border-bottom-left-radius:.3em}
.mk-sms .out{align-self:flex-end;background:var(--rc);color:#fff;border-bottom-right-radius:.3em}
.mk-doc{background:#fff;border:1px solid #edf1f5;border-radius:.5em;padding:.8em 1em;height:100%;box-sizing:border-box}
.mk-doc .t{font:600 1.15em/1.2 Spectral,Georgia,serif;color:#0f1720;margin-bottom:.45em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mk-doc b{display:block;font-size:.9em;color:color-mix(in srgb,var(--rc) 76%,#000);margin-top:.35em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mk-chk{list-style:none;margin:0;padding:0}
.mk-chk li{display:flex;align-items:center;gap:.6em;padding:.42em 0;border-bottom:1px solid #eef2f5;font-weight:600;color:#3b4855;white-space:nowrap;overflow:hidden}
.mk-chk li span{flex:none;width:1.05em;height:1.05em;border-radius:.3em;border:1.5px solid #c6d0da;box-sizing:border-box}
.mk-chk li.is{color:#5f6b78}
.mk-chk li.is span{background:var(--rc);border-color:var(--rc);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");background-size:75%;background-position:center;background-repeat:no-repeat}
.mk-bars{display:flex;align-items:flex-end;gap:.7em;height:8.4em;padding:0 .2em;border-bottom:1px solid #e3e9ef}
.mk-bars span{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;position:relative}
.mk-bars i{display:block;width:100%;max-width:2.6em;border-radius:.35em .35em 0 0;background:color-mix(in srgb,var(--rc) 70%,#fff)}
.mk-bars span:nth-child(odd) i{background:var(--rc)}
.mk-bars em{position:absolute;bottom:-1.45em;font-style:normal;font-weight:600;font-size:.78em;color:#5f6b78;white-space:nowrap}
.mk-note{margin-top:1.75em;font-weight:700;font-size:.88em;color:color-mix(in srgb,var(--rc) 80%,#0f1720)}
.mk-card{display:grid;grid-template-columns:2.6em 1fr;column-gap:.8em;align-items:center}
.mk-card .av{grid-row:span 1;width:2.6em;height:2.6em;border-radius:50%;background:color-mix(in srgb,var(--rc) 16%,#fff);color:color-mix(in srgb,var(--rc) 76%,#000);display:grid;place-items:center;font-weight:800;font-size:1em}
.mk-card .n{font-weight:800;font-size:1.05em;color:#0f1720;display:flex;align-items:center;gap:.5em;white-space:nowrap;overflow:hidden}
.mk-card .tag{font-size:.75em;font-weight:700;color:color-mix(in srgb,var(--rc) 76%,#000);background:color-mix(in srgb,var(--rc) 11%,#fff);padding:.2em .6em;border-radius:99px}
.mk-card .f{grid-column:1/-1;display:flex;justify-content:space-between;gap:1em;padding:.45em 0;border-bottom:1px solid #eef2f5;white-space:nowrap}
.mk-card .f:first-of-type{margin-top:.6em}
.mk-card .f b{color:#5f6b78;font-weight:600}
.mk-card .f span{font-weight:700;overflow:hidden;text-overflow:ellipsis}
.mk-inbox{list-style:none;margin:0;padding:0}
.mk-inbox li{display:flex;align-items:center;gap:.7em;padding:.5em 0;border-bottom:1px solid #eef2f5}
.mk-inbox .dot{flex:none;width:.55em;height:.55em;border-radius:50%;background:var(--rc)}
.mk-inbox div{flex:1;min-width:0;display:flex;flex-direction:column}
.mk-inbox b{font-size:.85em;color:#5f6b78;font-weight:700}
.mk-inbox div span{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mk-inbox em{font-style:normal;font-weight:700;font-size:.78em;color:color-mix(in srgb,var(--rc) 76%,#000);background:color-mix(in srgb,var(--rc) 11%,#fff);padding:.25em .6em;border-radius:99px;white-space:nowrap}
.mk-alert{border:1px solid color-mix(in srgb,var(--rc) 30%,#fff);background:color-mix(in srgb,var(--rc) 5%,#fff);border-radius:.7em;padding:.85em 1em}
.mk-alert .t{display:flex;align-items:center;gap:.55em;font-weight:800;font-size:1.05em;color:#0f1720}
.mk-alert .ic{width:1.4em;height:1.4em;border-radius:50%;background:var(--rc);color:#fff;display:grid;place-items:center;font-size:.8em}
.mk-alert p{margin:.5em 0 0;color:#3b4855;font-weight:500}
.mk-post .u{display:flex;align-items:center;gap:.5em}
.mk-post .av{width:1.7em;height:1.7em;border-radius:50%;background:var(--rc)}
.mk-post p{margin:.45em 0;font-weight:600;color:#1e2833}
.mk-post .img{height:4.6em;border-radius:.55em;background:linear-gradient(135deg,color-mix(in srgb,var(--rc) 75%,#fff),var(--rc));display:grid;place-items:center}
.mk-post .img span{color:#fff;font:600 1.4em/1 Spectral,Georgia,serif}
.mk-post .mk-note{margin-top:.5em}
.ck-mock .mk p{font-size:1em;line-height:inherit}
.ck-mock *{letter-spacing:normal;text-transform:none}
/* ---- rich mockups ---- */
.ck-mock .cur{position:absolute;width:1.5em;height:1.5em;right:-.7em;bottom:-.9em;filter:drop-shadow(0 .1em .15em rgba(0,0,0,.3))}
.ck-mock .lg{display:inline-grid;place-items:center;height:1.5em;padding:0 .45em;border-radius:.35em;background:#0364b8;color:#fff;font-weight:800;font-size:.72em;letter-spacing:.02em}
.mkb-video,.mkb-slides,.mkb-social,.mkb-announce{padding:.7em .8em}
.mk-vid{display:grid;grid-template-columns:1.55fr 1fr;grid-template-rows:auto 1fr;gap:.55em .7em;height:100%}
.mk-vid .fr{position:relative;aspect-ratio:16/9;border-radius:.45em;overflow:hidden;background:radial-gradient(60% 80% at 70% 30%,#e9d8b4 0,rgba(233,216,180,0) 60%),linear-gradient(135deg,#2a3542,#0f1720)}
.mk-vid .sp{position:absolute;left:52%;bottom:0;width:30%;height:72%;border-radius:50% 50% 0 0/40% 40% 0 0;background:linear-gradient(180deg,#4a5a6b,#2a3542)}
.mk-vid .sp::before{content:"";position:absolute;left:28%;top:-38%;width:44%;aspect-ratio:1;border-radius:50%;background:#56687a}
.mk-vid .lt{position:absolute;left:5%;bottom:9%;background:rgba(255,255,255,.95);border-radius:.25em;padding:.25em .55em;display:flex;flex-direction:column;box-shadow:0 .2em .5em rgba(0,0,0,.25)}
.mk-vid .lt b{font-size:.92em;color:#0f1720;line-height:1.15}
.mk-vid .lt span{font-size:.7em;color:color-mix(in srgb,var(--rc) 76%,#000);font-weight:700}
.mk-vid .vcc{position:absolute;right:5%;top:8%;font-size:.6em;font-weight:800;color:#fff;border:1px solid rgba(255,255,255,.7);border-radius:.2em;padding:.05em .3em}
.mk-vid .nt{list-style:none;margin:0;padding:0;display:grid;gap:.35em;align-content:start}
.mk-vid .nt li{display:flex;gap:.45em;align-items:center;font-weight:700;font-size:.86em;line-height:1.2}
.mk-vid .nt i{flex:none;width:.9em;height:.9em;border-radius:50%;background:var(--rc);box-shadow:inset 0 0 0 .22em color-mix(in srgb,var(--rc) 35%,#fff)}
.mk-vid .tln{grid-column:1/-1;position:relative;display:flex;gap:.18em;align-items:center;height:2.3em;padding:.5em .4em .4em;border-radius:.45em;background:#1e2833}
.mk-vid .tln .clip{height:1.05em;border-radius:.2em;background:linear-gradient(180deg,color-mix(in srgb,var(--rc) 60%,#fff),var(--rc))}
.mk-vid .tln .x{width:.5em;height:1.5em;border-radius:.15em;background:repeating-linear-gradient(135deg,#e5484d 0 .15em,transparent .15em .3em);opacity:.9}
.mk-vid .tln .t{position:absolute;top:-.05em;font-size:.55em;font-weight:800;color:#c9d4de;letter-spacing:.04em}
.mk-sl{display:grid;grid-template-rows:1fr auto;gap:.5em;height:100%}
.mk-sl .big{position:relative;border-radius:.45em;overflow:hidden;display:grid;grid-template-columns:1.25fr 1fr;background:linear-gradient(120deg,#0f1720,#24364a 70%,color-mix(in srgb,var(--rc) 70%,#24364a));color:#fff}
.mk-sl .tx{padding:.9em 1em;display:flex;flex-direction:column;justify-content:center;gap:.25em}
.mk-sl .tx em{font-style:normal;font-size:.62em;font-weight:800;letter-spacing:.2em;color:color-mix(in srgb,var(--rc) 45%,#fff)}
.mk-sl .tx b{font:500 1.55em/1.05 Spectral,Georgia,serif}
.mk-sl .tx span{font-size:.72em;color:#c9d4de}
.mk-sl .ph{margin:.7em .7em .7em 0;border-radius:.35em;background:radial-gradient(70% 60% at 40% 35%,#f6e2ae,rgba(246,226,174,0) 70%),linear-gradient(160deg,#8ec4c4,#3a7e7e)}
.mk-sl .th{display:grid;grid-template-columns:repeat(3,1fr);gap:.4em}
.mk-sl .th span{aspect-ratio:16/9;border-radius:.3em;display:grid;place-items:end start;padding:.3em .4em;font-size:.6em;color:#fff;font-weight:800}
.mk-sl .th .v0{background:linear-gradient(135deg,#3a7e7e,#0f1720)}
.mk-sl .th .v1{background:linear-gradient(135deg,var(--rc),#0f1720)}
.mk-sl .th .v2{background:linear-gradient(135deg,#93701b,#0f1720)}
.mk-bul{display:grid;grid-template-columns:1fr 1.25fr;height:100%;border-radius:.4em;overflow:hidden;box-shadow:0 .1em .5em rgba(15,23,32,.12);background:#fffdf7}
.mk-bul .cv{display:flex;flex-direction:column;justify-content:flex-end;gap:.2em;padding:.8em;color:#fff;background:radial-gradient(80% 60% at 70% 20%,rgba(246,226,174,.7),rgba(246,226,174,0) 60%),linear-gradient(170deg,#3a7e7e,#0f2a2a)}
.mk-bul .orn{width:1.6em;height:1.6em;border:.12em solid rgba(255,255,255,.8);border-radius:50%;margin-bottom:auto;box-shadow:inset 0 0 0 .3em rgba(255,255,255,.2)}
.mk-bul .cv b{font:500 1.15em/1.1 Spectral,Georgia,serif}
.mk-bul .cv span{font-size:.7em;opacity:.85}
.mk-bul .ow{padding:.7em .8em;display:flex;flex-direction:column;gap:.32em;border-left:1px dashed #e3d9c3}
.mk-bul .ow em{font:italic 500 .95em Spectral,Georgia,serif;color:#0f1720;margin-bottom:.15em}
.mk-bul .r{display:flex;align-items:baseline;gap:.3em;font-size:.72em;font-weight:600;color:#3b4855;white-space:nowrap}
.mk-bul .r i{flex:1;border-bottom:1px dotted #c9b98f}
.mk-blog .url,.mk-web .url{display:flex;align-items:center;gap:.45em;font-size:.72em;font-weight:600;color:#5b6b7a;background:#eef2f5;border-radius:99px;padding:.25em .7em;margin-bottom:.5em;white-space:nowrap;overflow:hidden}
.mk-blog .hero{height:5.2em;border-radius:.4em;margin-bottom:.45em;display:grid;place-items:end start;padding:.4em .55em;background:radial-gradient(60% 70% at 75% 25%,#f8d6bc,rgba(248,214,188,0) 65%),linear-gradient(150deg,#a8653c,#3b2416)}
.mk-blog .hero span{font-size:.6em;font-weight:800;letter-spacing:.18em;color:#fff}
.mk-blog b{display:block;font:500 1.2em/1.12 Spectral,Georgia,serif;color:#0f1720}
.mk-blog .by{font-size:.7em;color:#5f6b78;margin:.15em 0 .1em;font-weight:600}
.mk-blog i{display:block;height:.38em;border-radius:99px;background:#e9eef3;margin:.38em 0}
.mk-blog i.s{width:70%}
.mk-soc{display:grid;grid-template-columns:repeat(3,1fr);gap:.45em}
.mk-soc span{aspect-ratio:1;border-radius:.45em;padding:.55em;display:flex;flex-direction:column;justify-content:flex-end;color:#fff;overflow:hidden}
.mk-soc em{font-style:normal;font-size:.55em;font-weight:800;letter-spacing:.16em;opacity:.85}
.mk-soc b{font:500 .95em/1.1 Spectral,Georgia,serif}
.mk-soc .g0{background:radial-gradient(70% 60% at 70% 25%,rgba(246,226,174,.65),rgba(246,226,174,0) 60%),linear-gradient(160deg,#a8653c,#3b2416)}
.mk-soc .g1{background:linear-gradient(160deg,#24364a,#0f1720)}
.mk-soc .g2{background:radial-gradient(70% 60% at 30% 20%,rgba(191,228,228,.7),rgba(191,228,228,0) 60%),linear-gradient(160deg,#3a7e7e,#123434)}
.mkb-social .mk-note{margin-top:.6em}
.mk-mbx{display:grid;grid-template-columns:8.6em 1fr;gap:.7em;height:100%}
.mk-mbx .sd{list-style:none;margin:0;padding:.35em;border-radius:.45em;background:#f2f5f8;display:grid;gap:.25em;align-content:start}
.mk-mbx .sd li{display:flex;justify-content:space-between;gap:.3em;padding:.38em .5em;border-radius:.35em;font-weight:700;font-size:.82em;color:#3b4855;white-space:nowrap}
.mk-mbx .sd li.is{background:#fff;color:#0f1720;box-shadow:0 .05em .2em rgba(15,23,32,.12)}
.mk-mbx .sd em{font-style:normal;font-size:.85em;color:#fff;background:var(--rc);border-radius:99px;padding:0 .45em}
.mk-mbx .ad{color:color-mix(in srgb,var(--rc) 76%,#000)}
.mkb-mailbox .mk-note,.mkb-social .mk-note{margin-top:.5em}
.mk-brn{display:grid;grid-template-columns:7.8em 1.2em 1fr;align-items:center;height:100%;gap:.3em}
.mk-brn .bsrc{display:grid;gap:.35em}
.mk-brn .bsrc span{display:flex;align-items:center;gap:.4em;padding:.35em .45em;border-radius:.45em;background:#fff;border:1px solid #e3e9ef;font-size:.8em}
.mk-brn .bsrc img{width:1.35em;height:1.35em;object-fit:contain}
.mk-brn .bsrc b{font-weight:700;white-space:nowrap}
.mk-brn .ar{height:.2em;background:linear-gradient(90deg,#c6d0da,var(--rc));position:relative}
.mk-brn .ar::after{content:"";position:absolute;right:-.1em;top:-.3em;border:.4em solid transparent;border-left-color:var(--rc);border-right:0}
.mk-brn .core{display:grid;gap:.45em}
.mk-brn .bhub{border-radius:.6em;padding:.55em .7em;color:#fff;background:radial-gradient(80% 90% at 20% 10%,color-mix(in srgb,var(--rc) 70%,#fff),transparent 70%),linear-gradient(135deg,#0f1720,#24364a)}
.mk-brn .bhub span{display:block;font:500 1.1em/1.1 Spectral,Georgia,serif}
.mk-brn .bhub em{font-style:normal;font-size:.68em;color:#c9d4de;font-weight:700}
.mk-brn .qa p{margin:0;font-size:.78em;line-height:1.3;padding:.35em .55em;border-radius:.6em}
.mk-brn .q{background:#eef2f5;font-weight:700;margin-bottom:.3em!important}
.mk-brn .a{background:color-mix(in srgb,var(--rc) 10%,#fff);color:#1e2833}
.mk-web .url img{width:1.2em;height:1.2em;object-fit:contain}
.mk-web .url em{margin-left:auto;font-style:normal;color:color-mix(in srgb,var(--rc) 76%,#000);font-weight:800}
.mk-web .app{display:grid;grid-template-columns:5.6em 1fr;gap:.5em;border:1px solid #e3e9ef;border-radius:.45em;padding:.45em;background:#fff}
.mk-web .wnav{display:grid;gap:.25em;align-content:start}
.mk-web .wnav span{font-size:.72em;font-weight:700;color:#5b6b7a;padding:.25em .4em;border-radius:.3em}
.mk-web .wnav span.is{background:color-mix(in srgb,var(--rc) 12%,#fff);color:color-mix(in srgb,var(--rc) 76%,#000)}
.mk-web .rows{position:relative}
.mk-web .r{display:flex;justify-content:space-between;gap:.5em;font-size:.76em;font-weight:600;padding:.28em 0;border-bottom:1px solid #eef2f5;white-space:nowrap}
.mk-web .r em{font-style:normal;font-weight:800;color:#5f6b78}
.mk-web .r em.r-ok{color:#23703e}
.mk-web .r em.r-new{color:color-mix(in srgb,var(--rc) 76%,#000)}
.mk-web .wbtn{position:relative;display:inline-block;margin-top:.45em;font-size:.76em;font-weight:800;color:#fff;background:var(--rc);padding:.35em .8em;border-radius:.4em}
.mk-web .steps{display:flex;gap:.3em;margin-top:.5em;flex-wrap:wrap}
.mk-web .steps span{font-size:.66em;font-weight:800;padding:.25em .6em;border-radius:99px;background:#0f1720;color:#fff}
.mk-pry{height:100%;border-radius:.5em;overflow:hidden;background:#fffdf7;box-shadow:0 .1em .5em rgba(15,23,32,.1)}
.mk-pry .phd{padding:.7em .9em;color:#fff;background:radial-gradient(70% 90% at 85% 10%,rgba(246,226,174,.6),rgba(246,226,174,0) 60%),linear-gradient(140deg,#6e5aa0,#2a1f45)}
.mk-pry .phd em{display:block;font-style:normal;font-size:.58em;font-weight:800;letter-spacing:.2em;opacity:.85}
.mk-pry .phd b{font:500 1.25em/1.1 Spectral,Georgia,serif}
.mk-pry ul{list-style:none;margin:0;padding:.5em .9em;display:grid;gap:.3em}
.mk-pry li{display:flex;gap:.5em;font-size:.78em;line-height:1.25}
.mk-pry li b{flex:none;width:4.6em;color:#6e5aa0;font-weight:800}
.mk-ann{display:grid;grid-template-columns:1.5fr 1fr;gap:.6em;height:100%}
.mk-ann .pst{border-radius:.5em;padding:.9em;display:flex;flex-direction:column;justify-content:flex-end;color:#fff;background:radial-gradient(80% 60% at 75% 20%,rgba(248,214,188,.8),rgba(248,214,188,0) 60%),linear-gradient(165deg,#a8653c,#2e1a0f)}
.mk-ann em{font-style:normal;font-size:.6em;font-weight:800;letter-spacing:.2em}
.mk-ann b{font:500 1.6em/1.02 Spectral,Georgia,serif;margin:.15em 0}
.mk-ann .pst span{font-size:.75em;font-weight:700;opacity:.9}
.mk-ann .sz{display:grid;gap:.4em;align-content:center}
.mk-ann .sz span{font-size:.72em;font-weight:800;color:#3b4855;border:1px solid #e3e9ef;border-radius:.4em;padding:.45em .55em;background:#fff}
.mk-gd .t{font:600 1.1em/1.2 Spectral,Georgia,serif;color:#0f1720;margin-bottom:.4em}
.mk-gd .st{display:grid;grid-template-columns:1.5em 1fr;gap:.5em;margin-bottom:.45em}
.mk-gd .st em{font-style:normal;width:1.5em;height:1.5em;border-radius:50%;background:var(--rc);color:#fff;font-weight:800;font-size:.8em;display:grid;place-items:center}
.mk-gd .st b{display:block;font-size:.82em;margin-bottom:.2em}
.mk-gd .shot{position:relative;display:block;height:1.8em;border-radius:.3em;border:1px solid #e3e9ef;background:#f6f8fa;padding:.35em .5em}
.mk-gd .shot i{display:block;height:.3em;border-radius:99px;background:#dbe2e9;margin-bottom:.3em;width:70%}
.mk-gd .shot i.s{width:40%;background:var(--rc);opacity:.6}
/* ---- photo-real mockups (v6) ---- */
.mk-card .av.ph{padding:0;overflow:hidden;background:#dfe6ee;box-shadow:0 0 0 .12em #fff,0 0 0 .2em color-mix(in srgb,var(--rc) 40%,#fff)}
.mk-card .av.ph img{width:100%;height:100%;object-fit:cover;display:block}
.mk-vid .fr{background:#0f1720 url(/assets/crew/photos/sermon.webp) center/cover no-repeat}
.mk-vid .fr::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,.45))}
.mk-vid .sp{display:none}
.mk-vid .lt,.mk-vid .vcc{z-index:1}
.mk-vid .vcc{background:rgba(0,0,0,.55);border-color:rgba(255,255,255,.85)}
.mk-sl .big{background:linear-gradient(90deg,#0f1720 0,#0f1720 40%,rgba(15,23,32,.55) 62%,rgba(15,23,32,.1)),url(/assets/crew/photos/worship.webp) right center/62% auto no-repeat,#0f1720}
.mk-sl .ph{background:none}
.mk-sl .th .v0{background:linear-gradient(0deg,rgba(0,0,0,.6),rgba(0,0,0,.05) 70%),url(/assets/crew/photos/worship.webp) center/cover}
.mk-sl .th .v1{background:linear-gradient(0deg,rgba(0,0,0,.6),rgba(0,0,0,.05) 70%),url(/assets/crew/photos/bible.webp) center/cover}
.mk-sl .th .v2{background:linear-gradient(0deg,rgba(0,0,0,.6),rgba(0,0,0,.05) 70%),url(/assets/crew/photos/outreach.webp) center/cover}
.mk-bul .cv{background:linear-gradient(180deg,rgba(10,20,20,.05) 25%,rgba(10,20,20,.78)),url(/assets/crew/photos/church.webp) center/cover}
.mk-bul .cv b,.mk-bul .cv span{text-shadow:0 1px 3px rgba(0,0,0,.5)}
.mk-blog .hero{background:linear-gradient(0deg,rgba(0,0,0,.6),rgba(0,0,0,0) 65%),url(/assets/crew/photos/bible.webp) center/cover}
.mk-soc span{position:relative}
.mk-soc .g0{background:linear-gradient(0deg,rgba(0,0,0,.72),rgba(0,0,0,0) 62%),url(/assets/crew/photos/worship.webp) center/cover}
.mk-soc .g1{background:linear-gradient(0deg,rgba(0,0,0,.72),rgba(0,0,0,0) 62%),url(/assets/crew/photos/youth.webp) center/cover}
.mk-soc .g2{background:linear-gradient(0deg,rgba(0,0,0,.72),rgba(0,0,0,0) 62%),url(/assets/crew/photos/outreach.webp) center/cover}
.mk-soc em{opacity:1}
.mk-pry .phd{background:linear-gradient(90deg,rgba(28,20,48,.92),rgba(28,20,48,.55)),url(/assets/crew/photos/bible.webp) center/cover}
.mk-pry .phd em{opacity:1}
.mk-ann .pst{background:linear-gradient(180deg,rgba(0,0,0,.05) 20%,rgba(0,0,0,.8)),url(/assets/crew/photos/youth.webp) center/cover}
.mk-ann .pst span{opacity:1}
.mk-post .img{background:url(/assets/crew/photos/worship.webp) center/cover}
.mk-bar{background:#f3f5f8}
.mk-bar b.app{display:inline-flex;align-items:center;gap:.4em;margin-left:.6em;padding:.2em .6em .2em .35em;border-radius:.4em;background:#fff;border:1px solid #e3e8ee;font-weight:700;font-size:.86em;color:#1e2833;white-space:nowrap}
.mk-bar b.app img{width:1.15em;height:1.15em;object-fit:contain}
.mk-bar b.app+span{margin-left:.4em;font-weight:600;color:#5f6b78}
.mk-bul .orn{display:none}
/* ---- weekly routine mock ---- */
.mk-rt{display:flex;flex-direction:column;gap:.5em}
.mk-rt .rhd{display:flex;align-items:center;gap:.5em}
.mk-rt .clk{width:1.7em;height:1.7em;border-radius:.45em;display:grid;place-items:center;background:#0f1720;color:#fff;flex:none}
.mk-rt .clk svg{width:1em;height:1em}
.mk-rt .rhd b{font-size:.98em;color:#0f1720}
.mk-rt .rhd em{margin-left:auto;font-style:normal;font-weight:800;font-size:.7em;letter-spacing:.06em;color:#1d6b3c;background:#e6f4ea;border-radius:99px;padding:.3em .7em;white-space:nowrap}
.mk-rt .fd{display:flex;align-items:center;gap:.45em;font-size:.78em;font-weight:700;color:#3d4752;background:#f3f5f8;border:1px solid #e6ebf0;border-radius:.4em;padding:.35em .55em;white-space:nowrap;overflow:hidden}
.mk-rt .fd img{width:1.2em;height:1.2em}
.mk-rt .th{display:grid;grid-template-columns:repeat(3,1fr);gap:.4em}
.mk-rt .th span{position:relative;aspect-ratio:4/3;border-radius:.4em;background-size:cover;background-position:center;overflow:hidden;display:flex;align-items:flex-end;background-color:#e9eef3}
.mk-rt .th span::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,.7))}
.mk-rt .th em{position:relative;font-style:normal;font-weight:800;font-size:.66em;color:#fff;padding:.35em .45em;white-space:nowrap}
.mk-rt .th .lg2{background:#fff;border:1px solid #e6ebf0;flex-direction:column;align-items:center;justify-content:center;gap:.3em}
.mk-rt .th .lg2::before{display:none}
.mk-rt .th .lg2 img{width:2em;height:2em;object-fit:contain}
.mk-rt .th .lg2 em{color:#3d4752;padding:0}
.mk-rt .st{list-style:none;margin:0;padding:0;display:grid;gap:.28em}
.mk-rt .st li{display:flex;align-items:center;gap:.45em;font-size:.8em;font-weight:600;color:#1e2833;line-height:1.25}
.mk-rt .st i{flex:none;width:1.25em;height:1.25em;border-radius:50%;display:grid;place-items:center}
.mk-rt .st i svg{width:.85em;height:.85em}
.mk-rt .st .s-ok i{background:#e6f4ea;color:#1d6b3c}
.mk-rt .st .s-wait i{background:#fdf3dc;color:#7a5a0c}
.mk-rt .fu{font-size:.74em;font-weight:700;color:#5c4210;background:#fdf6e6;border-radius:.4em;padding:.4em .6em;line-height:1.3}
/* ---- on-site task schedule ---- */
.mk-os{display:flex;flex-direction:column;gap:.32em}
.mk-os .r{display:grid;grid-template-columns:5.2em minmax(0,1fr) auto auto;gap:.5em;align-items:center;padding:.35em .45em;border:1px solid #e6ebf0;border-radius:.45em;background:#fff;font-size:.8em}
.mk-os .dy{font-weight:800;color:#0f1720;background:#f3f5f8;border-radius:.3em;padding:.2em .35em;text-align:center;white-space:nowrap;font-size:.92em}
.mk-os b{font-weight:700;color:#1e2833;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mk-os .p{display:flex;align-items:center;gap:.3em;font-weight:600;color:#3d4752;white-space:nowrap}
.mk-os .p img{width:1.5em;height:1.5em;border-radius:50%;object-fit:cover}
.mk-os em{font-style:normal;font-weight:800;font-size:.85em;color:#5c4210;background:#fdf6e6;border-radius:99px;padding:.2em .55em;white-space:nowrap}
.mk-os em.cf{color:#1d6b3c;background:#e6f4ea}
.mk-os .fu{font-size:.74em;font-weight:700;color:#5c4210;background:#fdf6e6;border-radius:.4em;padding:.4em .6em;line-height:1.3;margin-top:.15em}
.mk-rt{gap:.4em}
.mk-rt .th span{aspect-ratio:16/9}
.mk-rt .fd{padding:.28em .5em}
.mk-rt .fu,.mk-os .fu{padding:.32em .55em}
/* ---- alignment pass (v9) ---- */
.mk-body{display:flex;flex-direction:column;justify-content:center}
.mk-body>*{flex:none;min-width:0}
.mk-bar span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.mk-bar b.app{flex:none}
.mk-bar em{flex:none}
.mk-mbx{height:auto;min-height:100%}
.mk-mbx .cp{min-width:0;overflow:hidden;align-self:center}
.mk-mbx .sd em{display:inline-grid;place-items:center;min-width:1.7em;height:1.5em;padding:0 .35em;line-height:1;font-weight:800}
.mk-mbx .sd li{align-items:center}
.mk-mbx .mk-note{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mk-vid{height:auto;grid-template-rows:auto auto}
.mk-vid .nt{align-content:center}
.mk-vid .nt li{align-items:flex-start;font-size:.8em}
.mk-vid .nt i{margin-top:.15em}
.mk-vid .tln{height:2.6em;padding:.95em .4em .35em}
.mk-vid .tln .t{top:.15em;line-height:1}
.mkb-cal{justify-content:flex-start}
.mkb-cal .mk-cal{flex:1;grid-template-rows:auto repeat(6,minmax(1.4em,1fr))}
.mk-cal .ev{font-size:.74em;display:flex;align-items:center}
.mk-rt .th span{aspect-ratio:2/1}
.mk-rt .st li{font-size:.76em}
.mk-rt .rhd b{font-size:.92em}
.mk-brn{height:auto}
.mk-brn .qa p{font-size:.72em}
.tl.M .mk-rt .fu{display:none}
.tl .mk-rt{gap:.3em}
.tl .mk-rt .st{gap:.2em}
.mk-mbx .cp{align-self:start;padding-top:.2em}
/* pill text centering (Hanken Grotesk sits high at line-height 1) */
.mk-mbx .sd em{display:inline-block;min-width:2.3em;height:auto;text-align:center;line-height:1;padding:.3em .45em .2em;font-variant-numeric:tabular-nums}
.mk-bar em,.mk-card .tag,.mk-inbox em,.mk-rt .rhd em,.mk-os em{line-height:1;padding-top:.32em;padding-bottom:.22em}
/* ---- optical centering: Hanken Grotesk sits high, so pills and buttons get a little more room on top ---- */
.mk-b{padding:.47em .9em .33em;line-height:1.15}
.mk-bar b.app{padding:.3em .6em .14em .35em}
.mk-bar em,.mk-card .tag,.mk-inbox em,.mk-rt .rhd em,.mk-os em{padding-top:.38em;padding-bottom:.16em}
.mk-tbl th{padding:.45em .5em .25em}
.mk-cal .dh{padding:.4em 0 .2em}
.mk-cal .ev{padding:.28em .4em .12em}
.mk-web .wbtn{padding:.43em .8em .27em}
.mk-web .steps span{padding:.33em .6em .17em}
.mk-sms .b{padding:.56em .8em .44em}
.mk-alert .ic,.mk-gd .st em,.mk-vid .vcc{padding-top:.14em}
.mk-mbx .sd em{padding:.34em .45em .16em}
.mk-brn .qa p{padding:.42em .55em .28em}
.mk-os .dy{padding:.28em .35em .12em}
.mk-bar em,.mk-card .tag,.mk-inbox em,.mk-rt .rhd em,.mk-os em{padding-top:.33em;padding-bottom:.21em}
.mk-mbx .sd em{padding:.3em .45em .2em}
.mk-bar b.app{padding:.33em .6em .13em .35em}
.mk-alert .ic{padding-top:.2em}
.mk-vid .vcc{padding-top:.2em}
.mk-tbl th{padding:.42em .5em .28em}
.mk-cal .dh{padding:.42em 0 .18em}
/* ---- true centering where supported: trim the font's extra space, then pad evenly ---- */
@supports (text-box: trim-both cap alphabetic){
 .mk-b,.mk-bar b.app,.mk-bar em,.mk-card .tag,.mk-inbox em,.mk-rt .rhd em,.mk-os em,.mk-os .dy,.mk-tbl th,.mk-cal .dh,.mk-cal .ev,.mk-web .wbtn,.mk-web .steps span,.mk-mbx .sd em,.mk-rt .fu,.mk-os .fu,.mk-sms .b,.mk-brn .qa p,.mk-rt .st li,.mk-os .r b{text-box:trim-both cap alphabetic}
 .mk-b{padding:.5em .9em}
 .mk-bar b.app{padding:.32em .6em .32em .35em}
 .mk-bar em,.mk-card .tag,.mk-inbox em,.mk-rt .rhd em,.mk-os em{padding:.38em .65em}
 .mk-os .dy{padding:.32em .35em}
 .mk-tbl th{padding:.5em .5em}
 .mk-cal .dh{padding:.45em 0}
 .mk-cal .ev{padding:.32em .4em}
 .mk-web .wbtn{padding:.48em .8em}
 .mk-web .steps span{padding:.38em .6em}
 .mk-mbx .sd em{padding:.36em .45em}
 .mk-rt .fu,.mk-os .fu{padding:.5em .6em}
 .mk-sms .b{padding:.62em .8em}
 .mk-brn .qa p{padding:.45em .55em}
}
@supports (text-box: trim-both cap alphabetic){ .mk-bar b.app{padding:.2em .6em .2em .35em} }