.mg--gen4 .mg-story--practice{row-gap:72px}
.mg--gen4 .mg-story--practice>figure{grid-column:1/-1;width:min(100%,740px);margin-inline:auto}
.mg4-practice{grid-column:1/-1;grid-row:3;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:8%;width:100%;color:var(--mg-ink,#173f35)}
.mg4-practice__copy{text-align:center;min-width:0}
.mg .mg4-practice h2{font-size:clamp(38px,3.6vw,56px);line-height:1.15;letter-spacing:-.02em}
.mg4-practice__copy>p{max-width:540px;margin:26px auto 0;font-size:16px;line-height:1.8;color:var(--mg-muted,#53665e)}
.mg4-practice__film{display:block;position:relative;min-width:0;width:100%;aspect-ratio:1.12;overflow:hidden;border-radius:16px;background:#242629}
.mg4-practice__film>.mg4-practice__preview{display:block;width:100%;height:100%;object-fit:cover}
.mg4-practice__film::after{content:"";position:absolute;inset:55% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.4));pointer-events:none}
.mg4-practice__control{position:absolute;z-index:1;bottom:58px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:64px;min-width:150px;border:0;border-radius:0;padding:8px 16px;background:transparent;color:#fff;font:500 14px/1.4 var(--f_family_2,Arial,sans-serif);cursor:pointer;text-shadow:0 1px 10px #0008}
.mg4-practice__control:hover [data-film-symbol]{transform:scale(1.08)}
.mg4-practice__control:focus-visible{outline:3px solid #fff;outline-offset:4px}
.mg4-practice__control [data-film-symbol]{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;padding-inline-start:2px;background:#fff;color:#26352e;font:15px/1 Arial,sans-serif;text-shadow:none;transition:transform .18s}
.mg4-practice__preview-control{position:absolute;z-index:1;bottom:10px;inset-inline-end:10px;display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:transparent;color:#fff;cursor:pointer;font:18px/1 Arial,sans-serif;text-shadow:0 1px 8px #000}
.mg4-practice__preview-control:focus-visible{outline:2px solid white;outline-offset:0}
.mg4-film-dialog{position:fixed;inset:0;width:100%;max-width:none;height:100vh;height:100dvh;max-height:none;margin:0;padding:64px 40px;border:0;background:transparent;overflow:hidden;color:#fff}
.mg4-film-dialog[open]{display:grid;place-items:center}
.mg4-film-dialog::backdrop{background:rgba(18,20,19,.48);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}
.mg4-film-dialog__panel{position:relative;width:min(1100px,100%,calc((100dvh - 128px)*16/9));min-width:0}
.mg4-film-dialog .mg4-film-dialog__video{display:block;width:100%;height:auto;aspect-ratio:16/9;max-height:calc(100dvh - 128px);object-fit:contain;background:#000;border-radius:0}
.mg4-film-dialog__close{position:absolute;inset-inline-end:-8px;top:-50px;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:transparent;color:#fff;cursor:pointer;font:300 34px/1 Arial,sans-serif}
.mg4-film-dialog__close:hover{background:#ffffff24}
.mg4-film-dialog__close:focus-visible{outline:2px solid white;outline-offset:2px}
@media(max-width:749px){
 .mg--gen4 .mg-story--practice{row-gap:0}

 .mg4-practice{order:2;display:block;padding:40px 14px 0;box-sizing:border-box}
 .mg4-practice__copy{padding-inline:8px}
 .mg .mg4-practice h2{font-size:38px;line-height:1.15}
 html[lang^="zh"] .mg .mg4-practice h2{font-size:33px;line-height:1.35}
 .mg4-practice[dir="rtl"] h2{font-size:33px;line-height:1.45}
 .mg4-practice__copy>p{font-size:14px;line-height:1.8;margin-top:24px}
 .mg4-practice__film{margin-top:36px;border-radius:16px;aspect-ratio:9/16}
 .mg4-practice__control{bottom:60px}
 .mg4-film-dialog{padding:64px 40px}
}
@media(prefers-reduced-motion:reduce){.mg4-practice__control [data-film-symbol]{transition:none}}