:root{color-scheme:light;--ink:#1b2943;--muted:#687992;--line:#e1e9f4;--blue:#217ee8;--blu2:#eaf4ff;--bg:#f6f9fe;--shadow:0 18px 50px rgba(33,70,124,.07);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-size:14px}a{color:inherit}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}.dropzone:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #85b9ff;outline-offset:3px}[hidden]{display:none!important}.wrap{max-width:1380px;margin:auto;padding-left:26px;padding-right:26px}.skip{position:absolute;left:-10000px;top:8px;background:#fff;padding:10px;z-index:50}.skip:focus{left:8px}.topbar{background:#fff;border-bottom:1px solid #e8edf6}.nav{height:68px;display:flex;align-items:center;gap:34px}.logo{text-decoration:none;font-weight:800;letter-spacing:-.8px;font-size:20px;display:inline-flex;align-items:center;gap:5px;white-space:nowrap}.logo span:not(.logo-p){color:var(--blue)}.logo-p{border-radius:11px;width:32px;height:32px;background:#d9edff;color:#2585ec;display:inline-grid;place-items:center;font-size:21px;margin-right:4px}.nav nav{display:flex;align-items:center;gap:11px;color:#71809a;font-size:12px}.nav nav a{text-decoration:none}.nav nav a:hover{color:var(--blue)}.nav nav strong{color:#33455e;font-weight:600}.private{margin-left:auto;font-size:12px;color:#39785e;background:#ecf9f3;border-radius:40px;padding:8px 12px}.hero{padding-top:50px;padding-bottom:40px;text-align:center}.eyebrow,.kicker{font-size:10px;letter-spacing:2px;font-weight:800;color:#4183c9}.eyebrow span{margin:0 8px}.hero h1{letter-spacing:-2.3px;font-size:clamp(38px,5vw,62px);line-height:1.08;margin:16px 0 13px;font-weight:830}.hero h1 span{color:#2b8ae6}.hero>p{font-size:16px;color:#667890;max-width:690px;margin:0 auto 23px;line-height:1.75}.chips{display:flex;align-items:center;justify-content:center;gap:9px;flex-wrap:wrap}.chips span{background:#fff;border:1px solid #e5edf7;color:#4b6e98;padding:9px 13px;border-radius:25px;font-size:11px;font-weight:650}.studio{padding-bottom:48px}.studio-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:17px;gap:16px}.studio-head .kicker{margin:0 0 8px}.studio-head h2{font-size:26px;letter-spacing:-.7px;margin:0}.studio-head p:not(.kicker){color:var(--muted);margin:8px 0 0}.export-row,.rowbuttons,.studio-actions{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.btn{border:1px solid transparent;background:#fff;border-radius:11px;padding:11px 15px;font-size:12px;font-weight:750;transition:background .15s,transform .1s;display:inline-flex;align-items:center;justify-content:center;text-align:center;gap:6px;min-height:39px;text-decoration:none}.btn:not(:disabled):active{transform:translateY(1px)}.btn.primary{background:#247fe0;color:#fff;box-shadow:0 4px 12px rgba(32,116,220,.19)}.btn.primary:hover{background:#1168c9}.btn.secondary{background:#e9f3ff;border-color:#cfe4ff;color:#246bb8}.btn.secondary:hover{background:#dcecff}.btn.ghost{background:#fff;border-color:#dde6f1;color:#546781}.btn.ghost:hover{background:#f6faff}.btn.danger{background:#fff2f1;border-color:#ffd7d3;color:#b34736}.btn.full{width:100%}.btn.small{font-size:11px;padding:8px 11px;min-height:32px}.editor-layout{display:grid;grid-template-columns:minmax(285px,334px) minmax(0,1fr);align-items:start;gap:18px}.controls{display:grid;gap:15px}.export-panel,.panel,.preview-panel{background:#fff;border:1px solid #e5ebf5;border-radius:18px;box-shadow:var(--shadow)}.panel{padding:20px}.panel-title{display:flex;gap:11px;align-items:center;margin-bottom:17px}.step{width:31px;height:31px;flex:0 0 31px;display:grid;place-items:center;background:#e6f2ff;color:#327dcc;border-radius:10px;font-weight:800;font-size:12px}.panel-title h3{font-size:14px;margin:0 0 3px}.panel-title p{margin:0;color:#8895a7;font-size:11px}.dropzone{border:1.5px dashed #c6d8ef;border-radius:13px;background:#f9fcff;text-align:center;padding:17px 10px;display:flex;flex-direction:column;align-items:center;gap:7px;outline:0}.dropzone.drag{border-color:#2484ed;background:#e7f3ff}.dropzone strong{font-size:12px}.dropzone p{margin:0;color:#8995a6;font-size:10px}.dropicon{color:#2b85d9;background:#e7f3ff;font-size:24px;width:40px;height:40px;line-height:37px;border-radius:13px}.file-note{font-size:11px;color:#61758e;margin:12px 0;white-space:normal;overflow-wrap:anywhere}.hint{color:#8794a6;font-size:11px;line-height:1.55;margin:10px 0 0}.panel>label{display:block;font-size:11px;font-weight:720;color:#53657e;margin-top:16px;margin-bottom:7px}.export-grid select,.panel input[type=number],.panel select,.two input{width:100%;background:#fbfdff;border:1px solid #e0e8f2;color:#283b55;padding:10px 11px;border-radius:9px;min-width:0}.panel label output{float:right;color:#3f84cc}.panel input[type=range]{width:100%;accent-color:#2d84e8;margin:2px 0 7px}.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}.two label{font-size:11px;color:#53657e}.two input{margin-top:7px}.right-column{display:grid;gap:18px;min-width:0}.preview-panel{padding:18px}.preview-top{display:flex;justify-content:space-between;gap:12px;align-items:center;margin:1px 3px 17px}.preview-top h3{font-size:15px;margin:0 0 4px}.preview-top p{margin:0;font-size:11px;color:#8998ac}.live{color:#237fb9;background:#eaf5ff;border-radius:20px;padding:4px 8px;font-size:9px;letter-spacing:.7px;margin-left:6px}.muted{color:#90a0b3;font-size:11px}.canvas-wrap{border-radius:14px;overflow:hidden;background:#0f1b2e;min-height:270px;max-height:560px;position:relative;display:flex;justify-content:center;align-items:center}.canvas-wrap canvas{height:auto;max-height:560px;max-width:100%;width:auto;display:block;touch-action:manipulation;cursor:crosshair}.empty-preview{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:30px;background:radial-gradient(circle at 50% 30%,#223957,#0d1b2d 70%);color:#fff}.empty-symbol{display:grid;place-items:center;background:#31547d;width:68px;height:68px;font-size:40px;border-radius:20px;color:#a8d9ff}.empty-preview h3{font-size:20px;margin:16px 0 7px}.empty-preview p{max-width:340px;line-height:1.6;color:#acc1d7;font-size:12px;margin:0 0 20px}.player{display:flex;align-items:center;gap:9px;margin:16px 0}.play{width:35px;height:35px;flex:0 0 35px;border-radius:11px;border:0;background:#e7f3ff;color:#247fdf;font-size:15px}.player span{color:#62768d;font-size:11px;font-variant-numeric:tabular-nums}.player input{flex:1;min-width:30px;accent-color:#287ee0}.wave-area{background:#f6f9fe;padding:12px 15px;border-radius:12px;border:1px solid #edf1f8}.wave-head{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:11px;color:#53677f}.wave-head span{color:#95a1b2;font-size:10px}.wave-area canvas{width:100%;height:70px;display:block;margin-top:9px}.editor-hint{display:flex;gap:8px;align-items:center;color:#6686a7;background:#eff7ff;border-radius:10px;padding:11px 13px;font-size:11px;margin-top:14px}.editor-hint span{font-size:18px;color:#2a87e5}.export-panel{padding:23px}.export-header{display:flex;gap:12px;align-items:center}.export-header h3{margin:0 0 5px;font-size:16px}.export-header p{margin:0;font-size:11px;color:#8492a5}.export-icon{border-radius:14px;background:#eaf4ff;width:43px;height:43px;flex:0 0 43px;display:grid;place-items:center;color:#2b82d7;font-size:23px}.export-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:19px 0}.export-grid label{font-size:11px;color:#61738a;font-weight:680}.export-grid select{display:block;margin-top:8px;font-size:11px;padding:10px 6px}.export-grid .check{display:flex;align-items:center;gap:8px;font-weight:550;line-height:1.5}.export-grid input{accent-color:#227ddf}.export-row{gap:10px}.export-row .primary{min-width:190px}.mini-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.mini-grid article{padding:18px;border:1px solid #e6edf6;background:#fff;border-radius:15px}.mini-grid article>div{color:#2e87d7;background:#eaf4ff;width:33px;height:33px;border-radius:10px;display:grid;place-items:center;font-size:20px;margin-bottom:10px}.mini-grid h3{font-size:12px;margin:0 0 6px}.mini-grid p{font-size:11px;color:#7a899c;line-height:1.6;margin:0}.status{background:#eaf4ff;color:#37678d;padding:14px 17px;border:1px solid #d8eafc;border-radius:11px;margin-top:18px;font-size:12px;line-height:1.5}.status.error{background:#fff1ef;border-color:#ffd4ca;color:#a34136}.seo{margin-top:0;margin-bottom:60px}.seo h2{letter-spacing:-1px;font-size:29px}.faq{display:grid;grid-template-columns:1fr 1fr;gap:12px}.faq article{background:#fff;border:1px solid #e5edf7;padding:20px;border-radius:15px}.faq h3{font-size:14px;margin:0 0 8px}.faq p{color:#718197;font-size:12px;line-height:1.7;margin:0}.foot{border-top:1px solid #e4ebf4;display:flex;align-items:center;gap:20px;padding-top:27px;padding-bottom:27px;color:#8997ab;font-size:12px}.foot>a:last-child{margin-left:auto;text-decoration:none;color:#367cc0}.overlay{position:fixed;inset:0;background:rgba(15,31,53,.55);z-index:100;display:flex;align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(7px)}.progress-card{background:#fff;border-radius:23px;max-width:390px;width:100%;padding:37px;text-align:center;box-shadow:0 30px 80px #07172d66}.spinner{width:42px;height:42px;border:4px solid #e2effc;border-top-color:#287ee0;border-radius:50%;margin:auto;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.progress-card h2{font-size:25px;margin:22px 0 10px}.progress-card p{color:#75869b;font-size:12px;line-height:1.6}.progress-card progress{width:100%;height:8px;margin:14px 0 17px;accent-color:#2f85e8}@media(max-width:1060px){.export-grid{grid-template-columns:1fr 1fr}.mini-grid{grid-template-columns:1fr}.mini-grid article{padding:14px}.editor-layout{grid-template-columns:minmax(255px,290px) minmax(0,1fr)}}@media(max-width:760px){.wrap{padding-left:16px;padding-right:16px}.nav{height:60px}.nav nav{display:none}.private{font-size:10px}.hero{padding-top:33px;padding-bottom:26px}.hero h1{letter-spacing:-1.4px}.hero>p{font-size:13px}.studio-head{align-items:flex-start}.editor-layout{display:flex;flex-direction:column}.controls{width:100%;display:grid;grid-template-columns:1fr 1fr}.right-column{width:100%;order:-1}.export-panel,.preview-panel{padding:13px}.canvas-wrap{max-height:480px}.canvas-wrap canvas{max-height:480px}.studio-head h2{font-size:23px}}@media(max-width:520px){.nav .private{display:none}.hero h1{font-size:37px}.studio-head{flex-direction:column}.controls{grid-template-columns:1fr}.export-grid{grid-template-columns:1fr 1fr}.faq{grid-template-columns:1fr}.preview-top{align-items:flex-start}.preview-top .muted{display:none}.export-row .btn{flex:1;min-width:0}.foot{flex-wrap:wrap}.foot>a:last-child{margin-left:0}.canvas-wrap{min-height:250px}.canvas-wrap canvas{max-height:420px}.wave-head span{font-size:9px}.panel{padding:16px}}@media(prefers-reduced-motion:reduce){*,:after,:before{transition:none!important;animation-duration:NaNs!important;scroll-behavior:auto!important}}.canvas-wrap,.export-panel,.player,.preview-panel,.preview-top,.right-column,.wave-area{min-width:0;max-width:100%}.player{flex-wrap:wrap}.player input[type=range]{flex:1 1 75px;min-width:45px}.preview-top>div:first-child{min-width:0}.preview-top p{overflow-wrap:anywhere}@media(max-width:410px){.player #still{margin-left:auto}.export-grid{gap:8px}.nav{min-width:0}}.trim-panel{margin-top:19px;padding:15px;border:1px solid #d9e7f7;border-radius:13px;background:#f7fbff}.trim-title{display:flex;justify-content:space-between;align-items:center;gap:10px}.trim-title strong{font-size:12px}.trim-inputs{margin-top:10px;max-width:390px}.trim-inputs label{font-size:11px;color:#556b85;font-weight:650}.trim-inputs input{background:#fff}.trim-panel .hint{margin-top:7px}.trim-panel .hint.invalid{color:#ab3d35}.studio-actions{row-gap:8px}@media(max-width:520px){.studio-actions .btn{flex:0 0 auto}}.hero{padding-top:18px;padding-bottom:16px}.hero h1{font-size:clamp(26px,3vw,38px);letter-spacing:-1px;margin:8px 0}.hero>p{font-size:13px;line-height:1.5;margin-bottom:10px}.chips span{padding:6px 9px}.studio{padding-bottom:22px}.v3-panel input[type=number],.v3-panel select,.v3-panel textarea{width:100%;border:1px solid var(--line);border-radius:9px;padding:9px;background:#fcfdff;color:var(--ink)}.v3-panel textarea{resize:vertical;min-height:66px;line-height:1.45}.v3-panel input[type=color]{width:100%;height:38px;border:1px solid var(--line);border-radius:8px;padding:2px;background:#fff}.v3-panel input[type=range]{width:100%;accent-color:#247fe0}.v3-panel label{display:block;margin-top:12px;margin-bottom:6px;font-size:11px;font-weight:700;color:#354960}.v3-panel .two label{margin-top:8px}.v3-panel .rowbuttons{margin-top:9px}.v3-panel .rowbuttons .btn{flex:1 1 80px;padding:9px 8px}.v3-panel .hint{margin-top:9px}.keyframe-list{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px;max-height:124px;overflow:auto}.keyframe-item{font-size:10px;color:#6b421f;background:#fff5e9;border:1px solid #f3d8b7;border-radius:8px;padding:7px;cursor:pointer}.keyframe-item:hover{background:#ffe4c3}.keyframe-item:focus-visible,.v3-panel input:focus-visible,.v3-panel textarea:focus-visible{outline:3px solid #85b9ff;outline-offset:2px}@media(max-width:700px){.hero{padding-top:10px;padding-bottom:12px}.hero h1{font-size:26px}.studio-head{align-items:flex-start}.studio-actions{justify-content:flex-start}}@media(prefers-reduced-motion:reduce){.v3-panel *{scroll-behavior:auto!important;transition:none!important}}@media(max-width:520px){.topbar .nav{gap:8px;min-width:0}.topbar .logo{font-size:17px;flex:0 0 auto}.topbar .logo img{width:26px;height:26px}.topbar .pk-site-search{min-width:0;flex:1 1 75px;max-width:160px}.topbar .pk-search-field{display:flex;align-items:center;gap:4px;min-width:0;width:100%}.topbar .pk-search-field svg{flex:0 0 16px;width:16px;height:16px}.topbar #pk-tool-search{width:100%;min-width:0;font-size:11px}.topbar .pk-studio-navigation{flex:0 0 auto;margin-left:auto}}