@font-face{font-family:Roboto;src:url('assets/Roboto.ttf') format('truetype');font-weight:100 900;font-style:normal;font-display:swap}
/* Layout and colours of Android system dialogs and advertising artwork come
   from the supplied Figma, rather than the RuStore component library. */
*{box-sizing:border-box;border-width:0;border-style:solid}
body{margin:0;font-family:var(--rs-font);color:var(--rs-text-primary);background:var(--rs-background-primary);display:flex;min-height:100vh;font-synthesis:none}
p,h1,h2,h3{margin:0}a{color:inherit}button,input,select{font:inherit;color:inherit}button{background:transparent;text-align:inherit;padding:0;cursor:pointer}button:disabled{cursor:default}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--rs-text-accent);outline-offset:3px}
img{display:block;max-width:100%;vertical-align:middle}button img{pointer-events:none}
.controls{width:280px;flex:none;padding:32px 20px;position:sticky;top:0;align-self:flex-start;height:100vh;overflow:auto;background:var(--rs-surface-primary);border-right:1px solid var(--rs-stroke-primary)}
.panel-heading{font-size:24px;font-weight:600;line-height:30px;margin-bottom:32px}.panel-heading span{display:block;font-size:14px;line-height:20px;font-weight:400;color:var(--rs-text-secondary);margin-top:4px}
.field-label{display:block;color:var(--rs-text-secondary);font-size:12px;margin-bottom:8px}select{width:100%;height:44px;border:1px solid var(--rs-stroke-primary);border-radius:var(--rs-radius-s);padding:0 12px;background:var(--rs-surface-primary)}
#screen-nav{display:flex;flex-direction:column;gap:4px;margin-top:24px}#screen-nav button{display:flex;align-items:center;gap:12px;min-height:44px;padding:10px 12px;border-radius:var(--rs-radius-s);font-size:14px}#screen-nav button span{color:var(--rs-text-secondary);font-size:12px}#screen-nav button[aria-current=step]{background:var(--rs-surface-accentsubdued);color:var(--rs-text-accent)}
.panel-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}.panel-actions button{background:var(--rs-surface-secondary);padding:12px;border-radius:var(--rs-radius-s);font-size:14px}.panel-actions button:disabled{opacity:.4}.panel-note{font-size:12px;line-height:18px;color:var(--rs-text-secondary);margin-top:20px}
.stage{flex:1;min-width:0;padding:32px 24px;display:flex;justify-content:center;align-items:flex-start}.device{position:relative;width:360px;height:800px;flex:none;background:var(--rs-background-accent);border-radius:24px;overflow:hidden;isolation:isolate}
.screen{width:360px;height:800px;flex:none;position:absolute;inset:0;font-family:var(--rs-font);font-size:16px;line-height:1.5;text-align:left;vertical-align:top;border-radius:24px}.screen[hidden]{display:none}.screen>*,.screen [data-name="Content Wrapper"]>*{flex-shrink:0}
/* Screen dimensions and flow are kept in CSS pixels; no scaled screenshots. */
#splash{display:block}#splash[hidden]{display:none}
[data-mobile-splash]{position:absolute;width:240px;height:240px;left:60px;top:280px;max-width:none}
.launch-backdrop{position:absolute;inset:0;background:var(--rs-background-accent)}
.launch-prompt>:not(.launch-backdrop):not([data-name="Overlay"]):not([role="dialog"]){visibility:hidden}
[data-native-art]{width:100%;height:calc(100% - 312px);bottom:auto;background:var(--rs-background-accent)}
.android-pressable{position:relative;isolation:isolate;overflow:hidden;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.android-ripple{position:absolute;border-radius:50%;background:currentColor;pointer-events:none;z-index:9;will-change:transform,opacity}
html:not([data-input="keyboard"]) .screen button:focus-visible{outline:none}
.device{touch-action:pan-y}.screen [role=dialog]{transform-origin:50% 50%}
.screen [data-name="Dialog"]{z-index:5}.screen [role=dialog]{z-index:6}
/* Figma strokes sit inside the auto-layout bounds; transparent icon-button
   strokes must not add 2 px to the measured 40 px wrapper. */
.screen [data-name="Icon Button – V2"]>[data-name="Button Wrapper"]{border-width:0}
.recommendation-row{cursor:pointer}.recommendation-row input{position:absolute;right:0;top:0;width:32px;height:48px;margin:0;opacity:0;z-index:2;cursor:pointer}.recommendation-row:has(input:focus-visible){outline:2px solid var(--rs-text-accent);outline-offset:2px;border-radius:8px}
/* Figma truncates the application rows to one title and one subtitle line.
   Its code export expands the first subtitle into two paragraphs, including
   an empty zero-width paragraph; keep the visible line from the actual frame. */
.recommendation-row{height:48px}.recommendation-row [data-name="Title Container"] p,.recommendation-row [data-name="Subtitle Container"] p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;margin-bottom:0}
.recommendation-row [data-name="Subtitle Container"]{overflow:hidden}.recommendation-row [data-name="Subtitle Container"] p+p{display:none}
.storefront-scroll [data-name="Apps list"] [data-name="Title Container"] p,.storefront-scroll [data-name="Apps list"] [data-name="Subtitle Container"] p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.storefront-scroll [data-name="Cell – V2"]>div{min-width:0;overflow:hidden}
.storefront-scroll [data-name="Indicator"]{border-width:0;box-shadow:inset 0 0 0 1px var(--rs-stroke-accent)}
.storefront-scroll [data-name="⚙️  Event Compilation / Item"]{border-width:0;box-shadow:inset 0 0 0 1px var(--rs-stroke-primary)}
.storefront-scroll [data-name="Rating Requet Compilation"] [data-name="Subtitle Container"] p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.storefront-scroll [data-name="⚙️ Stories / Item"] p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.storefront-scroll [data-name="🧩 Articles Compilation"] [data-name="Text Content"]>[data-node-id$="2086:17822"]{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.storefront-scroll [data-name="🧩 Articles Compilation"] [data-name="Text Content"]>[data-node-id$="2086:17822"]>p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.storefront-scroll [data-name="🧩 Articles Compilation"] [data-name="Text Content"]>[data-node-id$="2086:17822"]>p+p{display:none}
.storefront-scroll [data-name="Banner V5"]{border-width:0}
.recommendation-row [data-checkbox-art] img{content:url('assets/95655.svg')}.recommendation-row:has(input:checked) [data-checkbox-art] img{content:url('assets/45add.svg')}
#recommendations [data-node-id="20223:1550"],#recommendations [data-node-id="20223:1551"]{pointer-events:none}
.storefront-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;scrollbar-width:none;overscroll-behavior:contain}.storefront-scroll::-webkit-scrollbar{display:none}.storefront-nav{flex:none;z-index:2}
.storefront-nav>[data-name="Navigation Bar Wrapper"]{border-top-width:0;box-shadow:inset 0 1px 0 var(--rs-stroke-primary)}
/* Preserve the original icon geometry while applying the active-tab token. */
.storefront-nav [data-name="⚙️ Navigation Bar – V2 / Tab"] [data-name="Icon"]{background:var(--rs-icon-accent);mask:url('assets/7c751.svg') center / 28px 28px no-repeat}
.storefront-nav [data-name="⚙️ Navigation Bar – V2 / Tab"] [data-name="Icon"] img{visibility:hidden}
.storefront-scroll [data-name="Searchbar – V3"]{flex:none}
@media(max-width:720px){body{flex-direction:column}.controls{position:relative;width:100%;height:auto;padding:16px;border-right:0;border-bottom:1px solid var(--rs-stroke-primary)}.panel-heading{margin-bottom:12px;font-size:20px}.panel-heading span{display:inline;margin-left:12px}.field-label{display:none}select{max-width:280px}#screen-nav{flex-direction:row;overflow-x:auto;margin-top:12px}#screen-nav button{flex:none;gap:6px;padding:8px}#screen-nav button span{display:none}.panel-actions{margin-top:12px}.panel-note{display:none}.stage{padding:20px 0;flex:none}}
@media(max-width:359px){.stage{justify-content:flex-start;overflow-x:auto;width:100%}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
/* Variant 2: measured story / interest / promo frames 20274:20640–20727. */
.story-screen [data-story-progress]{gap:6px}
[data-segment]{overflow:hidden;background:var(--rs-surface-constantalpha)}
[data-progress-fill]{display:block;width:100%;height:3px;transform-origin:left center;background:var(--rs-icon-constant);border-radius:999px}
[data-story-touch]{touch-action:none;user-select:none;-webkit-user-select:none}
.interests-screen .interest-row{height:56px;border:0;cursor:pointer;background:var(--rs-surface-constantalpha);position:relative}
.interest-row:has(input:checked){box-shadow:inset 0 0 0 1px var(--rs-icon-constant)}
.interest-row input{position:absolute;inset:0;opacity:0;width:100%;height:100%;margin:0;cursor:pointer;z-index:2}
.interest-row:has(input:focus-visible){outline:2px solid var(--rs-icon-constant);outline-offset:3px}
.interest-row [data-name="Checkbox – V2"]{width:18px;height:18px}
.interest-row [data-name="Checkbox – V2"] img{content:url('assets/interest-empty.svg');width:22px;height:22px;max-width:none;inset:-2px}
.interest-row:has(input:checked) [data-name="Checkbox – V2"] img{content:url('assets/interest-selected.svg')}
[data-interest-footer][hidden]{display:none}
.promo-screen [data-promo-art]{pointer-events:none}
.promo-screen [data-name="Subtitle Container"] p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}
.transition-system-bars{position:absolute;inset:0;z-index:20;pointer-events:none}
/* Variant 3 uses manual pages and the original glow, not a story timer. */
[data-slide-touch]{touch-action:pan-y;user-select:none;-webkit-user-select:none}
.slide-screen [data-name="Blur"]{pointer-events:none}
/* In the experimental slides choreography the device owns the blue surface;
   only content layers move. Resting frame geometry remains from Figma. */
.scene-transition{background-color:transparent!important}
.scene-transition#welcome [data-name="Content Wrapper"]{background-color:transparent}
.radial-glow{position:absolute;inset:0;width:360px;height:800px;z-index:10;pointer-events:none;contain:strict}