/* Firas World V17 — Native Experience Layer
   Additive layer: keeps V16 functions/APIs intact and upgrades the application shell. */
:root{
  --v17-green:#167A5B;
  --v17-green-2:#7ED9B4;
  --v17-green-soft:#EAF7F1;
  --v17-ink:#13231D;
  --v17-muted:#6C7B74;
  --v17-bg:#F4F8F6;
  --v17-glass:rgba(255,255,255,.78);
  --v17-line:rgba(24,73,55,.09);
  --v17-shadow:0 18px 54px rgba(22,70,53,.12);
  --v17-shadow-soft:0 10px 30px rgba(22,70,53,.08);
  --v17-ease:cubic-bezier(.2,.82,.2,1);
  --v17-safe-bottom:max(10px,env(safe-area-inset-bottom));
}
html.fw-v17,html.fw-v17 body{background:var(--v17-bg)}
html.fw-v17 body.app-body{overscroll-behavior:none;background:var(--v17-bg)}
html.fw-v17 .app-shell{display:block;height:100dvh;position:relative;overflow:hidden;background:var(--v17-bg)}
html.fw-v17 .app-content{position:absolute!important;inset:0!important;min-height:0!important;overflow:hidden!important;z-index:1}
html.fw-v17 .screen{inset:0}
html.fw-v17 .screen.active{animation:v17ScreenIn .34s var(--v17-ease)}
@keyframes v17ScreenIn{from{opacity:.55;transform:translate3d(0,12px,0) scale(.995)}to{opacity:1;transform:none}}

