.reel-panel,.reel-prompt-card{--reel-card-bg:var(--surface-2);--reel-hairline:color-mix(in srgb, var(--text-1) 8%, transparent);--reel-card-edge:inset 0 0 0 1px var(--reel-hairline)}.reel-panel{background:var(--surface-1);min-height:0;box-shadow:var(--shadow-dialog);color:var(--text-1);border-radius:16px;flex-direction:column;display:flex;overflow:hidden}.reel-panel-head{flex:none;align-items:center;gap:12px;padding:16px;display:flex}.reel-panel-avatar{background:var(--accent);width:36px;height:36px;color:var(--on-accent);border-radius:999px;flex:none;place-items:center;font-size:14px;font-weight:600;line-height:20px;display:grid}.reel-panel-body{overscroll-behavior:contain;flex-direction:column;flex:1;justify-content:flex-start;gap:8px;min-height:0;padding:0 16px 16px;display:flex;overflow-y:auto}.reel-block{background:var(--reel-card-bg);box-shadow:inset 0 1px 0 color-mix(in srgb, var(--text-1) 10%, transparent), var(--reel-card-edge);border-radius:12px;flex:none;padding:12px}.reel-block-label{margin:0 0 var(--small-gap);color:var(--text-2);font-size:var(--small-caption-size);font-weight:500;line-height:var(--small-caption-line);align-items:center;gap:6px;display:flex}.reel-block-count{color:var(--text-3);font-family:var(--font-number);font-size:var(--small-caption-size);line-height:var(--small-caption-line)}.reel-inputs{flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none;display:flex}.reel-inputs li{background:var(--surface-3);border-radius:10px;width:64px;height:64px;position:relative;overflow:hidden}.reel-inputs img{object-fit:cover}.reel-panel-foot{border-top:1px solid var(--reel-hairline);flex:none;padding:12px 16px 16px}.reel-actions{flex-direction:column;gap:8px;display:flex}.reel-actions-main{justify-content:center;width:100%}.reel-panel-identity{flex:1;align-items:center;gap:10px;min-width:0;display:flex}.reel-panel-kicker{color:var(--text-3);font-size:var(--small-caption-size);font-weight:400;line-height:var(--small-caption-line);margin:0}.reel-panel-author{overflow-wrap:anywhere;align-items:baseline;gap:6px;min-width:0;margin:0;font-size:13px;font-weight:500;line-height:20px;display:flex}.reel-prompt-heading{justify-content:space-between;align-items:center;gap:8px;min-height:24px;margin-bottom:10px;display:flex}.reel-prompt-heading .reel-block-label{margin:0}.reel-prompt-text{--reel-prompt-lines:5;max-height:calc(var(--reel-prompt-lines) * 22px);color:var(--text-1);overflow-wrap:anywhere;white-space:pre-wrap;margin:0;font-size:13px;line-height:22px;overflow:hidden}.reel-prompt-text[data-fade]{-webkit-mask-image:linear-gradient(to bottom, var(--text-1) 60%, transparent);mask-image:linear-gradient(to bottom, var(--text-1) 60%, transparent)}.reel-prompt-text[data-expanded]{max-height:none}.reel-panel .prompt-ref-strip{scrollbar-width:none;gap:8px;margin:0 -11px 10px;padding:1px 11px 2px}.reel-panel .prompt-ref-card{border-color:var(--reel-hairline);width:72px;transition:transform var(--dur-base) var(--ease-ui);border-radius:10px;flex-basis:72px}.reel-panel .prompt-ref-index{min-width:18px;height:18px;font-family:var(--font-number);font-variant-numeric:tabular-nums;place-items:center;padding:0 4px;display:grid;top:4px;left:4px}.reel-panel .prompt-ref-replaceable{padding:0 5px;bottom:4px;right:4px}.reel-panel .prompt-ref-tag{height:18px;box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--accent) 32%, transparent);vertical-align:-3px;background:0 0;border:0;border-radius:5px;gap:4px;margin:0 2px;padding:0 6px 0 1px;font-family:inherit;line-height:18px}.reel-panel .prompt-ref-tag img{border-radius:3px;width:14px;height:14px}.reel-panel .prompt-ref-tag[data-active]{background:var(--accent);box-shadow:none}.reel-panel .prompt-ref-index-word{display:none}.reel-panel .prompt-ref-card:hover{border-color:color-mix(in srgb, var(--text-1) 28%, transparent);transform:translateY(-1px)}.reel-panel .prompt-ref-card:after{content:"";border-radius:inherit;box-shadow:inset 0 0 0 2px var(--accent);opacity:0;pointer-events:none;transition:opacity var(--dur-base) var(--ease-ui);position:absolute;inset:0}.reel-panel .prompt-ref-card[data-active]{border-color:var(--accent);box-shadow:0 4px 12px color-mix(in srgb, var(--accent) 24%, transparent);transform:translateY(-1px)}.reel-panel .prompt-ref-card[data-active] .prompt-ref-index{background:var(--accent);color:var(--on-accent)}.reel-panel .prompt-ref-card[data-active]:after{opacity:1}.reel-panel .prompt-ref-card:hover img,.reel-panel .prompt-ref-card[data-active] img{filter:brightness(1.1)}.reel-prompt-text:focus-visible,.reel-input-thumb:focus-visible{outline:2px solid var(--text-2);outline-offset:2px}.reel-prompt-card{border:1px solid var(--reel-hairline);padding:11px;overflow:clip}.reel-panel .reel-block.reel-prompt-card,.reel-prompt-samples .reel-prompt-card{background:linear-gradient(to bottom, color-mix(in srgb, var(--accent) 5%, var(--reel-card-bg)), var(--reel-card-bg) 96px)}.reel-prompt-card .reel-block-label>svg{color:var(--accent)}.reel-prompt-foot{justify-content:center;margin:2px -11px -11px;padding:0 11px;display:flex}.reel-prompt-card[data-open] .reel-prompt-foot{z-index:1;border-top:1px solid var(--reel-hairline);background:var(--reel-card-bg);margin-top:6px;position:sticky;bottom:-16px}.reel-slide .reel-prompt-card[data-open] .reel-prompt-foot{bottom:0}.reel-prompt-toggle{width:100%;min-height:32px;color:var(--accent);font-size:var(--small-caption-size);line-height:var(--small-caption-line);cursor:pointer;background:0 0;border:0;justify-content:center;align-items:center;gap:4px;padding:0;display:inline-flex}.reel-prompt-toggle:focus-visible{outline:2px solid var(--text-2);outline-offset:-2px;border-radius:8px}.reel-prompt-toggle svg{transition:transform var(--dur-base) var(--ease-ui)}.reel-prompt-card[data-open] .reel-prompt-toggle svg{transform:rotate(180deg)}.reel-prompt-toggle:hover svg{transform:translateY(1px)}.reel-prompt-card[data-open] .reel-prompt-toggle:hover svg{transform:rotate(180deg)translateY(1px)}.reel-prompt-card .reel-prompt-copy.reel-prompt-copy{height:24px;min-height:24px;color:var(--text-2);font-size:var(--small-caption-size);margin-right:-6px;padding:0 6px;font-weight:400}.reel-prompt-card .reel-prompt-copy.reel-prompt-copy:hover{color:var(--text-1)}.reel-block-hint{color:var(--text-3);font-weight:400}.reel-panel-names{gap:1px;min-width:0;display:grid}.reel-panel-role{color:var(--text-3);font-size:var(--small-caption-size);font-weight:400;line-height:var(--small-caption-line)}.reel-panel-sub{flex-wrap:wrap;align-items:center;gap:6px;min-width:0;display:flex}.reel-prompt-note{align-items:flex-start;gap:var(--small-gap);margin:var(--small-gap) 0 0;color:var(--text-2);font-size:var(--small-caption-size);line-height:var(--small-caption-line);display:flex}.reel-prompt-note svg{flex:none;margin-top:2px}.reel-prompt-locked .q1-placeholder-prompt>span{background:var(--text-2);height:8px}.reel-prompt-locked .q1-lock-preview{min-height:112px}.reel-input-thumb{cursor:zoom-in;background:0 0;border:0;width:100%;height:100%;padding:0;display:block;position:relative}.reel-input-lightbox{--dialog-width:960px}.reel-input-lightbox img{object-fit:contain;width:100%;height:auto;max-height:70dvh;display:block}.reel-tools{flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none;display:flex}.reel-tool{border-radius:var(--radius-control);background:var(--surface-1);min-height:36px;box-shadow:inset 0 0 0 1px var(--border);color:var(--text-1);align-items:center;gap:8px;padding:0 8px;font-size:14px;font-weight:500;text-decoration:none;display:inline-flex}.reel-tool:hover{box-shadow:inset 0 0 0 1px var(--border-strong)}.reel-tool>svg{color:var(--text-2)}.reel-tool-icon{background:var(--accent);width:24px;height:24px;color:var(--on-accent);font-size:var(--small-caption-size);line-height:var(--small-caption-line);border-radius:8px;flex:none;place-items:center;display:grid;position:relative;overflow:hidden}.reel-tool-icon img{object-fit:cover}.reel-parameters{flex-wrap:wrap;gap:8px;margin-top:8px;display:flex}.reel-parameter{min-height:18px;box-shadow:inset 0 0 0 1px var(--reel-hairline);color:var(--text-2);font-size:var(--small-caption-size);line-height:var(--small-caption-line);background:0 0;border-radius:5px;align-items:center;padding:0 6px;display:inline-flex}.reel-prompt-samples{grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:16px;display:grid}.reel-details{background:var(--reel-card-bg);box-shadow:var(--reel-card-edge);interpolate-size:allow-keywords;border-radius:12px;flex:none}.reel-details>summary{min-height:36px;color:var(--text-2);font-size:var(--small-caption-size);line-height:var(--small-caption-line);cursor:pointer;align-items:center;gap:8px;padding:0 12px;list-style:none;display:flex}.reel-details>summary::-webkit-details-marker{display:none}.reel-details>summary:focus-visible{outline:2px solid var(--text-2);outline-offset:-2px;border-radius:12px}.reel-details>summary svg{flex:none}.reel-details-chevron{transition:transform var(--dur-base) var(--ease-ui)}.reel-details[open] .reel-details-chevron{transform:rotate(180deg)}.reel-details-brief{min-width:0;color:var(--text-3);text-align:right;text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.reel-details[open] .reel-details-brief{visibility:hidden}.reel-details::details-content{block-size:0;transition:block-size var(--dur-base) var(--ease-ui), content-visibility var(--dur-base) allow-discrete;overflow:clip}.reel-details[open]::details-content{block-size:auto}.reel-details-body{margin:0;padding:0 12px 4px}.reel-details-body>div{border-top:1px solid var(--reel-hairline);justify-content:space-between;align-items:center;gap:12px;min-height:32px;padding-block:6px;display:flex}.reel-details-body dt{color:var(--text-3);font-size:var(--small-caption-size);line-height:var(--small-caption-line);flex:none}.reel-details-body dd{overflow-wrap:anywhere;min-width:0;color:var(--text-1);font-family:var(--font-number);font-size:var(--small-caption-size);line-height:var(--small-caption-line);text-align:right;margin:0}.reel-details-body .reel-tools{justify-content:flex-end}.reel-variants{overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:none;margin-inline:-12px;overflow-x:auto}.reel-variants::-webkit-scrollbar{display:none}.reel-variants>ul{gap:6px;width:max-content;margin:0;padding:2px 12px;list-style:none;display:flex}.reel-variants>ul>li{scroll-snap-align:center;flex:none;width:68px}.reel-variants[data-loop]{scroll-snap-type:none;-webkit-mask-image:linear-gradient(to right, transparent, var(--text-1) 16px, var(--text-1) calc(100% - 16px), transparent);mask-image:linear-gradient(to right, transparent, var(--text-1) 16px, var(--text-1) calc(100% - 16px), transparent);overflow:hidden}.reel-variants[data-loop]>ul{animation:reel-variants-slide var(--reel-variants-duration) linear infinite;padding-inline:0 6px}.reel-variants[data-loop]:hover>ul,.reel-variants[data-loop]:focus-within>ul{animation-play-state:paused}@keyframes reel-variants-slide{to{transform:translate(-50%)}}.reel-variant{aspect-ratio:9/16;background:var(--surface-3);width:100%;color:var(--reel-text);text-align:left;cursor:pointer;border:0;border-radius:8px;padding:0;display:block;position:relative;overflow:hidden}.reel-variant img{object-fit:cover}.reel-variant>video{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.reel-variant:after{content:"";border-radius:inherit;box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--reel-text) 12%, transparent);pointer-events:none;position:absolute;inset:0}.reel-variant[data-active]:after{box-shadow:inset 0 0 0 2px var(--accent)}.reel-variant:focus-visible{outline:2px solid var(--text-2);outline-offset:2px}.reel-variant-caption{z-index:1;background:var(--reel-scrim);font-size:var(--small-caption-size);line-height:var(--small-caption-line);gap:1px;padding:16px 6px 4px;display:grid;position:absolute;inset:auto 0 0}.reel-variant-caption>span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}@media (prefers-reduced-motion:reduce){.reel-details::details-content{transition:none}.reel-panel .prompt-ref-card:hover,.reel-panel .prompt-ref-card[data-active]{transform:none}}@media (pointer:coarse){.reel-input-thumb{min-width:44px;min-height:44px}.reel-details>summary,.reel-prompt-toggle{min-height:44px}}.reel-actions-main{min-height:44px}
.reel-interactions{--heart-deep:#b9183c;--heart-red:#ed3c57;--heart-coral:#ff8676;--heart-edge:#ffb0a0;--heart-glint:#fff0dd;pointer-events:none;z-index:2;position:absolute;inset:0}.reel-touch-surface{cursor:pointer;pointer-events:auto;touch-action:manipulation;background:0 0;border:0;width:100%;height:100%;position:absolute;inset:0}.reel-social-rail{flex-direction:column;align-items:center;gap:12px;display:flex;position:absolute;bottom:56px;right:12px}.reel-social-button{width:48px;color:var(--reel-text,#fff);font:inherit;cursor:pointer;pointer-events:auto;-webkit-tap-highlight-color:transparent;background:0 0;border:0;flex-direction:column;align-items:center;gap:4px;padding:0;text-decoration:none;display:flex;position:relative}.reel-social-disc{-webkit-backdrop-filter:blur(14px);background:linear-gradient(150deg,#ffffff17,#ffffff03),#11111165;border-radius:50%;place-items:center;width:44px;height:44px;display:grid;position:relative;box-shadow:inset 0 1px #ffffff4d,inset 0 0 0 .5px #ffffff38,0 3px 10px #00000029}.reel-heart-icon,.reel-bookmark-icon{display:inline-flex}.reel-heart-icon{width:31px;height:31px}.reel-heart-icon svg{width:100%;height:100%}.reel-social-label{font-size:var(--small-caption-size);font-weight:500;line-height:var(--small-caption-line);text-shadow:0 1px 5px #000}.reel-social-tutorial .reel-social-disc{color:var(--on-accent);background:var(--brand-material);box-shadow:var(--brand-ring)}.reel-social-button:focus-visible,.reel-touch-surface:focus-visible{outline:2px solid var(--reel-text,#fff);outline-offset:4px;border-radius:24px}.reel-touch-surface:focus-visible{outline-offset:-4px;border-radius:0}.reel-like-burst{pointer-events:none;place-items:center;display:grid;position:absolute;inset:0}.reel-like-ring{border:1px solid var(--heart-coral);border-radius:50%;position:absolute;inset:0}.reel-like-particle{background:var(--heart-coral);border-radius:50%;width:4px;height:4px;position:absolute}.reel-like-particle[data-tone="1"]{background:var(--heart-red)}.reel-like-particle[data-tone="3"]{background:var(--accent);width:3px;height:3px}.reel-floating-heart{pointer-events:none;filter:drop-shadow(0 8px 16px #6c071e40);width:96px;height:96px;margin:-48px;position:absolute}.reel-floating-heart svg{width:100%;height:100%}.reel-player-controls{z-index:3}.reel-source-meta .viral-flame{margin-left:4px}.reels-card-tag,.hc-reel-tag{gap:4px}.reel-block-title h2 .viral-flame,.reel-slide-info h2 .viral-flame{margin-left:5px}.reel-interactions[data-demo]{background:linear-gradient(145deg,#82776f,#252027);border-radius:20px;width:88px;min-height:330px;position:relative}.reel-interactions[data-demo] .reel-social-rail{justify-content:center;inset:18px 0}.ds-reel-interactions{align-items:center;gap:24px;display:flex}@media (max-width:767px){.reel-slide .reel-social-rail{right:10px;bottom:max(calc(env(safe-area-inset-bottom) + 178px), 24%);gap:13px}.reel-slide .reel-slide-info{pointer-events:none;right:76px}.reel-slide-info .reel-actions{pointer-events:auto}}@media (max-height:700px){.reel-social-rail{gap:7px;bottom:42px}.reel-slide .reel-social-rail{bottom:calc(env(safe-area-inset-bottom) + 150px);gap:6px}.reel-social-disc{width:40px;height:40px}}@media not (min-width:48rem){.reel-stage .reel-social-rail{gap:4px;max-height:60%;top:auto;bottom:24px;right:8px}.reel-stage .reel-social-button{width:44px;height:48px;min-height:44px}.reel-stage .reel-social-disc{width:32px;height:32px}.reel-stage .reel-social-label{font-size:var(--small-label-size);line-height:var(--small-label-line)}}.reel-slide .reel-social-rail{gap:4px;top:auto;bottom:24px;right:8px}.reel-slide .reel-social-button{width:44px;height:48px;min-height:44px}.reel-slide .reel-social-disc{width:32px;height:32px}.reel-slide .reel-social-label{font-size:var(--small-label-size);line-height:var(--small-label-line)}
.reel-feed{z-index:var(--z-modal);overscroll-behavior:contain;scroll-snap-type:y mandatory;scrollbar-width:none;background:var(--surface-1);position:fixed;inset:0;overflow-y:auto}.reel-feed::-webkit-scrollbar{display:none}.reel-feed-close{top:calc(env(safe-area-inset-top) + 12px);z-index:3;width:40px;height:40px;position:fixed;left:12px}.reel-slide{scroll-snap-align:start;scroll-snap-stop:always;flex-direction:column;height:100dvh;display:flex;position:relative;overflow:hidden}.reel-slide-media{background:var(--on-accent);flex:none;height:48dvh;position:relative}.reel-slide-media .reel-player{width:min(100%,27dvh);left:50%;right:auto;transform:translate(-50%)}.reel-slide .reel-player-controls{top:calc(env(safe-area-inset-top) + 14px);z-index:2}.reel-slide .reel-panel{box-shadow:none;border-radius:0;flex:1}.reel-slide .reel-panel-foot{padding-bottom:calc(16px + env(safe-area-inset-bottom));flex:none}@media (pointer:coarse){.reel-feed-close{min-width:44px;min-height:44px}}.reel-feed[data-preview]{width:min(100%, var(--reel-preview-mobile-width));height:var(--reel-preview-height);z-index:auto;position:relative}.reel-feed[data-preview] .reel-feed-close{top:var(--space-3);margin-bottom:-40px;position:sticky}.reel-feed[data-preview] .reel-slide{height:var(--reel-preview-height)}.reel-feed[data-preview] .reel-slide .reel-player-controls{top:var(--space-4)}.reel-slide{overscroll-behavior-y:contain;overflow-y:auto}.reel-slide-media{aspect-ratio:9/16;width:100%;height:auto}.reel-slide-media .reel-player{width:100%;inset:0;transform:none}.reel-slide .reel-panel{flex:none;height:auto;min-height:320px;overflow:visible}.reel-slide .reel-panel-body{overflow:visible}.reel-slide .reel-player-controls{top:calc(env(safe-area-inset-top) + 12px);right:12px}.reel-feed-close{width:44px;height:44px}.reel-feed[data-preview] .reel-slide-media{height:auto}.reel-slide-media[data-wide]{aspect-ratio:auto;height:420px}
