/* Shared illustration frames and operating-system scenes. Loaded after the scene styles. */
@font-face{
  font-family:'Tutorial Inter';
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
  src:url('fonts/Inter-latin.woff2') format('woff2');
}
:root{
  --tutorial-font:'Tutorial Inter','Noto Sans SC',-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Microsoft YaHei',sans-serif;
}

/* The stage belongs to the tutorial; each illustration keeps its own app palette. */
.tut-panel .tut-mock,
.tut-mock-phone,
.tut-mock-win{
  width:100%;max-width:100%;height:auto;
  position:relative;margin:0;
  padding:32px 26px;
  overflow:hidden;
  background:radial-gradient(ellipse at 50% 0,rgba(var(--glow,217,46,26),.055),transparent 65%),#f4f6fa;
  border-top:1px solid #e8ecf2;
  border-radius:0 0 20px 20px;
}
.tut-mock-phone{display:flex;justify-content:center;align-items:flex-start;}
.tut-mock-win{display:block;}
.proto-phone,
.proto-win{
  --proto-brand:var(--brand,#d92e1a);
  --proto-brand-l:var(--brand-l,#ff5a44);
  --proto-glow:var(--glow,217,46,26);
  --proto-font:var(--tutorial-font);
  font-family:var(--tutorial-font);
  text-align:left;
}
.proto-phone *,
.proto-win *{box-sizing:border-box;}
.proto-phone svg,
.proto-win svg{display:block;flex-shrink:0;}
.proto-phone [class^="proto-"],
.proto-win [class^="proto-"]{font-family:var(--tutorial-font);}
.guide-visual-fallback{padding:3rem 1rem;text-align:center;color:#697386;font-size:14px;}

/* Match the prototype's 380 x 822 shell; content keeps real responsive text. */
.tut-mock-phone .proto-phone{
  width:380px;max-width:100%;height:auto;
  aspect-ratio:380 / 822;
  display:grid;grid-template-rows:minmax(0,1fr);
  flex:0 1 380px;
  padding:10px;margin:0;
  border:1px solid #353a43;
  border-radius:44px;
  background:linear-gradient(145deg,#323740,#0d1118 58%,#252b34);
  box-shadow:0 1px 1px rgba(255,255,255,.4) inset,0 3px 6px rgba(16,24,40,.1),0 24px 48px -18px rgba(16,24,40,.28);
  transform:none;-webkit-transform:none;
  transform-origin:initial;-webkit-transform-origin:initial;
}
.guide-phone-frame .proto-screen{
  position:relative;width:100%;height:100%;min-height:0;
  aspect-ratio:auto;
  border-radius:34px;
  background:#f5f6f8;
  overflow:hidden;
  container-type:inline-size;
}
.guide-phone-frame .proto-screen-nx{background:#0b0e14;}
.guide-phone-frame .proto-sb{
  height:45px;padding:0 21px 8px;
  align-items:flex-end;
  color:#202631;font-size:12px;font-weight:600;
  background:transparent;
}
.guide-phone-frame .proto-screen-nx .proto-sb{color:#f5f7fb;}
.guide-phone-frame .proto-sbr{display:flex;align-items:center;gap:4px;height:15px;}
.guide-phone-frame .proto-dyn{top:9px;width:96px;height:25px;border-radius:20px;}
.guide-phone-frame .proto-view{top:45px;bottom:0;left:0;right:0;overflow:hidden;}

/* Shared window chrome; desktop app modules decide their own content height. */
.tut-mock-win .proto-win{
  width:100%;max-width:1060px;height:auto;min-height:0;margin:0 auto;
  display:flex;flex-direction:column;
  transform:none;-webkit-transform:none;
  transform-origin:initial;-webkit-transform-origin:initial;
  border:1px solid #d7dde6;border-radius:15px;
  background:#fff;overflow:hidden;
  box-shadow:0 2px 5px rgba(20,30,48,.04),0 18px 42px -17px rgba(20,30,48,.2),0 1px 1px rgba(255,255,255,.95) inset;
}
.guide-desktop-frame .proto-titlebar{
  display:flex;align-items:center;justify-content:space-between;
  height:43px;min-height:43px;
  padding:0 0 0 14px;
  background:linear-gradient(180deg,#fff,#fafbfd);
  border-bottom:1px solid #e7ebf0;
}
.guide-desktop-frame .proto-tb-brand{display:flex;align-items:center;gap:9px;min-width:0;}
.guide-frame-title{display:flex;align-items:center;gap:9px;min-width:0;line-height:1.3;}
.guide-frame-title strong{font-size:12px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#353d4b;}
.guide-frame-title>span{font-size:10px;color:#959ead;white-space:nowrap;}
.guide-desktop-frame .proto-tb-btns{gap:0;align-self:stretch;flex-shrink:0;}
.guide-desktop-frame .proto-tb-btns>span{
  display:flex;align-items:center;justify-content:center;
  width:39px;height:auto;border-radius:0;background:transparent;color:#838d9e;
}
.guide-desktop-frame .proto-tb-btns>.proto-close{background:transparent;color:#838d9e;}
.guide-desktop-frame .proto-win-body{display:block;flex:1 1 auto;min-width:0;min-height:0;height:auto;}

/* Android settings and the first connection request. */
.guide-phone-frame .proto-android-sys{height:100%;min-width:0;background:#f7f8fb;}
.guide-phone-frame .proto-android-sb{display:none;}
.guide-phone-frame .proto-android-topbar{height:60px;padding:0 18px;gap:13px;border-bottom-color:#e8ecf2;}
.guide-phone-frame .proto-android-bar-title{font-size:17px;font-weight:600;}
.guide-phone-frame .proto-android-body{padding:22px 16px;background:#f6f7fa;}
.guide-phone-frame .proto-android-appcard{padding:15px 12px;gap:12px;border:1px solid #e9edf2;border-radius:18px;box-shadow:0 3px 12px rgba(21,29,43,.035);}
.guide-phone-frame .proto-android-appicon{background:transparent;width:46px;height:46px;flex-shrink:0;}
.guide-phone-frame .proto-android-appinfo{min-width:0;}
.guide-phone-frame .proto-android-appname{font-size:13px;overflow-wrap:anywhere;}
.guide-phone-frame .proto-android-appsrc{font-size:11px;color:#848d9b;margin-top:4px;}
.guide-phone-frame .proto-android-warn{padding:13px 12px;gap:9px;border-radius:13px;background:#fff6e9;border-color:#ffe5bf;}
.guide-phone-frame .proto-android-warn-txt{font-size:12px;line-height:1.65;color:#99631c;}
.guide-phone-frame .proto-android-row{padding:15px 12px;gap:10px;border:1px solid #e9edf2;box-shadow:0 3px 12px rgba(21,29,43,.035);}
.guide-phone-frame .proto-android-row-txt{min-width:0;}
.guide-phone-frame .proto-android-row-main{font-size:13px;line-height:1.5;}
.guide-phone-frame .proto-android-row-sub{font-size:11px;color:#848d9b;margin-top:4px;}
.guide-phone-frame .proto-android-sw{width:43px;height:26px;border-radius:14px;}
.guide-phone-frame .proto-android-sw::after{width:20px;height:20px;}
.guide-phone-frame .proto-android-sw-on{background:var(--brand,#d92e1a);}
.guide-phone-frame .proto-android-sw-on::after{left:20px;}
.guide-phone-frame .proto-android-install-btn{height:47px;font-size:14px;font-weight:600;background:var(--brand,#d92e1a);box-shadow:0 7px 18px -11px rgba(var(--glow,217,46,26),.5);}
.guide-phone-frame .proto-android-cancel-btn{height:45px;font-size:13px;color:var(--brand,#d92e1a);border-color:rgba(var(--glow,217,46,26),.25);}
.guide-phone-frame .proto-android-connection-scrim{top:0;padding:17px;}
.guide-phone-frame .proto-android-connection-dlg{padding:25px 21px 18px;border-radius:25px;box-shadow:0 16px 45px rgba(10,17,28,.24);}
.guide-phone-frame .proto-android-connection-t{font-size:19px;font-weight:600;}
.guide-phone-frame .proto-android-connection-d{font-size:13px;line-height:1.7;}
.guide-phone-frame .proto-android-connection-badge{display:flex;align-items:center;gap:7px;padding:11px 10px;margin:0 0 14px;background:#f3f6fa;border-radius:11px;font-size:11px;line-height:1.5;color:#778293;}
.guide-phone-frame .proto-android-connection-btns{justify-content:flex-end;gap:7px;}
.guide-phone-frame .proto-android-connection-cancel{color:var(--brand,#d92e1a);padding:10px 13px;}
.guide-phone-frame .proto-android-connection-ok{background:var(--brand,#d92e1a);padding:10px 18px;}

/* Download-page examples share the site's brand, with softer card treatments. */
.guide-phone-frame .proto-dlpage{padding:22px 15px;background:#f7f8fb;}
.guide-phone-frame .proto-dlhero{padding:18px 0 22px;}
.guide-phone-frame .proto-dlname{font-size:27px;font-weight:750;overflow-wrap:anywhere;}
.guide-phone-frame .proto-dlsub{margin:7px 0 0;font-size:12px;color:#8490a0;}
.guide-phone-frame .proto-dlbtn{font-size:13px;padding:12px 20px;border-radius:13px;margin-top:15px;box-shadow:0 9px 20px -13px rgba(var(--glow,217,46,26),.5);}
.guide-phone-frame .proto-dlcard{padding:3px 12px;border-radius:17px;border-color:#e5eaf0;box-shadow:0 8px 24px -15px rgba(20,30,48,.14);}
.guide-phone-frame .proto-dlrow{padding:17px 0;gap:8px;}
.guide-phone-frame .proto-dlarch{font-size:12px;line-height:1.6;}
.guide-phone-frame .proto-pct{font-size:9px;margin-left:3px;padding:2px 6px;}
.guide-phone-frame .proto-dlformat{font-size:10px;color:#8c96a5;}
.guide-desktop-frame .proto-win-dl{padding:38px 32px 34px;min-height:430px;background:#f7f8fb;}
.guide-desktop-frame .proto-win-dlhero{margin-bottom:28px;}
.guide-desktop-frame .proto-win-dlname{font-size:34px;line-height:1.25;overflow-wrap:anywhere;}
.guide-desktop-frame .proto-win-dlsub{font-size:13px;margin-top:8px;color:#8490a0;}
.guide-desktop-frame .proto-win-dlbtns{display:flex;flex-wrap:wrap;gap:9px;margin-top:20px;}
.guide-desktop-frame .proto-win-dlbtn-brand,.guide-desktop-frame .proto-win-dlbtn-out{height:42px;padding:0 18px;font-size:12px;border-radius:12px;}
.guide-desktop-frame .proto-win-dlbtn-out{border:1px solid rgba(var(--glow,217,46,26),.22);background:#fff;}
.guide-desktop-frame .proto-win-plats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;}
.guide-desktop-frame .proto-win-plat{flex-direction:column;align-items:center;gap:12px;text-align:center;padding:20px 14px;border-radius:17px;border-color:#e5eaf0;box-shadow:0 7px 22px -17px rgba(20,30,48,.18);min-width:0;}
.guide-desktop-frame .proto-win-plat>div{min-width:0;}
.guide-desktop-frame .proto-win-plat-ic{font-size:29px;}
.guide-desktop-frame .proto-win-plat-nm{font-size:15px;font-weight:600;margin-bottom:10px;}
.guide-desktop-frame .proto-win-plat-arch{display:flex;flex-wrap:wrap;justify-content:center;gap:5px;}
.guide-desktop-frame .proto-win-dl-btn{display:inline-block;padding:6px 9px;font-size:10px;border:1px solid rgba(var(--glow,217,46,26),.18);border-radius:9px;color:var(--brand,#d92e1a);background:rgba(var(--glow,217,46,26),.045);}

/* System backdrops grow with their dialog, so narrow screens never crop instructions. */
.guide-desktop-frame .proto-sys-win,
.guide-desktop-frame .proto-sys-mac{position:relative;display:block;width:100%;height:auto;min-height:0;overflow:visible;}
.guide-desktop-frame .proto-win11-bg,
.guide-desktop-frame .proto-mac-bg{
  position:relative;inset:auto;
  width:100%;height:auto;min-height:430px;
  padding:48px 30px 65px;
  display:flex;align-items:center;justify-content:center;
}
.guide-desktop-frame .proto-win11-bg{background:radial-gradient(ellipse at 30% 10%,#315782,transparent 65%),linear-gradient(135deg,#172945,#243757 60%,#152742);}
.guide-desktop-frame .proto-win11-bg::after{height:40px;background:rgba(10,20,36,.3);backdrop-filter:none;-webkit-backdrop-filter:none;}
.guide-desktop-frame .proto-mac-bg{background:radial-gradient(ellipse at 75% 10%,#815cab,transparent 60%),linear-gradient(140deg,#34426a,#61528a 55%,#327c86);}
.guide-desktop-frame .proto-mac-bg::before{height:28px;font-size:11px;padding:0 15px;background:rgba(10,20,36,.3);backdrop-filter:none;-webkit-backdrop-filter:none;white-space:nowrap;overflow:hidden;}
.guide-desktop-frame .proto-smartscreen,
.guide-desktop-frame .proto-uac{width:440px;max-width:100%;border-radius:13px;border:1px solid rgba(255,255,255,.4);box-shadow:0 3px 12px rgba(9,20,40,.1),0 26px 60px -16px rgba(9,20,40,.4);}
.guide-desktop-frame .proto-ss-header{padding:22px 23px 20px;gap:15px;background:linear-gradient(135deg,#095096,#073775);}
.guide-desktop-frame .proto-ss-shield{font-size:0;filter:none;color:#fff;margin-top:2px;}
.guide-desktop-frame .proto-ss-titles{min-width:0;}
.guide-desktop-frame .proto-ss-title{font-size:16px;line-height:1.5;margin-bottom:8px;}
.guide-desktop-frame .proto-ss-sub{font-size:12px;line-height:1.75;}
.guide-desktop-frame .proto-ss-info{padding:19px 23px 8px;background:#f4f6f9;}
.guide-desktop-frame .proto-ss-row{font-size:12px;line-height:1.7;overflow-wrap:anywhere;}
.guide-desktop-frame .proto-ss-more{padding:8px 23px 18px;font-size:12px;background:#f4f6f9;}
.guide-desktop-frame .proto-ss-btns{padding:15px 20px;gap:9px;flex-wrap:wrap;}
.guide-desktop-frame .proto-ss-btn-cancel,.guide-desktop-frame .proto-ss-btn-run{font-size:12px;border-radius:6px;padding:8px 17px;}
.guide-desktop-frame .proto-uac-header{padding:22px 23px;gap:15px;background:linear-gradient(135deg,#26568b,#163e73);}
.guide-desktop-frame .proto-uac-shield{font-size:0;color:#fff;}
.guide-desktop-frame .proto-uac-title{font-size:15px;line-height:1.65;}
.guide-desktop-frame .proto-uac-body{padding:19px 23px 18px;background:#f4f6f9;}
.guide-desktop-frame .proto-uac-row{font-size:12px;line-height:1.7;align-items:flex-start;}
.guide-desktop-frame .proto-uac-val{min-width:0;overflow-wrap:anywhere;}
.guide-desktop-frame .proto-uac-hint{font-size:11px;border-radius:8px;padding:10px 12px;background:#fff8e9;border-color:#f3e5bf;}
.guide-desktop-frame .proto-uac-btns{padding:15px 20px;gap:9px;}
.guide-desktop-frame .proto-uac-yes,.guide-desktop-frame .proto-uac-no{border-radius:6px;font-size:12px;padding:8px 25px;}

/* macOS Finder, Gatekeeper and the one-time permission dialog. */
.guide-desktop-frame .proto-finder{width:480px;max-width:100%;border:1px solid rgba(255,255,255,.5);border-radius:14px;}
.guide-desktop-frame .proto-finder-titlebar{height:40px;background:linear-gradient(180deg,#f3f4f7,#e8eaf0);}
.guide-desktop-frame .proto-finder-title{font-size:12px;min-width:0;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;margin-left:12px;}
.guide-desktop-frame .proto-finder-body{padding:36px 24px 26px;background:#fff;}
.guide-desktop-frame .proto-finder-row{gap:20px;align-items:center;margin-bottom:25px;}
.guide-desktop-frame .proto-finder-app{flex:1;min-width:0;gap:12px;}
.guide-desktop-frame .proto-finder-icon{display:flex;align-items:center;justify-content:center;width:78px;height:78px;background:transparent;}
.guide-desktop-frame .proto-finder-folder{display:flex;align-items:center;justify-content:center;width:78px;height:78px;color:#269cc8;background:transparent;}
.guide-desktop-frame .proto-finder-name{font-size:12px;line-height:1.5;text-align:center;color:#414957;overflow-wrap:anywhere;}
.guide-desktop-frame .proto-finder-arrow{flex-shrink:0;color:#949daf;font-size:25px;animation:none;-webkit-animation:none;}
.guide-desktop-frame .proto-finder-hint{padding:12px 14px;background:#f5f7fa;border:1px solid #e8edf3;color:#7f8999;font-size:11px;border-radius:10px;}
.guide-desktop-frame .proto-gatekeeper{width:380px;max-width:100%;border:1px solid rgba(255,255,255,.65);background:#fbfbfd;border-radius:16px;box-shadow:0 4px 15px rgba(10,20,35,.07),0 22px 45px -13px rgba(10,20,35,.3);}
.guide-desktop-frame .proto-gk-icon{display:flex;align-items:center;justify-content:center;font-size:0;color:#7b879b;margin:27px 0 12px;}
.guide-desktop-frame .proto-win-orb-ic{display:flex;align-items:center;justify-content:center;font-size:0;color:var(--brand,#d92e1a);}
.guide-desktop-frame .proto-gk-title{font-size:14px;line-height:1.6;overflow-wrap:anywhere;}
.guide-desktop-frame .proto-gk-body{font-size:12px;line-height:1.75;}
.guide-desktop-frame .proto-gk-btns{background:#f5f6f9;}
.guide-desktop-frame .proto-gk-btn-cancel,.guide-desktop-frame .proto-gk-btn-open{font-size:13px;padding:13px 8px;}
.guide-desktop-frame .proto-mac-bg-flow{min-height:0;padding:0;display:flex;flex-direction:column;gap:0;}
.guide-desktop-frame .proto-mac-bg-flow::before{display:none;}
.guide-desktop-frame .proto-gk-topbar{padding:16px 22px;background:rgba(10,20,36,.22);backdrop-filter:none;-webkit-backdrop-filter:none;}
.guide-desktop-frame .proto-gk-topbar-inner{gap:9px;flex-wrap:wrap;}
.guide-desktop-frame .proto-gk-topbar-txt{white-space:normal;font-size:12px;line-height:1.6;text-align:center;}
.guide-desktop-frame .proto-gk-flow{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);width:100%;flex:none;gap:10px;padding:30px 22px;align-items:center;}
.guide-desktop-frame .proto-gk-step{width:100%;min-width:0;align-self:start;}
.guide-desktop-frame .proto-gk-step-num{width:28px;height:28px;font-size:13px;margin-bottom:15px;box-shadow:0 4px 14px rgba(10,20,36,.2);}
.guide-desktop-frame .proto-gk-step-scene{min-width:0;gap:14px;}
.guide-desktop-frame .proto-gk-step-tip{font-size:12px;line-height:1.8;color:rgba(255,255,255,.82);max-width:290px;}
.guide-desktop-frame .proto-gk-sm{width:100%;max-width:250px;}
.guide-desktop-frame .proto-sysset-sm{width:100%;max-width:275px;border:1px solid rgba(255,255,255,.6);border-radius:14px;}
.guide-desktop-frame .proto-gk-sm .proto-gk-btns .proto-gk-btn-cancel,
.guide-desktop-frame .proto-gk-sm .proto-gk-btns .proto-gk-btn-open{font-size:12px;padding:11px 8px;}
.guide-desktop-frame .proto-sysset-titlebar{height:38px;background:#e9ebf0;padding:0 12px;}
.guide-desktop-frame .proto-sysset-title{font-size:12px;line-height:1.5;margin-left:10px;}
.guide-desktop-frame .proto-sysset-sm .proto-sysset-body{padding:13px;background:#f5f6f9;}
.guide-desktop-frame .proto-sysset-blocked{border-color:#e4e8ef;padding:12px;border-radius:10px;box-shadow:0 2px 6px rgba(15,23,42,.025);}
.guide-desktop-frame .proto-sysset-blocked-txt{line-height:1.75;overflow-wrap:anywhere;}
.guide-desktop-frame .proto-sysset-blocked-btn{background:#e7effa;color:#0067d3;padding:6px 11px;border-radius:8px;font-size:11px;}
.guide-desktop-frame .proto-gk-arrow{margin:0;align-self:center;transform:none;-webkit-transform:none;font-size:23px;}
.guide-desktop-frame .proto-mac-appbg{max-width:80%;}
.guide-desktop-frame .proto-connection-dlg{width:340px;max-width:100%;}
.guide-desktop-frame .proto-connection-auth{margin:0 22px 18px;background:#f0f2f6;border:1px solid #e5e8ef;border-radius:10px;}
.guide-desktop-frame .proto-connection-auth-row{font-size:11px;line-height:1.65;padding:11px 12px;}
.guide-desktop-frame .proto-connection-auth-input{height:39px;font-size:12px;border-top:1px solid #e5e8ef;color:#949dab;}

/* Linux commands wrap intact rather than disappearing beyond a scaled terminal. */
.guide-desktop-frame .proto-win-term{min-height:440px;height:auto;display:flex;flex-direction:column;background:#151b29;}
.guide-desktop-frame .proto-term-bar{height:40px;background:#202838;padding:0 16px;gap:7px;}
.guide-desktop-frame .proto-term-dot{width:10px;height:10px;}
.guide-desktop-frame .proto-term-title{font-size:11px;}
.guide-desktop-frame .proto-term-body{padding:24px 26px;color:#d2dbea;line-height:1.85;font-size:12px;overflow:visible;}
.guide-desktop-frame .proto-term-body,
.guide-desktop-frame .proto-term-body *{font-family:'SFMono-Regular',Consolas,'Liberation Mono',Menlo,monospace;}
.guide-desktop-frame .proto-term-line{display:block;overflow-wrap:anywhere;word-break:break-word;margin-bottom:5px;}
.guide-desktop-frame .proto-term-prompt{display:inline-block;margin-right:8px;color:#70d4a9;}
.guide-desktop-frame .proto-term-section{font-size:11px;font-weight:600;color:#8da1bf;line-height:1.7;margin-bottom:10px;}
.guide-desktop-frame .proto-term-out{overflow-wrap:anywhere;padding-left:19px;color:#a2adc1;margin:5px 0 13px;}
.guide-desktop-frame .proto-term-ok{color:#70d4a9;}
.guide-desktop-frame .proto-term-cursor{animation:none;-webkit-animation:none;}

/* Nextin keeps its original blue and dark palette; only its viewport adapts. */
.guide-phone-frame .proto-nx-navic{display:flex;align-items:center;justify-content:center;}
.guide-phone-frame .proto-nx-page{padding:14px 15px;}
.guide-phone-frame .proto-nx-top{padding-top:3px;}
.guide-phone-frame .proto-nx-hi-m{font-size:12px;}
.guide-phone-frame .proto-nx-title{font-size:34px;line-height:1.2;margin:11px 0 10px;}
.guide-phone-frame .proto-nx-orb{width:168px;height:168px;margin:7px auto 12px;}
.guide-phone-frame .proto-nx-orb-core{width:132px;height:132px;}
.guide-phone-frame .proto-nx-orb-pw{font-size:37px;}
.guide-phone-frame .proto-nx-orb-st{font-size:14px;}
.guide-phone-frame .proto-nx-region{font-size:20px;line-height:1.4;}
.guide-phone-frame .proto-nx-rate{width:85%;padding:8px 0;gap:11px;font-size:12px;}
.guide-phone-frame .proto-nx-cards{gap:8px;}
.guide-phone-frame .proto-nx-card{padding:13px 12px;min-width:0;}
.guide-phone-frame .proto-nx-plan-nm{font-size:15px;}
.guide-phone-frame .proto-nx-plan-inf{font-size:11px;line-height:1.6;}
.guide-phone-frame .proto-nx-ccol{width:140px;gap:8px;}
.guide-phone-frame .proto-nx-scard{gap:7px;padding:12px 10px;}
.guide-phone-frame .proto-nx-scard-t{font-size:12px;}
.guide-phone-frame .proto-nx-nav{padding-left:20px;padding-right:20px;}
.guide-phone-frame .proto-nx-nodehd{padding:0 10px;gap:6px;}
.guide-phone-frame .proto-nx-nodettl{font-size:16px;}
.guide-phone-frame .proto-nx-nodelist{padding:4px 14px;}
.guide-phone-frame .proto-nx-noderow{padding:13px 0;gap:10px;}
.guide-phone-frame .proto-nx-nodenm{font-size:13px;}
.guide-phone-frame .proto-nx-nodety{font-size:10px;}
.guide-phone-frame .proto-ios-sheet{padding:20px 15px 24px;}
.guide-phone-frame .proto-ios-sheet-t{font-size:15px;line-height:1.5;}
.guide-phone-frame .proto-ios-sheet-d{line-height:1.7;}
.guide-phone-frame .proto-ios-opt{font-size:14px;}
.guide-phone-frame .proto-nx-dlg{width:85%;padding:21px 18px;}
.guide-phone-frame .proto-nx-dlg-t{font-size:17px;line-height:1.45;}
.guide-phone-frame .proto-nx-dlg-d,.guide-phone-frame .proto-nx-dlg-ul li{font-size:12px;line-height:1.8;}
.guide-phone-frame .proto-nx-dlg-cancel,.guide-phone-frame .proto-nx-dlg-ok{font-size:14px;height:44px;}
.guide-phone-frame .proto-ios-connection{width:85%;padding:22px 18px 16px;}
.guide-phone-frame .proto-ios-connection-t{font-size:15px;line-height:1.5;}
.guide-phone-frame .proto-ios-connection-d{font-size:12px;line-height:1.7;}
.guide-phone-frame .proto-nx-biglogo{margin:54px 0 32px;}
.guide-phone-frame .proto-nx-field{font-size:12px;padding:0 12px;gap:7px;}
.guide-phone-frame .proto-nx-btn{height:49px;font-size:15px;}
.guide-phone-frame .proto-nx-legal{font-size:11px;line-height:1.8;}
.guide-phone-frame .proto-nx-lpage{padding:32px 19px;}
.guide-phone-frame .proto-nx-lbrand{gap:11px;margin:15px 0 33px;}
.guide-phone-frame .proto-nx-lbrand-t{font-size:31px;}
.guide-phone-frame .proto-nx-llabel{font-size:14px;}
.guide-phone-frame .proto-nx-linput{font-size:12px;padding:0 13px;gap:8px;}
.guide-phone-frame .proto-nx-lgo{height:51px;font-size:15px;margin-top:27px;}
.guide-phone-frame .proto-nx-lback{margin-top:85px;font-size:12px;}

@container(max-width:300px){
  .guide-phone-frame .proto-nx-page{padding-left:12px;padding-right:12px;}
  .guide-phone-frame .proto-nx-bell,.guide-phone-frame .proto-nx-help{width:34px;height:34px;font-size:16px;}
  .guide-phone-frame .proto-nx-hi-m{font-size:11px;}
  .guide-phone-frame .proto-nx-title{font-size:29px;margin:9px 0 7px;}
  .guide-phone-frame .proto-nx-orb{width:146px;height:146px;margin-bottom:10px;}
  .guide-phone-frame .proto-nx-orb-core{width:116px;height:116px;}
  .guide-phone-frame .proto-nx-orb-pw{font-size:32px;}
  .guide-phone-frame .proto-nx-orb-st{font-size:13px;}
  .guide-phone-frame .proto-nx-region{font-size:17px;}
  .guide-phone-frame .proto-nx-cards{flex-direction:column;gap:8px;}
  .guide-phone-frame .proto-nx-card-plan{padding:11px 12px;}
  .guide-phone-frame .proto-nx-plan-inf{margin:6px 0;}
  .guide-phone-frame .proto-nx-ccol{display:flex;flex-direction:row;width:100%;gap:8px;}
  .guide-phone-frame .proto-nx-scard{flex:1;min-width:0;padding:10px 8px;gap:5px;}
  .guide-phone-frame .proto-nx-scard-ic{font-size:16px;}
  .guide-phone-frame .proto-nx-scard-t{font-size:11px;}
  .guide-phone-frame .proto-nx-scard-s{font-size:10px;}
  .guide-phone-frame .proto-nx-scard-ar{display:none;}
  .guide-phone-frame .proto-nx-nav{height:68px;padding:6px 15px 13px;}
  .guide-phone-frame .proto-nx-noderow{gap:8px;padding:12px 0;}
  .guide-phone-frame .proto-nx-nodenm{font-size:12px;}
  .guide-phone-frame .proto-nx-radio{width:20px;height:20px;font-size:12px;}
  .guide-phone-frame .proto-nx-nodeflag{font-size:19px;}
  .guide-phone-frame .proto-as{padding:14px 12px;}
  .guide-phone-frame .proto-as-card{padding:13px;gap:11px;}
  .guide-phone-frame .proto-as-icon{width:53px;height:53px;}
  .guide-phone-frame .proto-as-nm{font-size:15px;}
  .guide-phone-frame .proto-nx-biglogo svg{width:99px;height:99px;}
  .guide-phone-frame .proto-ios-connection-t{font-size:14px;}
  .guide-phone-frame .proto-ios-sheet-t{font-size:14px;}
  .guide-phone-frame .proto-ios-opt{font-size:13px;}
  .guide-phone-frame .proto-nx-dlg{padding:20px 15px;}
  .guide-phone-frame .proto-nx-dlg-t{font-size:16px;}
  .guide-phone-frame .proto-nx-dlg-btns{gap:8px;}
}
@container(max-width:260px){
  .guide-phone-frame .proto-nx-lback{margin-top:70px;}
}
@media(max-width:760px){
  .tut-panel .tut-mock,.tut-mock-phone,.tut-mock-win{padding:23px 18px;}
  .guide-desktop-frame .proto-win-plats{grid-template-columns:minmax(0,1fr);gap:11px;}
  .guide-desktop-frame .proto-win-plat{flex-direction:row;text-align:left;align-items:center;padding:17px;gap:15px;}
  .guide-desktop-frame .proto-win-plat-nm{margin-bottom:7px;}
  .guide-desktop-frame .proto-win-plat-arch{justify-content:flex-start;}
  .guide-desktop-frame .proto-gk-flow{grid-template-columns:minmax(0,1fr);gap:15px;padding:26px 20px 29px;}
  .guide-desktop-frame .proto-gk-step-scene{gap:13px;}
  .guide-desktop-frame .proto-gk-sm{max-width:305px;}
  .guide-desktop-frame .proto-sysset-sm{max-width:305px;}
  .guide-desktop-frame .proto-gk-arrow{justify-self:center;transform:rotate(90deg);-webkit-transform:rotate(90deg);font-size:22px;}
}
@media(max-width:520px){
  .tut-panel .tut-mock,.tut-mock-phone,.tut-mock-win{padding:19px 10px;}
  .tut-mock-phone .proto-phone{padding:8px;border-radius:35px;}
  .guide-phone-frame .proto-screen{border-radius:27px;}
  .guide-phone-frame .proto-sb{padding-left:17px;padding-right:17px;}
  .guide-phone-frame .proto-dyn{width:83px;height:24px;}
  .guide-desktop-frame .proto-titlebar{padding-left:10px;height:40px;min-height:40px;}
  .guide-desktop-frame .proto-tb-brand{gap:7px;}
  .guide-frame-title{gap:0;}
  .guide-frame-title>span{display:none;}
  .guide-desktop-frame .proto-tb-btns>span{width:28px;}
  .guide-desktop-frame .proto-win11-bg,.guide-desktop-frame .proto-mac-bg{padding:45px 13px 56px;min-height:405px;}
  .guide-desktop-frame .proto-mac-bg-flow{padding:0;min-height:0;}
  .guide-desktop-frame .proto-ss-header,.guide-desktop-frame .proto-uac-header{padding:18px 15px;gap:10px;}
  .guide-desktop-frame .proto-ss-shield>svg,.guide-desktop-frame .proto-uac-shield>svg{width:28px;height:28px;}
  .guide-desktop-frame .proto-ss-title{font-size:14px;}
  .guide-desktop-frame .proto-ss-sub{font-size:11px;}
  .guide-desktop-frame .proto-ss-info{padding:15px 15px 8px;}
  .guide-desktop-frame .proto-ss-more{padding:7px 15px 14px;}
  .guide-desktop-frame .proto-ss-btns,.guide-desktop-frame .proto-uac-btns{padding:13px 14px;gap:7px;}
  .guide-desktop-frame .proto-ss-btn-cancel,.guide-desktop-frame .proto-ss-btn-run{padding:8px 13px;font-size:11px;}
  .guide-desktop-frame .proto-uac-title{font-size:13px;}
  .guide-desktop-frame .proto-uac-body{padding:16px 15px;}
  .guide-desktop-frame .proto-uac-row{flex-wrap:wrap;gap:1px 5px;}
  .guide-desktop-frame .proto-finder-titlebar{padding:0 10px;}
  .guide-desktop-frame .proto-finder-body{padding:27px 12px 18px;}
  .guide-desktop-frame .proto-finder-row{gap:8px;margin-bottom:20px;}
  .guide-desktop-frame .proto-finder-icon,.guide-desktop-frame .proto-finder-folder{width:59px;height:59px;}
  .guide-desktop-frame .proto-finder-icon>svg,.guide-desktop-frame .proto-finder-folder>svg{width:56px;height:56px;}
  .guide-desktop-frame .proto-finder-name{font-size:11px;}
  .guide-desktop-frame .proto-finder-arrow{font-size:22px;}
  .guide-desktop-frame .proto-finder-hint{padding:11px 10px;}
  .guide-desktop-frame .proto-gk-topbar{padding:15px 13px;}
  .guide-desktop-frame .proto-gk-topbar-inner{gap:7px;}
  .guide-desktop-frame .proto-gk-flow{padding:24px 13px;}
  .guide-desktop-frame .proto-mac-dots{gap:5px;}
  .guide-desktop-frame .proto-mac-dots span{width:9px;height:9px;}
  .guide-desktop-frame .proto-gk-title{padding-left:19px;padding-right:19px;}
  .guide-desktop-frame .proto-gk-body{padding-left:19px;padding-right:19px;}
  .guide-desktop-frame .proto-connection-auth{margin-left:15px;margin-right:15px;}
  .guide-desktop-frame .proto-connection-auth-row{padding:10px;font-size:11px;}
  .guide-desktop-frame .proto-win-dl{padding:30px 16px;min-height:0;}
  .guide-desktop-frame .proto-win-dlname{font-size:27px;}
  .guide-desktop-frame .proto-win-dlsub{font-size:11px;}
  .guide-desktop-frame .proto-win-dlbtn-brand,.guide-desktop-frame .proto-win-dlbtn-out{font-size:11px;padding:0 13px;height:39px;}
  .guide-desktop-frame .proto-win-dl-btn{font-size:10px;}
  .guide-desktop-frame .proto-term-body{padding:21px 14px;font-size:12px;}
}
@media(prefers-reduced-motion:reduce){
  .guide-phone-frame *, .guide-desktop-frame *{animation:none!important;-webkit-animation:none!important;transition:none!important;}
}
