body[data-view="intro"]{padding:0;min-height:100svh;background:#151b2c;color:#fff;overflow:hidden}
.intro-screen{position:fixed;inset:0;isolation:isolate;background:#151b2c;display:grid;place-items:center}
.intro-video{display:block;width:100%;height:100%;object-fit:contain;background:#151b2c}
.intro-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:#151b2c55;padding:30px;text-align:center;pointer-events:none}
.intro-overlay p{font-size:16px;line-height:1.7;margin:0;color:white;text-shadow:0 2px 8px #0009;background:#151b2cb0;border:1px solid #ffffff24;padding:12px 22px;border-radius:16px}
.intro-play{pointer-events:auto;font-size:16px;min-height:48px;padding:12px 28px;border-radius:28px;background:#f4f7ff;color:#273156;border:1px solid white;box-shadow:0 8px 30px #0003}
.intro-actions{position:absolute;left:max(18px,env(safe-area-inset-left));right:max(18px,env(safe-area-inset-right));bottom:max(10px,env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:space-between;gap:12px;z-index:2}
.intro-playback{display:flex;align-items:center;gap:8px}
.intro-control,.intro-skip{color:#fff;background:#151b2ccf;border:1px solid #ffffff50;border-radius:8px;font-size:14px;font-weight:500;line-height:1.5;min-height:40px;padding:7px 12px;white-space:nowrap;text-shadow:none;box-shadow:none}
.intro-control:hover,.intro-skip:hover{background:#25314be8;border-color:#ffffff90;color:#fff}
.intro-overlay.is-ended{background:transparent;justify-content:flex-end;padding-bottom:64px}
.intro-overlay.is-ended p{background:#151b2c70;border:0;font-size:14px;padding:8px 14px}
.intro-screen button:focus-visible{outline:2px solid white;outline-offset:4px}
@media(max-width:600px){.intro-actions{left:max(8px,env(safe-area-inset-left));right:max(8px,env(safe-area-inset-right));bottom:max(6px,env(safe-area-inset-bottom));gap:8px}.intro-overlay{padding:20px}.intro-overlay.is-ended{padding-bottom:60px}}