/* Shared phone reading and touch layout. Player-specific canvases stay independent. */
@media(max-width:700px){
 html{font-size:16px}body>.wrap{padding-inline:16px;width:100%;min-width:0}
 .wrap>.topbar{height:auto;min-height:98px;display:flex;flex-wrap:wrap;align-items:center;gap:7px;padding:12px 0 0}
 .wrap>.topbar .brand{font-size:18px;gap:9px;min-height:36px}.wrap>.topbar .brandmark{width:32px;height:32px}
 .wrap>.topbar .nav{display:flex;width:100%;gap:0;justify-content:space-between;font-size:clamp(12px,3.3vw,14px)}
 .wrap>.topbar .nav a{display:flex;align-items:center;justify-content:center;flex:1;min-height:44px;padding:8px 4px;white-space:nowrap}
 .wrap>.footer{align-items:stretch;flex-direction:column;gap:8px;padding:14px 0;font-size:12px;line-height:1.6}.footerlinks{display:flex;flex-wrap:wrap;gap:8px 20px}.footerlinks a{display:inline-flex;align-items:center;min-height:44px;font-size:13px}
 .page{padding-top:20px;min-height:0}.breadcrumb{font-size:13px;line-height:1.6;flex-wrap:wrap;margin-bottom:18px}.breadcrumb a{display:inline-flex;align-items:center;min-height:36px}.page-title{font-size:26px;line-height:1.4}.subtle{font-size:15px;line-height:1.8}
 .tutorial-home{padding-block:24px;min-height:0}.tutorial-home .home-layout{display:block}.tutorial-home .home-intro{padding-bottom:22px}.tutorial-home h1{font-size:30px;line-height:1.4;margin-bottom:14px}.tutorial-home .lead{font-size:16px;line-height:1.8}.tutorial-home .home-caption{display:none}.home-device-heading h2{font-size:18px}.home-device-heading>span{font-size:12px}
 .tutorial-home .devices{display:flex;flex-direction:column;gap:12px}.tutorial-home .device-card,.tutorial-home .device-card:first-child{display:grid;grid-template-columns:44px minmax(0,1fr) 30px;gap:0 12px;padding:18px 16px;min-height:132px;border-radius:16px}
 .tutorial-home .device-card[href="#guide/desktop"]{display:grid!important;order:3}.tutorial-home .device-card .device-icon{width:44px;height:48px;grid-column:1;grid-row:1/4;margin:0;align-self:center}.tutorial-home .device-card .device-heading{grid-column:2;display:flex;flex-wrap:wrap;gap:4px 8px;padding:0}.tutorial-home .device-card h3{font-size:20px;padding:0;margin:0;line-height:1.5}.tutorial-home .platform-label{font-size:12px}
 .tutorial-home .device-card .software-list{grid-column:2;display:flex;flex-direction:row;flex-wrap:wrap;gap:10px 14px;margin-top:12px;padding:0;width:auto}.tutorial-home .software-entry{font-size:13px;gap:6px}.tutorial-home .software-icon{width:28px;height:28px}.tutorial-home .device-card .device-bottom{position:static;grid-column:3;grid-row:1/4;width:30px;height:30px;margin:0;align-self:center}.tutorial-home .desktop-platforms,.tutorial-home .desktop-card-label{display:none}
 .client-tabs{gap:8px}.client-tabs button{min-height:44px;font-size:14px;padding:10px 12px}.btn,.chip{min-height:44px}.guide-downloads .btn{min-height:44px;font-size:13px;padding:10px 12px}.download-menu-panel{min-width:0;width:min(300px,calc(100vw - 32px));max-height:60dvh;overflow:auto;overscroll-behavior:contain}.download-menu-panel>a{min-height:44px;display:flex;align-items:center;white-space:normal;font-size:14px;line-height:1.6}
 .sm-page{padding-top:12px;gap:12px}.sm-toolbar{flex-wrap:wrap;gap:10px}.sm-toolbar>a{width:36px;min-height:44px}.sm-toolbar h1{font-size:20px}.sm-toolbar .guide-downloads .btn{min-height:44px;font-size:13px}.sm-clients .client-tabs button{min-height:44px;font-size:14px}.sm-chapters summary{min-height:48px}.sm-chapters summary strong{font-size:16px}.sm-chapters summary>span{font-size:13px}.sm-chapters nav{max-height:min(62dvh,420px);overflow:auto;overscroll-behavior:contain}.sm-chapters nav button{min-height:44px;font-size:15px}.sm-progress-row{height:44px}.sm-page .cinema-scrubber{height:44px}.sm-page .cinema-step-line{top:21px}.sm-page .cinema-tick,.sm-page .cinema-thumb{top:22px}.sm-clock{font-size:12px}.sm-page .cinema-test-node{min-height:68px;font-size:16px}.sm-page .cinema-test-node small{font-size:12px}.sm-switch-note{font-size:12px}
 .knowledge-page .kb-layout{padding-top:4px}.kb-sidebar{margin-bottom:20px}.kb-nav{gap:8px}.kb-nav button{font-size:14px;min-height:44px;padding:10px 12px}.kb-sidebar .payment-telegram{min-height:44px}.kb-group-title{align-items:flex-start;flex-direction:column;gap:5px;margin-bottom:16px}.kb-group-title h2{font-size:23px}.kb-group-title p{font-size:13px;line-height:1.7}
 .knowledge-page .kb-question>summary{min-height:60px;padding:15px 14px;gap:8px}.knowledge-page .kb-question>summary h3{font-size:16px;line-height:1.65;min-width:0}.knowledge-page .kb-answer{padding:0 14px 18px}.knowledge-page .kb-answer>p,.knowledge-page .kb-help-steps>li{font-size:16px;line-height:1.8}.knowledge-page .kb-help-steps p{font-size:15px;line-height:1.8}.knowledge-page .kb-answer>h4{font-size:20px;line-height:1.5;margin:26px 0 12px}.kb-answer pre{max-width:100%;white-space:pre-wrap;overflow-wrap:anywhere}.kb-answer code{overflow-wrap:anywhere}.kb-code-figure{max-width:100%;overflow:auto;overscroll-behavior-x:contain}.kb-mac-command{gap:12px;padding:14px}.kb-mac-command pre{font-size:14px}.kb-mac-command .chip{align-self:flex-start}.kb-question .kb-guided-reference>summary{min-height:48px;font-size:16px}.kb-connect-check{padding:16px;gap:12px}.kb-connect-check .btn{font-size:14px}.kb-article-next a,.kb-mac-sources a,.kb-text-link{min-height:36px;line-height:1.8}.kb-mac-sources{line-height:2!important}
 .pay-cards{grid-template-columns:minmax(0,1fr);gap:18px;margin:20px auto}.paycard{padding:20px 16px}.paycard h2,.paycard h3{font-size:20px}.payment-qr-surface{max-width:100%;margin-inline:auto}.payment-code-image{max-width:100%;height:auto}.payment-native-hint{font-size:14px!important;line-height:1.7!important}.payment-contact{flex-wrap:wrap;gap:12px;padding:16px}.payment-contact>h2{font-size:16px}.payment-contact .btn{font-size:14px;min-height:44px}
 .modal-backdrop{padding:12px}.modal{padding:18px;max-height:calc(100dvh - 24px)}.modalhead h2{font-size:18px;line-height:1.5}.close{min-width:44px;min-height:44px}.toast{max-width:calc(100vw - 32px);font-size:14px;bottom:calc(16px + env(safe-area-inset-bottom))}
}
@media(max-width:359px){.tutorial-home .device-card,.tutorial-home .device-card:first-child{padding:16px 12px;gap:0 9px;grid-template-columns:38px minmax(0,1fr) 26px}.tutorial-home .device-card .device-icon{width:38px}.tutorial-home .device-card h3{font-size:18px}.tutorial-home .device-card .device-bottom{width:26px;height:26px}.tutorial-home .software-list{gap:9px!important}.tutorial-home .software-entry{font-size:12px}.tutorial-home .software-icon{width:24px;height:24px}.sm-toolbar .guide-downloads{width:100%;margin:0}.sm-toolbar .guide-downloads .btn{width:100%}.sm-clients .client-tabs button{padding-inline:8px;font-size:13px}}
/* Approved phone-home composition: two phone cards, with desktop-style hierarchy. */
@media(max-width:700px){
 .tutorial-home .device-card[href="#guide/desktop"]{display:none!important}
 .tutorial-home .device-card:is([href="#guide/android"],[href="#guide/ios"]){display:grid;grid-template-columns:64px minmax(0,1fr);grid-template-rows:auto 1fr;column-gap:16px;row-gap:20px;padding:20px;min-height:184px;position:relative}
 .tutorial-home .device-card:is([href="#guide/android"],[href="#guide/ios"]) .device-heading{grid-column:1/-1;grid-row:1;display:flex;align-items:baseline;gap:7px;padding-right:42px;margin:0}
 .tutorial-home .device-card:is([href="#guide/android"],[href="#guide/ios"]) h3{font-size:22px;line-height:1.4;white-space:nowrap}
 .tutorial-home .device-card:is([href="#guide/android"],[href="#guide/ios"]) .platform-label{font-size:11px;white-space:nowrap}
 .tutorial-home .device-card:is([href="#guide/android"],[href="#guide/ios"]) .device-icon{grid-column:1;grid-row:2;width:60px;height:64px;margin:0;background:transparent;box-shadow:none;border-radius:0;align-self:center}
 .tutorial-home .device-card:is([href="#guide/android"],[href="#guide/ios"]) .device-icon>.platform-logo{width:56px;height:60px}
 .tutorial-home .device-card:is([href="#guide/android"],[href="#guide/ios"]) .software-list{grid-column:2;grid-row:2;display:flex;justify-content:center;align-items:center;flex-wrap:nowrap;gap:clamp(14px,5vw,26px);margin:0;padding:0;width:100%}
 .tutorial-home .device-card:is([href="#guide/android"],[href="#guide/ios"]) .software-entry{flex-direction:column;align-items:center;gap:9px;font-size:13px;line-height:1.4;white-space:nowrap}
 .tutorial-home .device-card:is([href="#guide/android"],[href="#guide/ios"]) .software-icon{width:34px;height:34px}
 .tutorial-home .device-card:is([href="#guide/android"],[href="#guide/ios"]) .device-bottom{position:absolute;top:18px;right:18px;width:36px;height:36px;grid-area:auto;margin:0}
}
@media(max-width:359px){
 .tutorial-home .device-card:is([href="#guide/android"],[href="#guide/ios"]){padding:18px 16px;grid-template-columns:48px minmax(0,1fr);gap:18px 12px;min-height:174px}
 .tutorial-home .device-card:is([href="#guide/android"],[href="#guide/ios"]) h3{font-size:20px}
 .tutorial-home .device-card:is([href="#guide/android"],[href="#guide/ios"]) .platform-label{font-size:10px}
 .tutorial-home .device-card:is([href="#guide/android"],[href="#guide/ios"]) .device-icon{width:48px;height:56px}.tutorial-home .device-card:is([href="#guide/android"],[href="#guide/ios"]) .device-icon>.platform-logo{width:46px;height:52px}
 .tutorial-home .device-card:is([href="#guide/android"],[href="#guide/ios"]) .software-entry{font-size:12px}
}
.kb-film-close{position:absolute;right:12px;top:8px;z-index:105;min-height:44px;padding:10px 14px;border:1px solid #cddcf0;border-radius:9px;background:#fff;color:#2455a0;font-size:14px;cursor:pointer}
@media(max-width:700px){.kb-film-frame{height:600px;min-height:0}.kb-film.is-expanded{padding-top:56px;align-items:stretch}.kb-film.is-expanded .kb-film-frame{width:100%;height:calc(100dvh - 56px)!important}.kb-question{scroll-margin-top:8px}}
@media(max-width:700px){.sm-chapters .sm-help-link{display:flex;align-items:center;min-height:44px;padding:10px 12px;font-size:14px;color:#245fdb;border-top:1px solid #edf1f7}}

/* Phone FAQ: category first, reading list next, support after the content. */
@media(max-width:700px){
 .knowledge-page{padding-top:20px}
 .knowledge-page>.breadcrumb{margin-bottom:20px;font-size:13px;color:#66788f}
 .knowledge-page .kb-layout{display:flex;flex-direction:column;gap:0;padding-top:0}
 .knowledge-page .kb-sidebar{margin:0 0 24px;width:100%}
 .knowledge-page .kb-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:4px;background:#f1f4f8;border-radius:12px}
 .knowledge-page .kb-nav button{justify-content:center;text-align:center;min-height:44px;padding:10px 4px;background:transparent;font-size:14px;font-weight:500;border-radius:9px;color:#52647b}
 .knowledge-page .kb-nav button[aria-pressed="true"]{background:#fff;color:#155dfb;box-shadow:0 2px 5px #1d365410;font-weight:600}
 .knowledge-page .kb-group-title{margin:0 0 18px;gap:7px}
 .knowledge-page .kb-group-title h2{font-size:25px;font-weight:650;letter-spacing:-.02em}
 .knowledge-page .kb-group-title p{font-size:13px;line-height:1.7;color:#718096}
 .knowledge-page .kb-group{margin-bottom:0}
 .knowledge-page .kb-question{border:0;border-bottom:1px solid #e4eaf2;border-radius:0;margin:0;overflow:visible;background:transparent}
 .knowledge-page .kb-question:first-of-type{border-top:1px solid #e4eaf2}
 .knowledge-page .kb-question>summary{padding:19px 0;min-height:64px;gap:12px}
 .knowledge-page .kb-question>summary h3{font-size:16px;font-weight:550;line-height:1.65;color:#243c5b}
 .knowledge-page .kb-question>summary>.kb-chevron{width:16px;flex-shrink:0;color:#8798af}
 .knowledge-page .kb-question[open]>summary h3{color:#155dfb}
 .knowledge-page .kb-question>.kb-answer{padding:0 0 20px}
 .knowledge-page .kb-layout>.kb-contact{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;margin:28px 0 0;padding:16px 0;border:0;border-top:1px solid #e4eaf2;border-radius:0;background:none}
 .knowledge-page .kb-contact>h2{font-size:14px;font-weight:400;color:#718096;margin:0}
 .knowledge-page .kb-contact .payment-telegram{min-height:44px;background:transparent;color:#155dfb;box-shadow:none;border:0;padding:8px 0;font-size:14px;gap:8px}
 .knowledge-page .kb-contact .payment-telegram img{width:18px;height:18px}
}

/* The primary navigation already identifies these two phone pages. */
@media(max-width:700px){
 .knowledge-page>.breadcrumb,.payment-page>.breadcrumb{display:none}
 .knowledge-page{padding-top:18px}
}
@media(max-width:700px){
 .payment-page .paycard-alipay{order:-1}
}

/* The expanded portrait player retains its content height instead of adding blank screen space. */
@media(max-width:700px){.kb-film.is-expanded{align-items:flex-start;padding:56px 12px 16px;overflow-y:auto}.kb-film.is-expanded .kb-film-frame{height:var(--film-content-height,600px)!important;flex-shrink:0}}

/* Animated content must not move the outer document scroll anchor. */
.kb-film,.cinema-film{overflow-anchor:none}
