/* Phase 11: vertical, immersive, keyboard-operable Media Snacks. */
.snack11-page{background:var(--page-bg,#101012);padding-bottom:55px;min-height:80vh}.snack11-intro{display:flex;align-items:end;justify-content:space-between;gap:20px;padding-top:32px;padding-bottom:20px}.snack11-intro h1{font-size:clamp(2rem,5vw,4rem);line-height:1.05;letter-spacing:-.055em;margin:4px 0 8px}.snack11-intro p{max-width:520px;color:var(--muted,#aaa)}.snack11-library{color:var(--accent,#e99554);font-weight:700;text-decoration:none;white-space:nowrap}.snack11-layout{display:grid;grid-template-columns:minmax(0,1fr) 190px;gap:26px;max-width:920px}.snack11-list{height:min(79svh,790px);min-height:410px;overflow-y:auto;overflow-x:hidden;scroll-snap-type:y mandatory;overscroll-behavior-y:contain;scrollbar-color:#75685f transparent;scrollbar-width:thin;border-radius:14px;outline-offset:4px}.snack11-list:focus-visible{outline:3px solid var(--accent,#e99554)}.snack11-reel{scroll-snap-align:start;scroll-snap-stop:always;height:100%;max-height:100%;display:flex;justify-content:center;position:relative;padding:2px 14px}.snack11-screen{position:relative;width:min(100%,430px);height:100%;overflow:hidden;background:#101113;border-radius:12px;color:#fff;isolation:isolate;border:1px solid rgba(255,255,255,.12)}.snack11-poster,.snack11-video,.snack11-iframe{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:0}.snack11-poster{z-index:0}.snack11-video,.snack11-iframe{z-index:1}.snack11-iframe:not([src]){visibility:hidden}.snack11-tint{position:absolute;z-index:2;inset:0;pointer-events:none;background:linear-gradient(0deg,rgba(0,0,0,.87),rgba(0,0,0,0) 55%,rgba(0,0,0,.35))}.snack11-top{position:absolute;top:19px;left:20px;right:18px;z-index:3;display:flex;justify-content:space-between;align-items:center}.snack11-pill,.snack11-duration{background:rgba(12,14,16,.67);border:1px solid rgba(255,255,255,.22);padding:5px 10px;border-radius:6px;font-size:.72rem;font-weight:800;letter-spacing:.08em}.snack11-play-toggle{position:absolute;z-index:4;top:44%;left:50%;transform:translate(-50%,-50%);width:65px;height:65px;border:1px solid rgba(255,255,255,.6);border-radius:50%;background:rgba(12,12,12,.52);color:white;font-size:24px;cursor:pointer;transition:opacity .2s}.snack11-reel.is-playing .snack11-play-toggle{opacity:0}.snack11-reel.is-playing .snack11-play-toggle:focus-visible,.snack11-reel.is-playing .snack11-play-toggle:hover{opacity:1}.snack11-content{position:absolute;z-index:3;bottom:22px;left:20px;right:87px;text-shadow:0 1px 4px #000}.snack11-overline{font-size:.72rem;font-weight:800;letter-spacing:.16em;color:#e9a372;margin:0 0 6px}.snack11-content h2{font-weight:800;font-size:clamp(1.25rem,3vw,1.95rem);line-height:1.13;margin:0 0 9px}.snack11-desc{font-size:.82rem;line-height:1.4;max-height:4.1em;overflow:hidden;color:#efeded;margin:0 0 12px}.snack11-film-link{display:inline-block;padding:9px 12px;border-radius:5px;background:#dc8547;color:#201309;text-shadow:none;font-weight:800;font-size:.81rem;text-decoration:none}.snack11-film-link:hover{color:#201309;background:#f4ad6a}.snack11-rail{position:absolute;z-index:4;right:12px;bottom:23px;display:flex;flex-direction:column;gap:13px;align-items:center}.snack11-action-form{margin:0}.snack11-rail-button{background:rgba(20,21,22,.54);border:1px solid rgba(255,255,255,.28);border-radius:10px;color:white!important;min-width:62px;min-height:57px;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:7px 5px;text-decoration:none;cursor:pointer;text-shadow:0 1px 2px #000}.snack11-rail-button>span{font-size:23px;line-height:1.1}.snack11-rail-button small{font-size:.65rem;line-height:1.2}.snack11-rail-button.is-active{background:#9f473b;border-color:#ffd0af}.snack11-rail-button:focus-visible,.snack11-play-toggle:focus-visible,.snack11-film-link:focus-visible{outline:3px solid #ffcc8f;outline-offset:3px}.snack11-side{position:sticky;top:90px;align-self:start;color:var(--muted,#bbb);padding-top:15px}.snack11-side p{max-width:150px}.snack11-arrows{display:flex;gap:9px;margin:18px 0}.snack11-arrows button{border:1px solid var(--accent,#de874c);background:transparent;color:var(--accent,#de874c);border-radius:50%;font-size:22px;width:47px;height:47px;cursor:pointer}.snack11-pagination{display:flex;flex-wrap:wrap;gap:12px}.snack11-pagination a{color:var(--accent,#db904a)}.snack11-page-count{font-weight:700}.snack11-action-form button:disabled{opacity:.5;cursor:wait}
@media(max-width:768px){.snack11-intro{padding-top:15px;padding-bottom:12px;align-items:start}.snack11-intro h1{font-size:1.95rem}.snack11-intro p{font-size:.8rem;margin:0}.snack11-library{font-size:.78rem}.snack11-layout{display:block;padding:0}.snack11-list{height:calc(100svh - 175px);min-height:360px;border-radius:0;scrollbar-width:none}.snack11-list::-webkit-scrollbar{display:none}.snack11-reel{padding:0}.snack11-screen{max-width:460px;border-radius:0}.snack11-side{position:static;max-width:460px;margin:0 auto;display:flex;gap:20px;align-items:center;justify-content:space-between;padding:12px}.snack11-side>p:not(.snack11-page-count){display:none}.snack11-arrows{margin:0}.snack11-arrows button{width:35px;height:35px;font-size:17px}.snack11-rail-button{min-height:50px;min-width:54px}}
@media(max-width:420px){.snack11-intro{padding-left:12px;padding-right:12px}.snack11-content{left:15px;right:79px}.snack11-top{left:15px;right:14px}.snack11-rail{right:8px}.snack11-rail-button{min-width:50px}}
@media(prefers-reduced-motion:reduce){.snack11-play-toggle{transition:none}.snack11-list{scroll-behavior:auto}}
