/* Visual portfolio additions. Scoped to home, collection cards and media-first details. */
#hero.ms-hero { min-height:0; padding:2.5rem 0 1.5rem!important; }
.ms-hero-inner { width:100%; grid-template-columns:1fr 160px; gap:2rem; }
.ms-hero-portrait img { width:136px; height:136px; }
.ms-hero h1 { font-size:clamp(2.2rem,5vw,3.5rem); }
.ms-hero .ms-lead { max-width:42rem; margin-bottom:1rem; }
.ms-kicker { margin-bottom:.7rem; }
.visual-projects { padding:2rem 0 3rem; }
.work-jumps { display:flex; justify-content:center; gap:.5rem 1.5rem; flex-wrap:wrap; padding:0 1rem; }
.work-jumps a { color:var(--ms-rose-deep); text-underline-offset:5px; }
.work-collection { scroll-margin-top:100px; margin:2.4rem auto 0; }
.collection-heading { max-width:1100px; margin:0 auto 1.2rem; padding:0 1.25rem; }
.collection-heading h2 { font-size:1.5rem; margin:0 0 .3rem; }
.collection-heading p { color:var(--ms-muted); margin:0; font-size:.9rem; }
.visual-projects .ms-works-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.5rem; }
.visual-work:hover { transform:translateY(-3px); }
.visual-work .ms-work-cover { display:block; aspect-ratio:16/9; background:#17151b; }
.visual-work .ms-work-cover img { object-fit:contain; }
.visual-work:hover .ms-work-cover img { transform:none; }
.ms-work-heading { display:flex; justify-content:space-between; gap:.65rem; align-items:start; flex-wrap:wrap; }
.visual-work .ms-work-title { font-size:1.45rem; }
.ms-work-title a { text-decoration:none; color:inherit; }
.ms-work-actions { display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; margin-top:.65rem; }
.ms-action { display:inline-flex; align-items:center; gap:.4rem; min-height:42px; padding:.45rem .9rem; border:1px solid currentColor; border-radius:2rem; color:var(--ms-rose-deep); text-decoration:none; font-size:.85rem; font-weight:600; }
.ms-action:hover { background:rgba(232,90,122,.1); }
.ms-detail-link { margin-left:auto; padding:.55rem 0 .55rem .5rem; color:var(--ms-rose-deep); font-size:.9rem; }
.ms-image-note { font-size:.7rem; color:var(--ms-muted); margin:.45rem 0 0; }
.ms-about-details > summary { cursor:pointer; font-weight:600; padding:.4rem 0; }
.ms-about-details[open] > summary { margin-bottom:1rem; }
.media-first .container { max-width:1060px; }
.media-first .title { margin-bottom:1.5rem!important; }
.media-first .title h1 { font-size:clamp(2rem,5vw,3rem); }
.project-back { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:.75rem; margin:0 0 1.75rem; font-size:.78rem; }
.project-back a { color:inherit; text-underline-offset:4px; }
.project-back span { opacity:.75; }
.media-first .meta { display:none; }
.project-one-line { font-size:clamp(1.15rem,3vw,1.5rem); margin-bottom:.7rem; }
.project-availability,.archive-intro { font-size:.9rem; opacity:.85; line-height:1.7; margin:1rem 0 1.5rem; max-width:75ch; }
.project-capture img { width:100%; height:auto; max-height:640px; object-fit:contain; background:#151218; border-radius:12px; }
.project-visuals figcaption { margin:.65rem 0 1.4rem; font-size:.8rem; line-height:1.5; opacity:.8; }
.gameplay-sketch { padding:1.25rem; border:1px solid currentColor; border-radius:12px; margin:1.8rem 0; }
.gameplay-sketch p { font-size:.8rem; margin:0 0 1rem; }
.gameplay-sketch p span { opacity:.7; }
.gameplay-sketch ol { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); list-style:none; padding:0; margin:0; gap:1rem; }
.gameplay-sketch li { display:flex; gap:.65rem; align-items:center; font-size:clamp(.85rem,2vw,1.15rem); }
.step-number { border:1px solid currentColor; border-radius:50%; width:2rem; height:2rem; flex:none; display:grid; place-items:center; }
.project-watch { margin-top:2.5rem; scroll-margin-top:100px; }
.project-watch h2 { margin-bottom:1.3rem; }
.video-launch { width:100%; display:block; padding:0; border:0; background:#100d17; color:#fff; aspect-ratio:16/9; position:relative; overflow:hidden; border-radius:12px; cursor:pointer; }
.video-launch img { width:100%; height:100%; object-fit:contain; opacity:.76; }
.video-play { position:absolute; left:50%; top:45%; transform:translate(-50%,-50%); background:#b42e57; width:76px; height:76px; border-radius:50%; display:grid; place-items:center; font-size:2.8rem; }
.video-title { position:absolute; bottom:0; left:0; width:100%; padding:1.3rem; background:linear-gradient(transparent,rgba(0,0,0,.85)); font-size:1rem; }
.project-watch iframe,.project-watch video { width:100%; aspect-ratio:16/9; border:0; border-radius:12px; background:#100d17; }
.project-gallery { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.5rem; margin-top:2rem; }
.project-gallery img { width:100%; height:auto; max-height:500px; object-fit:contain; }
.project-gallery figure:only-child { grid-column:1/-1; }
.project-archive { margin:2rem 0; border-top:1px solid currentColor; padding-top:1.5rem; }
.project-archive > summary { font-size:1.2rem; cursor:pointer; padding:.7rem 0; }
.project-archive .page-content { overflow-wrap:anywhere; }
.project-archive .page-content img { max-width:100%; }
a:focus-visible,button:focus-visible,summary:focus-visible { outline:3px solid #c66b36; outline-offset:5px; }
@media(max-width:640px) {
 .ms-hero-inner { grid-template-columns:1fr; text-align:left; gap:0; }
 .ms-hero-portrait { display:none; }
 .ms-hero-actions { justify-content:flex-start; }
 .ms-hero .ms-lead { font-size:1rem; }
 .visual-projects .ms-works-grid { grid-template-columns:1fr; gap:1.3rem; }
 .visual-work .ms-work-title { font-size:1.3rem; }
 .ms-work-body { padding:1rem; }
 .project-gallery { grid-template-columns:1fr; }
 .gameplay-sketch ol { grid-template-columns:1fr; gap:.75rem; }
 .gameplay-sketch li { font-size:1rem; }
 .video-play { width:56px; height:56px; font-size:2rem; }
}
@media(prefers-reduced-motion:reduce) { html{scroll-behavior:auto;} .ms-hero-inner,.ms-hero-portrait,.ms-section,body::before,.star { animation:none!important; } }

/* Override the original theme's large paragraph and button margins. */
#hero.ms-hero { line-height:1.5; padding:1.8rem 0 1rem!important; }
#hero .ms-name { margin:.4rem 0!important; font-size:1.15rem; }
#hero .ms-studio { margin:.2rem 0!important; }
#hero .ms-lead { margin:.8rem 0 1rem!important; max-width:45rem; opacity:1; }
#hero .ms-hero-actions a.btn { margin-top:0; }
#hero .ms-hero-actions { align-items:center; }
#hero .ms-kicker { display:none; }
.visual-projects { padding-top:1.2rem; }
.work-collection { margin-top:1.7rem; }
@media(max-width:640px) { #hero.ms-hero { padding-top:1.2rem!important; } #hero .ms-name { font-size:1rem; } }

body:not(.game-themed) .media-first { --link:var(--ms-rose-deep); }
body:not(.game-themed) .media-first .project-archive .page-content { background:rgba(255,255,255,.7); }
/* Complete print-and-play edition, separate from the archived prototype rules. */
.print-edition { display:grid; grid-template-columns:230px 1fr; gap:35px; margin:30px 0 40px; padding:30px; border:1px solid #b59456; border-radius:13px; background:#17131b; color:#f5ebdc; scroll-margin-top:80px; }
.print-edition-cover { display:block; align-self:start; }
.print-edition-cover img { width:100%; height:auto; border-radius:4px; box-shadow:0 10px 25px #0005; }
.print-kicker { color:#d4ae6d; font-size:10px; letter-spacing:.12em; margin:0 0 12px; }
.print-edition h2 { color:#ffe8c0; font-size:32px; line-height:1.15; margin:0 0 16px; }
.print-edition-copy > p:not(.print-kicker) { font-size:13px; line-height:1.8; }
.print-edition ul { padding-left:18px; font-size:12px; line-height:1.8; margin:18px 0; }
.print-edition li { margin-bottom:6px; }
.print-edition .ms-action { background:#a82647; color:#fff2e8; border-color:#bf4560; border-radius:7px; font-size:12px; }
.print-edition .portfolio-icon { width:18px; height:18px; }
.print-rule-link { color:#e0c087!important; font-size:11px; padding:12px 0; }
.print-edition-copy .print-small { color:#beaeb8; font-size:10px!important; margin:18px 0; }
.print-edition details { font-size:11px; line-height:1.8; color:#d1c2cc; border-top:1px solid #69584f; padding-top:12px; }
.print-edition summary { cursor:pointer; min-height:40px; }
.print-edition details a { color:#e0c087; }
@media(max-width:760px) { .print-edition { grid-template-columns:1fr; padding:24px; gap:25px; } .print-edition-cover { max-width:230px; justify-self:center; } .print-edition h2 { font-size:29px; } }