/* Floating top chrome */
html.fw-v17 .app-header{
  position:absolute!important;z-index:80!important;top:max(8px,env(safe-area-inset-top));right:12px;left:12px;
  min-height:56px;height:56px;padding:0 8px 0 10px!important;border:1px solid rgba(255,255,255,.62)!important;
  border-radius:22px!important;background:rgba(255,255,255,.76)!important;
  backdrop-filter:blur(24px) saturate(165%)!important;-webkit-backdrop-filter:blur(24px) saturate(165%)!important;
  box-shadow:0 12px 38px rgba(12,34,26,.11)!important;transform:translateZ(0)
}
html.fw-v17 .header-brand{gap:9px;min-width:0}
html.fw-v17 .header-brand>img,html.fw-v17 .header-brand>span{width:38px;height:38px;border-radius:13px;padding:6px;box-shadow:none;background:rgba(246,251,248,.95)}
html.fw-v17 .header-brand b{font-size:13px;color:var(--v17-ink)}
html.fw-v17 .header-brand small{display:none}
html.fw-v17 .header-actions{gap:6px}
html.fw-v17 #installBtn,html.fw-v17 #soundBtn,html.fw-v17 #themeBtn{display:none!important}
html.fw-v17 .icon-button,html.fw-v17 .points-pill,html.fw-v17 .header-profile-button{
  height:38px;border:1px solid rgba(25,84,61,.08);background:rgba(247,251,249,.9);border-radius:13px;color:#496159;box-shadow:none
}
html.fw-v17 .icon-button{width:38px}
html.fw-v17 .points-pill{padding:0 10px;color:var(--v17-ink);font-weight:850}
html.fw-v17 .points-pill svg{color:#E6A62F}
html.fw-v17 .header-profile-button{width:38px;padding:0;display:grid;place-items:center;overflow:hidden;cursor:pointer}
html.fw-v17 .header-profile-button svg{width:18px;height:18px}
html.fw-v17 .header-profile-button img{width:100%;height:100%;object-fit:cover}

/* Reels are the canvas: true 100dvh */
html.fw-v17 .reel-screen{inset:0;background:#09110E}
html.fw-v17 .reels-feed{height:100dvh;scroll-behavior:smooth}
html.fw-v17 .reel{height:100dvh;min-height:100dvh}
html.fw-v17 .reel-session-progress{top:calc(max(8px,env(safe-area-inset-top)) + 64px);left:22px;right:22px;height:2px;z-index:71;background:rgba(255,255,255,.24)}
html.fw-v17 .feed-hint{bottom:calc(var(--v17-safe-bottom) + 84px);z-index:55}
html.fw-v17 .reel-top{top:calc(max(8px,env(safe-area-inset-top)) + 74px);right:16px;left:16px}
html.fw-v17 .reel-chip{padding:7px 10px;border-radius:999px;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);font-weight:760}
html.fw-v17 .video-reel .reel-media::after{background:linear-gradient(180deg,rgba(3,8,6,.18) 0%,rgba(3,8,6,.01) 31%,rgba(3,8,6,.06) 52%,rgba(3,8,6,.86) 100%)}
html.fw-v17 .reel-bottom{right:16px;left:82px;bottom:calc(var(--v17-safe-bottom) + 88px)}
html.fw-v17 .reel-bottom h2{font-size:clamp(24px,7vw,34px);line-height:1.22;margin-bottom:7px}
html.fw-v17 .reel-bottom p{font-size:12px;line-height:1.65;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
html.fw-v17 .creator-avatar{width:36px;height:36px;box-shadow:0 7px 20px rgba(0,0,0,.14)}
html.fw-v17 .reel-actions{left:14px;bottom:calc(var(--v17-safe-bottom) + 88px);gap:9px}
html.fw-v17 .reel-action{width:46px;height:46px;background:rgba(5,15,11,.32);border-color:rgba(255,255,255,.17);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);transition:transform .26s var(--v17-ease),background .2s,color .2s}
html.fw-v17 .reel-action:active{transform:scale(.88)}
html.fw-v17 .reel-action-wrap small{font-size:9px;font-weight:850;color:rgba(255,255,255,.9);text-shadow:0 2px 8px rgba(0,0,0,.35)}

/* Universal Reel Canvas — every reel keeps the same interaction rail */
html.fw-v17 .reel:not(.video-reel){background:#0E1814;color:#fff}
html.fw-v17 .reel:not(.video-reel) .reel-media{inset:0}
html.fw-v17 .reel:not(.video-reel) .reel-media img{filter:saturate(.92) contrast(.98);transform:scale(1.025)}
html.fw-v17 .reel:not(.video-reel) .reel-media::after{background:linear-gradient(180deg,rgba(5,12,9,.18) 0%,rgba(5,12,9,.18) 32%,rgba(5,12,9,.56) 63%,rgba(5,12,9,.94) 100%)}
html.fw-v17 .reel:not(.video-reel) .reel-top .reel-chip{background:rgba(8,23,17,.34);color:#fff;border-color:rgba(255,255,255,.16);box-shadow:none}
html.fw-v17 .reel:not(.video-reel) .reel-points{background:rgba(255,255,255,.92)!important;color:#26372F!important}
html.fw-v17 .knowledge-visual{top:calc(max(8px,env(safe-area-inset-top)) + 118px);left:18px;right:18px;height:43%;border-radius:30px;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.17);box-shadow:0 28px 80px rgba(0,0,0,.22);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
html.fw-v17 .knowledge-visual>img{object-fit:cover}
html.fw-v17 .knowledge-symbol{background:rgba(255,255,255,.92);color:var(--v17-green);box-shadow:0 18px 44px rgba(0,0,0,.18)}
html.fw-v17 .reel:not(.video-reel) .reel-bottom{right:16px;left:78px;bottom:calc(var(--v17-safe-bottom) + 86px);padding:0;background:transparent;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;color:#fff}
html.fw-v17 .reel:not(.video-reel) .reel-bottom h2{color:#fff;text-shadow:0 3px 16px rgba(0,0,0,.28)}
html.fw-v17 .reel:not(.video-reel) .reel-bottom p,html.fw-v17 .reel:not(.video-reel) .creator-line small{color:rgba(255,255,255,.74)}
html.fw-v17 .reel:not(.video-reel) .reel-actions{display:grid!important}
html.fw-v17 .reel-cta{margin-top:10px;gap:7px;flex-wrap:wrap}
html.fw-v17 .reel-cta button,html.fw-v17 .game-reel .game-play{height:42px;border-radius:14px;padding:0 15px;background:#fff;color:#13231D;font-size:11px;box-shadow:0 8px 24px rgba(0,0,0,.16)}
html.fw-v17 .reel-cta button.secondary{background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(14px)}
html.fw-v17 .quiz-options{gap:6px;margin-top:9px;max-height:170px;overflow:auto;padding-left:2px}
html.fw-v17 .choice-btn{min-height:40px;border-radius:13px;border-color:rgba(255,255,255,.18);background:rgba(255,255,255,.13);color:#fff;backdrop-filter:blur(14px);font-size:11px}
html.fw-v17 .choice-btn.selected{background:rgba(126,217,180,.24);border-color:rgba(126,217,180,.55);color:#fff}
html.fw-v17 .choice-btn.correct{background:rgba(73,204,151,.28);border-color:#72DCB2;color:#fff}
html.fw-v17 .choice-btn.wrong{background:rgba(239,106,116,.25);border-color:#F2A0A7;color:#fff}
html.fw-v17 .game-reel .knowledge-visual{top:calc(max(8px,env(safe-area-inset-top)) + 108px);height:48%}

/* Floating glass dock */
html.fw-v17 .app-nav{
  position:absolute!important;z-index:90!important;right:12px;left:12px;bottom:var(--v17-safe-bottom);height:68px;
  display:grid!important;grid-template-columns:repeat(5,1fr)!important;padding:6px!important;
  border:1px solid rgba(255,255,255,.68)!important;border-radius:24px!important;
  background:rgba(255,255,255,.79)!important;backdrop-filter:blur(26px) saturate(170%)!important;-webkit-backdrop-filter:blur(26px) saturate(170%)!important;
  box-shadow:0 18px 52px rgba(11,35,26,.18)!important;overflow:visible
}
html.fw-v17 .nav-item{height:56px;border-radius:18px;color:#718078;gap:2px;transition:transform .3s var(--v17-ease),color .25s,background .25s}
html.fw-v17 .nav-item span{width:34px;height:31px;border-radius:12px;transition:.3s var(--v17-ease)}
html.fw-v17 .nav-item svg{width:20px;height:20px}
html.fw-v17 .nav-item small{font-size:9px;font-weight:720}
html.fw-v17 .nav-item.active{color:var(--v17-green);background:rgba(233,247,240,.72)}
html.fw-v17 .nav-item.active span{background:transparent!important;color:var(--v17-green)!important;transform:translateY(-1px) scale(1.06)}
html.fw-v17 .nav-item.active:after{bottom:4px;width:18px;height:3px;background:var(--v17-green)}
html.fw-v17 .nav-item[data-screen="ai"]{transform:translateY(-7px)}
html.fw-v17 .nav-item[data-screen="ai"] span{width:44px;height:44px;border-radius:16px;background:linear-gradient(145deg,var(--v17-green),#2A9A73)!important;color:#fff!important;box-shadow:0 10px 24px rgba(22,122,91,.28)}
html.fw-v17 .nav-item[data-screen="ai"] small{transform:translateY(2px)}
html.fw-v17 .nav-item[data-screen="ai"].active{background:transparent}
html.fw-v17 .custom-nav-icon{width:24px;height:24px;object-fit:contain}
html.fw-v17 .nav-item[data-screen="ai"] .custom-nav-icon{width:29px;height:29px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.05))}

/* Inner app screens: app-like rather than dashboard-like */
html.fw-v17 .scroll-screen{overflow:auto;padding:calc(max(8px,env(safe-area-inset-top)) + 82px) 16px calc(var(--v17-safe-bottom) + 96px);overscroll-behavior:contain;background:linear-gradient(180deg,#F7FAF8,#F1F7F4)}
html.fw-v17 .page-head{align-items:center;margin:4px 0 18px}
html.fw-v17 .page-head small{color:var(--v17-green);font-size:10px}
html.fw-v17 .page-head h1{font-size:clamp(27px,7vw,38px);color:var(--v17-ink);line-height:1.15}
html.fw-v17 .page-head p{color:var(--v17-muted);font-size:11px}
html.fw-v17 .page-head .mini-action{border-color:var(--v17-line);border-radius:14px;color:#496159;box-shadow:var(--v17-shadow-soft)}

/* Games: featured + horizontally scrollable arcade cards */
html.fw-v17 .games-hero{grid-template-columns:1fr;border-radius:30px;min-height:310px;position:relative;background:#10291F;box-shadow:var(--v17-shadow);margin-bottom:20px}
html.fw-v17 .games-hero-copy{z-index:2;padding:24px;justify-content:flex-end;background:linear-gradient(180deg,transparent 18%,rgba(7,24,17,.9) 100%)}
html.fw-v17 .games-hero-copy small{color:#A9E8CF}
html.fw-v17 .games-hero-copy h2{font-size:31px;margin:6px 0}
html.fw-v17 .games-hero-copy p{font-size:11px;color:rgba(255,255,255,.75);max-width:500px}
html.fw-v17 .games-hero-copy button{height:46px;border-radius:15px;color:var(--v17-green);box-shadow:none}
html.fw-v17 .games-hero-media{position:absolute;inset:0;min-height:0;background:#17392C}
html.fw-v17 .games-hero-media:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,22,16,.03),rgba(8,22,16,.68))}
html.fw-v17 .game-grid{display:grid;grid-auto-flow:column;grid-auto-columns:min(72vw,260px);grid-template-columns:none;gap:12px;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x proximity;padding:2px 2px 12px;scrollbar-width:none}
html.fw-v17 .game-grid::-webkit-scrollbar{display:none}
html.fw-v17 .game-card{scroll-snap-align:start;border-radius:24px;border-color:var(--v17-line);box-shadow:var(--v17-shadow-soft);background:#fff}
html.fw-v17 .game-card:hover{transform:none}
html.fw-v17 .game-cover{aspect-ratio:1.45;background:#EAF4EF}
html.fw-v17 .game-card-body{padding:14px}
html.fw-v17 .game-card-body small{color:var(--v17-green)}
html.fw-v17 .game-card-foot button{background:var(--v17-green);border-radius:13px}

/* Rewards: journey card */
html.fw-v17 .reward-hero{border-radius:30px;background:linear-gradient(145deg,#E8F6EF,#F8FBF9);border-color:rgba(22,122,91,.08);box-shadow:var(--v17-shadow-soft);padding:22px}
html.fw-v17 .reward-hero h2{color:var(--v17-ink)}
html.fw-v17 .level-ring{background:conic-gradient(var(--v17-green) var(--level-progress,45%),#DCEDE5 0)}
html.fw-v17 .reward-stats{gap:9px}
html.fw-v17 .reward-stats article,html.fw-v17 .badge-card{border-color:var(--v17-line);border-radius:20px;box-shadow:0 8px 24px rgba(21,69,51,.045)}
html.fw-v17 .badge-card i{background:var(--v17-green-soft);color:var(--v17-green)}

/* Profile Hub */
html.fw-v17 .profile-hub{grid-template-columns:1fr;gap:12px}
html.fw-v17 .profile-main-card,html.fw-v17 .profile-panel{border-color:var(--v17-line);border-radius:28px;box-shadow:var(--v17-shadow-soft)}
html.fw-v17 .profile-main-card{background:linear-gradient(160deg,#fff,#EFF8F3);padding:22px}
html.fw-v17 .profile-avatar{width:112px;height:112px;border-radius:36px;background:linear-gradient(145deg,#E3F4EC,#F9FBFA);color:var(--v17-green)}
html.fw-v17 .profile-mini-stats div{background:rgba(255,255,255,.78);border:1px solid rgba(22,122,91,.06)}
html.fw-v17 .profile-menu{grid-template-columns:1fr 1fr;gap:9px}
html.fw-v17 .profile-menu button,html.fw-v17 .profile-menu a{min-height:68px;border-color:var(--v17-line);border-radius:18px;background:#FAFCFB;color:#385047}
html.fw-v17 .profile-menu i{background:var(--v17-green-soft);color:var(--v17-green)}
html.fw-v17 .profile-photo-edit{background:var(--v17-green)}
html.fw-v17 .v17-theme-setting{font:inherit;width:100%;text-align:inherit}

/* AI: true assistant screen inside app chrome */
html.fw-v17 .ai-screen{background:#F4F8F6;padding:calc(max(8px,env(safe-area-inset-top)) + 75px) 0 calc(var(--v17-safe-bottom) + 84px)}
html.fw-v17 .ai-shell{height:100%;max-width:none;border-radius:0;background:#fff;grid-template-rows:auto auto 1fr auto;box-shadow:inset 0 1px 0 rgba(22,122,91,.06)}
html.fw-v17 .ai-head{padding:12px 15px;border-color:#EDF3F0}
html.fw-v17 .ai-head-media{background:linear-gradient(145deg,#E3F5EC,#F2FAF6);border-radius:17px}
html.fw-v17 .ai-head h2{font-size:16px;color:var(--v17-ink)}
html.fw-v17 .ai-head small{color:#50A17E}
html.fw-v17 .ai-back{background:#F0F6F3;color:var(--v17-green)}
html.fw-v17 .ai-suggestions{padding:8px 14px 10px}
html.fw-v17 .ai-suggestions button{background:#F5F9F7;border-color:#E2EEE8;color:#456057;padding:9px 12px}
html.fw-v17 .bubble{font-size:12px;border-radius:19px}
html.fw-v17 .bubble.ai{background:#F0F6F3;color:#30473E}
html.fw-v17 .bubble.user{background:var(--v17-green)}
html.fw-v17 .ai-composer{border-color:#E8F0EC;background:rgba(255,255,255,.92)}
html.fw-v17 .ai-composer textarea{border-color:#DFECE6;background:#F7FAF8}
html.fw-v17 .ai-composer button{background:var(--v17-green)}

/* Bottom sheets with safe-area and draggable feel */
html.fw-v17 .sheet-backdrop{backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
html.fw-v17 .bottom-sheet{right:8px;left:8px;bottom:8px;width:auto;max-height:min(84dvh,760px);border-radius:28px 28px 24px 24px;padding-bottom:max(15px,env(safe-area-inset-bottom));box-shadow:0 -10px 60px rgba(15,46,35,.22);will-change:transform;transition:transform .34s var(--v17-ease)}
html.fw-v17 .sheet-handle{width:42px;height:5px;background:#C8D7D0;margin-top:10px;touch-action:none;cursor:grab}
html.fw-v17 .bottom-sheet.v17-dragging{transition:none!important}

/* Game mode: distraction free */
html.fw-v17 .game-layer{z-index:5000;grid-template-rows:58px minmax(0,1fr);padding-top:env(safe-area-inset-top);background:#080E0B}
html.fw-v17 .game-layer header{background:rgba(7,15,11,.9);backdrop-filter:blur(18px);border-color:rgba(255,255,255,.07)}
html.fw-v17 .game-layer header button{border-radius:14px}
html.fw-v17 .game-result{background:rgba(5,13,9,.74);backdrop-filter:blur(22px)}
html.fw-v17 .game-result-card{border-radius:30px;padding:26px;box-shadow:0 32px 90px rgba(0,0,0,.36)}
html.fw-v17 .game-result-card i{background:var(--v17-green-soft);color:var(--v17-green)}
html.fw-v17 .game-result-card button{width:100%;margin-top:8px;background:var(--v17-green);border-radius:15px}
html.fw-v17 .game-result-card .v17-replay{background:#EDF5F1;color:var(--v17-green)}
html.fw-v17 .v17-game-exit{position:fixed;inset:0;z-index:6000;display:grid;place-items:end center;padding:18px;background:rgba(4,11,8,.55);backdrop-filter:blur(10px)}
html.fw-v17 .v17-game-exit-card{width:min(100%,420px);background:#fff;color:var(--v17-ink);border-radius:28px;padding:22px;box-shadow:0 28px 80px rgba(0,0,0,.3);animation:v17SheetUp .28s var(--v17-ease)}
html.fw-v17 .v17-game-exit-card h3{font-size:21px;margin:0 0 6px}
html.fw-v17 .v17-game-exit-card p{font-size:12px;line-height:1.7;color:var(--v17-muted);margin:0 0 16px}
html.fw-v17 .v17-game-exit-actions{display:grid;gap:8px}
html.fw-v17 .v17-game-exit-actions button{height:50px;border:0;border-radius:16px;font-weight:800}
html.fw-v17 .v17-game-continue{background:var(--v17-green);color:#fff}
html.fw-v17 .v17-game-leave{background:#F1F5F3;color:#52665D}
@keyframes v17SheetUp{from{transform:translateY(35px);opacity:.4}to{transform:none;opacity:1}}

/* micro interactions */
html.fw-v17 button,html.fw-v17 a{touch-action:manipulation}
html.fw-v17 .v17-press{transition:transform .18s var(--v17-ease)}
html.fw-v17 .v17-press:active{transform:scale(.96)}
html.fw-v17 .points-pill.v17-bump{animation:v17Bump .45s var(--v17-ease)}
@keyframes v17Bump{40%{transform:scale(1.12)}100%{transform:none}}

/* Dark mode remains supported, but with the same native shell */
html.fw-v17[data-theme="dark"] body.app-body{background:#0A120F}
html.fw-v17[data-theme="dark"] .app-header,html.fw-v17[data-theme="dark"] .app-nav{background:rgba(17,29,24,.82)!important;border-color:rgba(255,255,255,.08)!important}
html.fw-v17[data-theme="dark"] .header-brand b,html.fw-v17[data-theme="dark"] .points-pill{color:#F0F6F3}
html.fw-v17[data-theme="dark"] .icon-button,html.fw-v17[data-theme="dark"] .points-pill,html.fw-v17[data-theme="dark"] .header-profile-button{background:rgba(30,46,39,.9);border-color:rgba(255,255,255,.06);color:#D5E2DC}
html.fw-v17[data-theme="dark"] .scroll-screen,html.fw-v17[data-theme="dark"] .ai-screen{background:#0C1511}
html.fw-v17[data-theme="dark"] .page-head h1{color:#F1F6F3}
html.fw-v17[data-theme="dark"] .page-head p{color:#93A49C}
html.fw-v17[data-theme="dark"] .profile-main-card{background:linear-gradient(160deg,#14221B,#101C17)}

/* Desktop gateway: created only after JS is ready, so app never disappears on JS failure */
.v17-desktop-gateway{display:none}
body.v17-desktop-mode>.app-splash,body.v17-desktop-mode>#firstRunOnboarding,body.v17-desktop-mode>#app{display:none!important}
body.v17-desktop-mode .v17-desktop-gateway{position:fixed;inset:0;z-index:99999;display:grid;grid-template-columns:minmax(480px,.95fr) minmax(520px,1.05fr);direction:rtl;overflow:hidden;background:#06110D;color:#fff}
.v17-desktop-media{position:absolute;inset:0;z-index:0;background:radial-gradient(circle at 75% 24%,#1E674F 0,#0B2D22 34%,#06110D 74%)}
.v17-desktop-media video{width:100%;height:100%;object-fit:cover;opacity:.55;filter:saturate(.9) contrast(1.05)}
.v17-desktop-media:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,10,7,.96) 0%,rgba(3,10,7,.72) 48%,rgba(3,10,7,.18) 100%),linear-gradient(180deg,rgba(3,10,7,.05),rgba(3,10,7,.4))}
.v17-desktop-copy{position:relative;z-index:2;align-self:center;padding:clamp(52px,6vw,104px);max-width:800px}
.v17-desktop-brand{display:flex;align-items:center;gap:14px;margin-bottom:44px}.v17-desktop-brand img,.v17-desktop-brand span{width:58px;height:58px;border-radius:19px;object-fit:contain;padding:7px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.13);backdrop-filter:blur(18px)}.v17-desktop-brand b{font-size:23px}.v17-desktop-brand small{display:block;margin-top:4px;color:rgba(255,255,255,.55)}
.v17-desktop-kicker{display:inline-flex;padding:9px 13px;border-radius:999px;background:rgba(126,217,180,.12);border:1px solid rgba(126,217,180,.22);color:#B9F0DA;font-size:12px;font-weight:850;margin-bottom:18px}
.v17-desktop-copy h1{font-size:clamp(48px,5vw,82px);line-height:1.02;letter-spacing:-.045em;margin:0 0 22px;max-width:760px}.v17-desktop-copy>p{max-width:660px;font-size:19px;line-height:1.85;color:rgba(255,255,255,.67);margin:0 0 30px}
.v17-desktop-actions{display:flex;gap:10px;flex-wrap:wrap}.v17-desktop-actions a,.v17-desktop-actions button{min-height:56px;border-radius:17px;padding:0 21px;border:0;font:inherit;font-weight:850;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.v17-desktop-actions a{background:#fff;color:#0B2118}.v17-desktop-actions button{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.13);backdrop-filter:blur(16px)}
.v17-desktop-note{margin-top:20px;color:rgba(255,255,255,.45);font-size:12px}
.v17-phone-zone{position:relative;z-index:2;display:grid;place-items:center;padding:50px}.v17-phone{width:min(350px,30vw);aspect-ratio:9/19.5;border-radius:58px;padding:11px;background:linear-gradient(145deg,#202923,#030604);box-shadow:0 50px 110px rgba(0,0,0,.52),inset 0 0 0 2px rgba(255,255,255,.09);transform:rotate(-4deg)}.v17-phone-screen{height:100%;border-radius:48px;overflow:hidden;background:linear-gradient(180deg,#F8FBF9,#EAF5EF);color:#12251D;padding:19px;display:grid;grid-template-rows:auto 1fr auto}.v17-phone-island{width:92px;height:25px;border-radius:999px;background:#050806;margin:0 auto}.v17-phone-art{display:grid;place-items:center;text-align:center;padding:24px}.v17-phone-art>span{width:148px;height:148px;border-radius:46px;background:linear-gradient(145deg,#DFF5EA,#8BDDBB);display:grid;place-items:center;box-shadow:0 24px 54px rgba(22,82,59,.18)}.v17-phone-art svg{width:68px;height:68px}.v17-phone-art h3{font-size:27px;margin:22px 0 7px}.v17-phone-art p{font-size:12px;color:#73837B;line-height:1.7;margin:0}.v17-phone-install{height:56px;border-radius:18px;background:#143B2C;color:#fff;display:grid;place-items:center;font-weight:850}

@media(max-width:520px){
  html.fw-v17 .app-header{right:10px;left:10px}
  html.fw-v17 .app-nav{right:10px;left:10px}
  html.fw-v17 .header-brand b{max-width:92px;overflow:hidden;text-overflow:ellipsis}
  html.fw-v17 .points-pill{padding:0 8px}
  html.fw-v17 .reel-bottom{left:75px}
  html.fw-v17 .knowledge-visual{left:14px;right:14px;height:40%}
  html.fw-v17 .reel:not(.video-reel) .reel-bottom{left:72px}
  html.fw-v17 .profile-menu{grid-template-columns:1fr}
}
@media(min-width:720px) and (max-width:1099px){
  html.fw-v17 .app-header,html.fw-v17 .app-nav{right:max(18px,calc((100vw - 760px)/2));left:max(18px,calc((100vw - 760px)/2))}
  html.fw-v17 .scroll-screen{padding-right:max(28px,calc((100vw - 800px)/2));padding-left:max(28px,calc((100vw - 800px)/2))}
  html.fw-v17 .profile-hub{grid-template-columns:300px 1fr}
  html.fw-v17 .profile-menu{grid-template-columns:1fr}
}
@media(min-width:1100px) and (hover:hover) and (pointer:fine){body.v17-desktop-mode{overflow:hidden;background:#06110D}}
@media(prefers-reduced-motion:reduce){html.fw-v17 *,html.fw-v17 *:before,html.fw-v17 *:after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}