@font-face{font-family:Studio;src:url('./studio-display.otf') format('opentype');font-display:swap;font-weight:900}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{margin:0;background:#171918;color:#f1f0e9;font-family:Arial,Helvetica,sans-serif;font-size:15px;line-height:1.6}
button,input,select{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
button{cursor:pointer}
a{color:inherit;text-decoration:none}
button{color:inherit}
button:disabled{cursor:wait;opacity:.55}
[hidden]{display:none!important}
:focus-visible{outline:3px solid #d6fa52;outline-offset:5px}
button,a{touch-action:manipulation}
::selection{background:#d6fa52;color:#171918}

.header{height:100px;margin:0 auto;max-width:1512px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #343632;gap:28px}
.brand{font-size:27px;font-weight:800;letter-spacing:-1.4px;display:inline-flex;align-items:center;line-height:1}
.brand-light{font-weight:400;color:#b5b7ae}
.brand-dot{font-size:10px;align-self:flex-start;letter-spacing:0;margin:1px 0 0 3px}
.brand-icon{width:37px;height:37px;background:#d6fa52;color:#171918;border-radius:9px;font-size:33px;text-align:center;position:relative;margin-right:12px;line-height:.85;padding-right:6px}
.brand-icon span{position:absolute;font:17px Arial;right:4px;top:1px}
.header nav{display:flex;gap:34px;font-size:13px;color:#c7c9c0}
.header nav a:hover,.text-link:hover,footer a:hover{color:#d6fa52}

.button{display:inline-flex;justify-content:center;align-items:center;gap:12px;border:0;border-radius:5px;padding:15px 23px;min-height:52px;font-weight:600;font-size:13px;line-height:1.4;transition:background .2s,transform .2s}
.button:hover{transform:translateY(-2px)}
.button.lime{background:#d6fa52;color:#171918}
.button.lime:hover{background:#e3ff80}
.small{min-height:42px;padding:10px 17px;gap:10px}
.outline{background:transparent;border:1px solid #55594d}
.dark{background:#242821;color:#f1f0e9}

.btn-head-icon{width:16px;height:16px;color:#d6fa52;flex-shrink:0}
.btn-action-icon{width:17px;height:17px;flex-shrink:0}
.arrow-char{font-size:18px;line-height:1;margin-left:4px}
.shield-svg{width:13px;height:13px;color:#d6fa52;margin-right:6px;vertical-align:-2px;display:inline-block}

.hero{max-width:1512px;margin:auto;padding:75px 5% 65px;display:grid;grid-template-columns:1.12fr 1fr;gap:55px;align-items:center}
.eyebrow,.mono{font:10px/1.5 'Courier New',monospace;letter-spacing:1.1px}
.eyebrow{color:#b3b6a9}
.tiny-cross{font:21px Arial;color:#d6fa52;vertical-align:middle;margin-right:9px}
h1,h2,h3,p{margin:0}
h1{font-family:Studio,Arial,sans-serif;font-size:clamp(42px,4.45vw,74px);font-weight:900;line-height:1.12;letter-spacing:-2px;margin:31px 0 28px;max-width:760px}
h1 .accent-word{color:#d6fa52;position:relative;display:inline-block}
.accent-word svg{position:absolute;width:100%;height:12px;left:0;bottom:-9px;overflow:visible;fill:none;stroke:#d6fa52;stroke-width:3;stroke-linecap:round}
.intro{font-size:15px;color:#b8bcb1;line-height:1.9;max-width:440px}

/* Pasek ikon i etapów w hero */
.hero-features{display:flex;flex-wrap:wrap;gap:8px;margin:24px 0 16px}
.feature-chip{display:inline-flex;align-items:center;gap:8px;background:#20241c;border:1px solid #3c4433;border-radius:20px;padding:6px 13px;font-size:11px;color:#ced5c3;transition:border-color .2s,transform .2s,background .2s}
.feature-chip strong{color:#f1f0e9;font-weight:600}
.feature-chip.highlight{border-color:#5d6d45;background:#242c1d}
.feature-chip:hover{border-color:#d6fa52;transform:translateY(-2px)}
.chip-icon{display:inline-flex;align-items:center;justify-content:center;color:#d6fa52}
.chip-icon svg{width:15px;height:15px}

/* Pasek kanałów społecznościowych */
.hero-social-strip{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:24px;font-size:11px;color:#a7af9c}
.social-badges{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}
.social-badge{display:inline-flex;align-items:center;gap:6px;background:#191e16;border:1px solid #37402f;border-radius:14px;padding:4px 10px;font-size:10px;color:#e4e9dc;transition:border-color .2s,color .2s}
.social-badge svg{width:13px;height:13px;color:#d6fa52}
.social-badge:hover{border-color:#d6fa52;color:#d6fa52}

.hero-actions{display:flex;align-items:center;gap:28px;margin:28px 0 16px}
.text-link{font-size:13px;display:inline-flex;align-items:center}
.text-link .arrow-char{margin-left:6px}
.micro{font-size:10px;line-height:1.8;color:#9da292}
.status-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:#d6fa52;margin-right:6px;vertical-align:middle}

.viewer-wrap{min-width:0;border:1px solid #45493c;border-radius:9px;background:#20231e;padding:0 14px;transform:rotate(-1deg);box-shadow:12px 15px 0 #11130f}
.viewer-top,.viewer-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 2px;font:9px 'Courier New',monospace;letter-spacing:1px;color:#b6bcaa}
.viewer-top .mono,.viewer-bottom .mono{font-size:9px;letter-spacing:.5px}
.viewer{aspect-ratio:1.32;position:relative;border:1px solid #414736;background:#cbd2b7;overflow:hidden;border-radius:3px;color:#252b1e}
.empty-view{height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:30px 12px;background-image:linear-gradient(#353e1810 1px,transparent 1px),linear-gradient(90deg,#353e1810 1px,transparent 1px);background-size:28px 28px}
.visual-reel{width:68px;height:68px;margin:0 0 16px;color:#394426;display:flex;align-items:center;justify-content:center;transition:transform .4s ease}
.viewer:hover .visual-reel{transform:rotate(25deg)}
.visual-reel svg{width:100%;height:100%}
.empty-caption{font-weight:700;font-size:23px;line-height:1.13;text-align:center;letter-spacing:-.8px}
.pick-pill{border:1px solid #737d61;background:transparent;color:#252b1e;font-size:11px;padding:9px 18px;border-radius:30px;margin-top:18px;display:inline-flex;align-items:center;gap:6px}
.pick-pill svg{width:13px;height:13px}
.pick-pill:hover{background:#d6fa52}
.drop-hint{font:8px 'Courier New',monospace;margin-top:11px;text-align:center}
.frame-mark{position:absolute;width:14px;height:14px;border:1px solid #7e896b}
.tl{left:14px;top:14px;border-right:0;border-bottom:0}
.tr{right:14px;top:14px;border-left:0;border-bottom:0}
.bl{left:14px;bottom:14px;border-right:0;border-top:0}
.br{right:14px;bottom:14px;border-left:0;border-top:0}
.viewer video{width:100%;height:100%;position:absolute;inset:0;object-fit:contain;background:#090b08}
.change-clip{position:absolute;top:12px;right:12px;background:#171918e8;border:1px solid #757f67;border-radius:4px;font-size:11px;padding:7px 12px}
.file-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;letter-spacing:0}
.viewer-bottom .mono{flex-shrink:0;font-size:8px}
.inline-message{font-size:11px;color:#d6fa52}
.inline-message:not(:empty){padding-bottom:12px}
.dragging{outline:3px dashed #d6fa52;outline-offset:4px}

.chapter-bar{border-block:1px solid #414638;display:flex;justify-content:space-between;align-items:center;padding:20px 5%;font:9px 'Courier New',monospace;letter-spacing:1px;color:#aab19b}
.chapter-bar b{color:#d6fa52;font:19px Arial;padding:0 20px}
.chapter-items{font:14px Arial;letter-spacing:0;color:#e4e9d8;display:flex;align-items:center;flex-wrap:wrap}
.ch-item{display:inline-flex;align-items:center;gap:6px}
.ch-icon{width:15px;height:15px;color:#d6fa52;flex-shrink:0}
.ch-social{color:#d6fa52}

.section{max-width:1512px;margin:auto;padding:90px 5%}
.section-heading{display:grid;grid-template-columns:1fr 1.3fr 1fr;gap:35px;align-items:start;margin-bottom:50px}
.section-heading .eyebrow{padding-top:9px}
.section-heading p{font-size:13px;color:#a8af9d;max-width:290px;padding-top:6px;line-height:1.85}
h2{font-size:clamp(30px,3.1vw,45px);line-height:1.16;font-weight:600;letter-spacing:-1.7px}

.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.steps article{border-top:1px solid #555c49;padding-top:20px}
.step-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}
.step-icon-wrap{width:38px;height:38px;border-radius:8px;background:#252d1d;border:1px solid #434f35;display:flex;align-items:center;justify-content:center;color:#d6fa52}
.step-icon-wrap svg{width:20px;height:20px}
.step-number{color:#d6fa52;font:12px 'Courier New',monospace}
.step-number span{font:22px Arial;color:#848e75;margin-left:4px}
h3{font-size:21px;font-weight:500;letter-spacing:-.5px;margin-bottom:15px}
.steps p{font-size:12px;color:#adb5a1;line-height:1.9;max-width:290px;min-height:92px}
.under-link{border:0;border-bottom:1px solid #687456;background:transparent;padding:0 0 9px;font-size:11px;display:inline-flex;align-items:center;justify-content:space-between;gap:35px}
.under-link:hover{color:#d6fa52}
.steps .under-link{margin-top:25px}

.library-banner{background:#242a20;border-top:1px solid #3d4931;border-bottom:1px solid #3d4931;display:grid;grid-template-columns:1fr 1fr;gap:50px;padding-block:65px}
.library-banner h2{margin:22px 0}
.library-banner p{max-width:345px;color:#b7c0aa;font-size:13px;line-height:1.9;margin-bottom:28px}
.library-graphic{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center}
.library-folder{background:#d6fa52;color:#28351d;width:290px;padding:23px;border-radius:0 9px 9px 9px;transform:rotate(6deg);position:relative;box-shadow:12px 12px 0 #131a0f}
.library-folder:before{content:'';position:absolute;left:0;top:-15px;height:15px;width:115px;border-radius:8px 8px 0 0;background:#d6fa52}
.library-folder>span{font:8px 'Courier New',monospace}
.folder-lines{margin:17px 0}
.folder-lines i{display:block;height:1px;background:#26361d45;margin-top:6px}
.library-folder b{display:block;font-size:38px;line-height:1.07;letter-spacing:-1.5px;font-weight:600}
.library-folder b span{font:60px Arial;position:absolute;bottom:15px;right:25px}
.graphic-note{font:8px 'Courier New',monospace;letter-spacing:1px;color:#a9b79b;margin-top:33px}

/* Nowa sekcja: Publikacja bezpośrednia i harmonogram */
.publishing{border-top:1px solid #3d4931}
.publishing-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:48px;align-items:start}
.pub-details{display:flex;flex-direction:column;gap:24px}
.pub-card{border:1px solid #414b35;border-radius:8px;background:#1e231b;padding:26px 28px;transition:border-color .2s}
.pub-card:hover{border-color:#61744b}
.pub-card-head{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.pub-card-icon{width:38px;height:38px;border-radius:8px;background:#2a3421;border:1px solid #4c5d39;display:flex;align-items:center;justify-content:center;color:#d6fa52;flex-shrink:0}
.pub-card-icon svg{width:20px;height:20px}
.pub-card h3{font-size:20px;margin:0;color:#f1f0e9;letter-spacing:-.6px;font-weight:500}
.pub-card p{font-size:13px;color:#b7c0aa;line-height:1.85;margin:0 0 16px}
.platform-targets{display:flex;flex-direction:column;gap:10px}
.target-item{display:flex;align-items:center;gap:14px;background:#171c13;border:1px solid #37412c;border-radius:6px;padding:10px 14px}
.target-logo{width:32px;height:32px;border-radius:6px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.target-logo svg{width:17px;height:17px}
.tiktok-bg{background:#11140f;border:1px solid #333d28;color:#d6fa52}
.yt-bg{background:#1b1615;border:1px solid #4d2b29;color:#ff5555}
.ig-bg{background:#1c151e;border:1px solid #4c2847;color:#ff70a6}
.target-item strong{display:block;font-size:13px;color:#f1f0e9;font-weight:600}
.target-item small{display:block;font-size:11px;color:#9ba78e;line-height:1.5;margin-top:2px}
.schedule-features{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px}
.schedule-features li{font-size:12px;color:#bcc6ae;line-height:1.7;position:relative;padding-left:20px}
.schedule-features li .feat-dot{position:absolute;left:2px;top:8px;width:6px;height:6px;border-radius:50%;background:#d6fa52}
.schedule-features strong{color:#f1f0e9}

.pub-preview-wrap{position:sticky;top:120px}
.pub-mock{border:1px solid #4d5b3d;border-radius:9px;background:#1c2219;box-shadow:10px 14px 0 #10150d;overflow:hidden}
.mock-header{background:#252e1f;border-bottom:1px solid #3d4a30;padding:12px 18px;display:flex;align-items:center;justify-content:space-between;font:9px 'Courier New',monospace;color:#b7c3a8;letter-spacing:1px}
.mock-tag{background:#13180f;border:1px solid #4a5a38;border-radius:12px;padding:3px 8px;color:#d6fa52;font-size:8px}
.mock-body{padding:22px;display:flex;flex-direction:column;gap:18px}
.mock-field-group{display:flex;flex-direction:column;gap:8px}
.mock-label{font:10px 'Courier New',monospace;color:#a4b395;letter-spacing:.8px}
.mock-profiles{display:flex;flex-wrap:wrap;gap:8px}
.profile-chip{display:inline-flex;align-items:center;gap:7px;background:#171d13;border:1px solid #3c492f;border-radius:6px;padding:7px 11px;font-size:11px;color:#dde4d2}
.profile-chip.active{border-color:#657e4b;background:#222c1b}
.profile-chip svg{width:14px;height:14px;color:#d6fa52}
.chip-check{display:inline-flex;margin-left:2px}
.chip-check svg{width:11px;height:11px;color:#d6fa52}
.mock-timing-row{display:grid;grid-template-columns:1fr 1.6fr;gap:8px}
.timing-pill{border:1px solid #39452b;border-radius:6px;background:#161b11;color:#8c987f;font-size:11px;padding:8px 12px;text-align:center;display:flex;align-items:center;justify-content:center;gap:6px}
.timing-pill.selected{border-color:#d6fa52;background:#28351c;color:#f1f0e9;font-weight:600}
.pill-clock{width:13px;height:13px;color:#d6fa52}
.mock-input-box{border:1px solid #38452c;border-radius:6px;background:#141810;padding:10px 12px;font-size:11px;color:#b9c5aa;line-height:1.6}
.integration-notice{border-top:1px solid #37442a;padding-top:14px;margin-top:4px}
.notice-badge{display:inline-flex;align-items:center;gap:7px;color:#d6fa52;font-size:11px;font-weight:600;margin-bottom:7px}
.notice-badge svg{width:14px;height:14px;color:#d6fa52}
.integration-notice p{font-size:10px;color:#92a084;line-height:1.7;margin:0}

.downloads{background:#eeefe7;color:#22271e;max-width:none}
.downloads>.section-heading,.download-grid,.download-note{max-width:1360px;margin-inline:auto}
.downloads .eyebrow{color:#59664b}
.downloads .section-heading p{color:#5e6855}
.download-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.download-card{border:1px solid #c7ceba;border-radius:7px;padding:32px;position:relative}
.download-card .mono{color:#5f6c50;font-size:9px}
.download-card h3{font-size:33px;font-weight:500;margin:10px 0 15px;letter-spacing:-1.3px}
.download-card p{font-size:12px;color:#5f6955;line-height:1.9}
.download-card .button{margin-top:25px;width:100%;justify-content:space-between}
.download-card .download-status{font:10px/1.7 'Courier New',monospace;margin-top:10px;min-height:18px}
.os-icon{position:absolute;top:30px;right:32px;color:#526541}
.os-icon svg{width:42px;height:42px;display:block}
.download-note{font-size:10px;color:#616e54;line-height:1.9;margin-top:23px}

.faq{display:grid;grid-template-columns:1fr 1.3fr;gap:90px}
.faq h2{margin-top:22px}
.faq-items details{border-top:1px solid #4a5540}
.faq-items details:last-child{border-bottom:1px solid #4a5540}
.faq summary{list-style:none;cursor:pointer;padding:22px 0;display:flex;justify-content:space-between;gap:20px;font-size:13px}
.faq summary::-webkit-details-marker{display:none}
.faq summary span{color:#d6fa52;font-size:18px;line-height:1;transition:transform .2s}
.faq details[open] summary span{transform:rotate(45deg)}
.faq details p{font-size:12px;color:#b1bba4;line-height:1.9;padding:0 25px 22px 0}

footer{padding:30px 5%;border-top:1px solid #434d39;display:flex;align-items:center;justify-content:space-between;gap:20px}
footer>.brand{font-size:23px}
footer>span,footer>a:last-child{font-size:10px;color:#a7b39a}
.skip{position:fixed;z-index:100;top:-80px;background:#d6fa52;color:#171918;padding:15px}
.skip:focus{top:10px}

dialog{border:1px solid #586448;border-radius:12px;background:#20251c;color:#f1f0e9;padding:30px;width:min(460px,calc(100% - 28px));max-height:90dvh;box-shadow:0 24px 100px #0008}
dialog::backdrop{background:#080c09c9;backdrop-filter:blur(7px)}
dialog h2{font-size:29px;letter-spacing:-1px;margin-bottom:15px}
dialog>p{font-size:12px;color:#aebba0;margin-bottom:20px}
.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:25px}
.dialog-head h2{margin:0}
.icon-button{display:inline-flex;justify-content:center;align-items:center;background:transparent;border:1px solid #4a573e;border-radius:5px;min-width:38px;height:38px;font-size:25px;color:#ced9c1}
.icon-button:hover{background:#35432a}
label{display:block;font-size:11px;color:#bac6ad;margin-bottom:8px}
input,select{width:100%;border:1px solid #556449;border-radius:5px;background:#171d13;color:#f1f0e9;padding:12px;font-size:14px;margin:5px 0 15px;min-width:0}
input::placeholder{color:#87977b}
form>.button{width:100%;justify-content:space-between}
.form-error{color:#ffb2a1;font-size:12px;margin:8px 0 15px;line-height:1.7}
.form-error:empty{display:none}
.auth-switch{background:transparent;border:0;border-bottom:1px solid #6f7d62;font-size:11px;padding:0 0 4px;margin:25px 0 20px}

.wide-dialog{width:min(860px,calc(100% - 28px))}
.library-title-row{display:flex;align-items:center;justify-content:space-between;gap:15px}
.lime-text{color:#d6fa52}
.library-toolbar{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #4a573e;margin-top:18px}
.tabs{display:flex;gap:20px}
.tabs button{background:transparent;border:0;border-bottom:2px solid transparent;padding:14px 0;font-size:13px;color:#a6b699}
.tabs button[aria-selected=true]{border-color:#d6fa52;color:#d6fa52}
.tabs span{font:10px 'Courier New',monospace;margin-left:10px}
.refresh{font-size:21px}
.library-filters{display:flex;gap:18px;margin-top:22px}
.search-label{flex:1}
.library-filters label:last-child{width:150px}
.library-filters input,.library-filters select{font-size:12px;margin-bottom:0}
.library-results{margin:12px 0 25px}
.library-empty{padding:35px 15px;text-align:center;border:1px dashed #4f5f41;border-radius:5px}
.library-empty strong{display:block;font-size:20px;font-weight:500;margin-bottom:12px}
.library-empty p{font-size:12px;color:#aebba0}
.material-row{display:flex;align-items:center;gap:18px;padding:17px 0;border-bottom:1px solid #435037}
.material-icon{display:flex;align-items:center;justify-content:center;width:46px;height:55px;flex-shrink:0;background:#34402a;color:#d6fa52;border-radius:4px;font-size:23px}
.material-copy{min-width:0;flex:1}
.material-copy strong{display:block;overflow-wrap:anywhere;font-size:14px;font-weight:500}
.material-copy p{font-size:10px;color:#a8b79a;margin-top:4px}
.material-actions{display:flex;gap:9px}
.material-actions button,.material-actions a{font-size:11px;border:1px solid #5d714c;background:transparent;border-radius:4px;padding:8px 11px}
.material-actions button:hover,.material-actions a:hover{background:#35432a}
#library-message{font-size:12px;color:#d6fa52;margin:12px 0}
#cloud-player{width:100%;max-height:57dvh;background:#0c1109;margin-bottom:18px;border-radius:5px}

@media(min-width:1600px){
  .hero{padding-block:95px}
  .viewer{aspect-ratio:1.45}
  .chapter-bar{padding-inline:max(5%,calc((100% - 1360px)/2))}
}

@media(max-width:1100px){
  .header nav{gap:20px}
  .hero{gap:30px}
  .hero-actions{gap:20px}
  .hero .micro{font-size:9px}
  h1{font-size:44px}
  .viewer-top .mono{display:none}
  .section-heading{grid-template-columns:1fr 1.4fr}
  .section-heading>p{grid-column:2;margin-top:-18px}
  .publishing-grid{grid-template-columns:1fr;gap:36px}
  .pub-preview-wrap{position:static}
  .faq{gap:35px}
  .chapter-bar>.mono{display:none}
  .steps{gap:25px}
  .viewer-bottom .mono{display:none}
}

@media(max-width:760px){
  html{scroll-padding-top:20px}
  .header{height:78px;padding-inline:6%;gap:15px}
  .brand{font-size:24px}
  .brand-icon{width:30px;height:30px;font-size:28px;margin-right:8px}
  .header nav{display:none}
  .header .small{font-size:11px;gap:8px;padding:9px 12px}
  .hero{grid-template-columns:1fr;padding:45px 6% 50px;gap:40px}
  .eyebrow{font-size:9px;letter-spacing:.8px}
  h1{font-size:clamp(35px,7.4vw,56px);letter-spacing:-1.6px;margin:26px 0}
  .intro{font-size:13px;max-width:360px}
  .hero-features{gap:6px;margin:18px 0 12px}
  .feature-chip{padding:5px 10px;font-size:10px;gap:6px}
  .hero-social-strip{margin-bottom:20px;font-size:10px}
  .social-badge{padding:3px 8px;font-size:9px}
  .hero-actions{margin-top:25px;gap:18px;flex-wrap:wrap}
  .button{font-size:12px;gap:10px;padding:14px 18px;min-height:48px}
  .hero .micro{font-size:9px}
  .text-link{font-size:12px}
  .viewer-wrap{margin:0 4px;transform:rotate(-1deg)}
  .viewer{aspect-ratio:1.35}
  .empty-caption{font-size:24px}
  .visual-reel{width:56px;height:56px}
  .viewer-top .mono{display:inline}
  .chapter-bar{padding:17px 6%;gap:14px;flex-wrap:wrap}
  .chapter-bar>span:first-child{font-size:8px}
  .chapter-items{font-size:11px}
  .chapter-bar b{font-size:14px;padding:0 8px}
  .section{padding:55px 6%}
  .section-heading{display:block;margin-bottom:32px}
  .section-heading h2{margin:18px 0}
  h2{font-size:32px;letter-spacing:-1.2px}
  .section-heading>p{font-size:12px;max-width:340px;margin:0}
  .steps{grid-template-columns:1fr;gap:30px}
  .step-head{margin-bottom:16px}
  .steps article{position:relative}
  .steps p{max-width:100%;min-height:0}
  .steps .under-link{margin-top:15px}
  h3{font-size:21px}
  .library-banner{grid-template-columns:1fr;gap:50px;padding-bottom:50px}
  .library-graphic{padding:15px 0 0}
  .library-folder{width:245px}
  .library-folder b{font-size:31px}
  .graphic-note{font-size:7px}
  .publishing-grid{grid-template-columns:1fr;gap:28px}
  .pub-card{padding:20px}
  .pub-card h3{font-size:18px}
  .mock-timing-row{grid-template-columns:1fr}
  .download-grid{grid-template-columns:1fr;gap:15px}
  .download-card{padding:25px}
  .download-card .os-icon{right:20px;top:20px}
  .os-icon svg{width:32px;height:32px}
  .download-note{font-size:10px}
  .faq{grid-template-columns:1fr;gap:30px}
  .faq h2{margin-top:15px}
  .faq summary{font-size:12px;padding:21px 0}
  footer{flex-wrap:wrap;padding:25px 6%}
  footer>span{display:none}
  dialog{padding:23px}
  .library-title-row{align-items:start}
  dialog h2{font-size:26px}
  .library-title-row .under-link{font-size:10px;white-space:nowrap;margin-top:6px}
  .material-row{gap:10px;flex-wrap:wrap}
  .material-actions{margin-left:56px}
  .material-copy strong{font-size:13px}
  .library-filters{gap:10px}
  .library-filters label:last-child{width:115px}
  .library-filters input,.library-filters select{font-size:11px;padding:10px}
  #video-dialog .dialog-head h2{font-size:20px}
  .drop-hint{font-size:7px}
  .viewer-bottom{font-size:9px}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{transition:none!important}
}