:root{
  --bg:#151118; --panel:#1e1824; --panel2:#292130;
  --line:#3a3040; --text:#ece7dd; --muted:#9a8f86;
  --amber:#f4a826; --amber-d:#241a08; --teal:#5bb0a0;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0;background:var(--bg);color:var(--text);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--amber);text-decoration:none}
a:hover{text-decoration:underline}
svg.ic{width:20px;height:20px;stroke:var(--amber);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}

/* ---------- header ---------- */
.top{position:sticky;top:0;z-index:50;background:rgba(21,17,24,.92);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);display:flex;align-items:center;gap:16px;padding:12px 22px;flex-wrap:wrap}
.top .logo{font-weight:700;font-size:17px;color:var(--text);display:flex;align-items:center;gap:8px}
.top .logo .disc{width:20px;height:20px;border-radius:50%;background:conic-gradient(#111,#333,#111);
  border:2px solid var(--amber);animation:spin 6s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.top nav{display:flex;gap:4px;flex-wrap:wrap;align-items:center}
.top nav>a{color:var(--muted);font-size:13.5px;padding:7px 11px;border-radius:8px}
.top nav>a:hover{color:var(--text);text-decoration:none;background:var(--panel2)}
.top nav>a.on{color:var(--amber);background:rgba(244,168,38,.1)}
.drop{position:relative}
.drop summary{list-style:none;cursor:pointer;color:var(--muted);font-size:13.5px;padding:7px 11px;border-radius:8px;display:flex;align-items:center;gap:5px;user-select:none}
.drop summary::-webkit-details-marker{display:none}
.drop summary::marker{content:""}
.drop summary:after{content:"▾";font-size:10px;opacity:.7}
.drop[open] summary,.drop summary:hover{color:var(--text);background:var(--panel2)}
.drop .menu{position:absolute;top:112%;left:0;background:var(--panel);border:1px solid var(--line);
  border-radius:12px;padding:6px;display:flex;flex-direction:column;min-width:230px;z-index:60;
  box-shadow:0 14px 34px rgba(0,0,0,.45)}
.drop .menu a{padding:9px 12px;border-radius:8px;color:var(--muted);font-size:13.5px}
.drop .menu a:hover{background:var(--panel2);color:var(--text);text-decoration:none}
.top .auth{margin-left:auto;display:flex;gap:8px}
.btn{border:0;border-radius:9px;padding:9px 16px;font-size:13.5px;font-weight:600;cursor:pointer;display:inline-block;text-align:center}
.btn.gold{background:var(--amber);color:var(--amber-d)}
.btn.gold:hover{text-decoration:none;filter:brightness(1.05)}
.btn.ghost{background:transparent;color:var(--muted);border:1px solid var(--line)}
.btn.ghost:hover{text-decoration:none;color:var(--text)}
.btn.big{padding:14px 30px;font-size:15px;border-radius:26px}
.btn:disabled{opacity:.55;cursor:default}

/* ---------- hero + marquee slider ---------- */
.heroWrap{position:relative;overflow:hidden;padding:76px 20px 46px;text-align:center;min-height:420px;
  display:flex;align-items:center;justify-content:center;border-bottom:1px solid var(--line)}
.marquee{position:absolute;inset:0;display:flex;align-items:center;overflow:hidden;pointer-events:none;
  -webkit-mask-image:linear-gradient(to right,transparent,#000 12%,#000 88%,transparent);
  mask-image:linear-gradient(to right,transparent,#000 12%,#000 88%,transparent)}
.mtrack{display:flex;gap:22px;animation:mq 46s linear infinite;will-change:transform}
@keyframes mq{to{transform:translateX(calc(-50% - 11px))}}
.mtrack img{height:340px;width:255px;object-fit:cover;background:#241d2b;border-radius:16px;
  filter:brightness(.4) saturate(.9);box-shadow:0 14px 40px rgba(0,0,0,.55);flex-shrink:0}
.heroInner{position:relative;z-index:2;max-width:760px}
.heroInner .kicker{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--amber);font-weight:700}
.heroInner h1{font-size:clamp(28px,5vw,50px);margin:12px 0 14px;line-height:1.08;text-shadow:0 2px 26px rgba(0,0,0,.7)}
.heroInner p{color:#cfc8bd;font-size:15.5px;line-height:1.65;margin:0 auto 24px;max-width:640px;text-shadow:0 1px 14px rgba(0,0,0,.8)}
.plats{display:flex;flex-wrap:wrap;gap:22px 34px;justify-content:center;align-items:center;margin-top:30px;opacity:.45}
.plats svg{height:22px;width:22px;fill:var(--text)}
.plats .lbl{flex-basis:100%;text-align:center;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}

/* plain hero (subpages) */
.hero{text-align:center;padding:44px 20px 8px;max-width:820px;margin:0 auto}
.hero .kicker{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--amber);font-weight:700}
.hero h1{font-size:clamp(26px,4.5vw,42px);margin:10px 0 12px;line-height:1.12}
.hero p{color:var(--muted);font-size:15px;line-height:1.6;margin:0 auto;max-width:640px}

/* ---------- style switch ---------- */
.styleswitch{display:flex;gap:12px;justify-content:center;margin:28px auto 6px;max-width:640px;padding:0 20px}
.styleswitch a,.styleswitch button{flex:1;display:flex;flex-direction:column;align-items:center;gap:8px;
  padding:16px 10px;border-radius:14px;border:1.5px solid var(--line);background:var(--panel);
  color:var(--text);cursor:pointer;font-size:13.5px;font-weight:600;text-decoration:none}
.styleswitch .on{border-color:var(--amber);background:rgba(244,168,38,.06)}
.styleswitch .mini{width:56px;height:56px;border-radius:50%}
.mini.vinyl{background:radial-gradient(circle at 50% 50%, #f4a826 0 26%, #111 27% 100%);
  box-shadow:inset 0 0 0 2px #000, inset 0 0 18px rgba(255,255,255,.12)}
.mini.cd{background:conic-gradient(#fdd,#dfd,#ddf,#ffd,#fdd);position:relative}
.mini.cd:after{content:"";position:absolute;inset:38%;border-radius:50%;background:var(--panel);border:2px solid #ccc}

/* ---------- editor ---------- */
.editor{display:grid;grid-template-columns:1fr 350px;gap:0;max-width:1200px;margin:22px auto 34px;
  border:1px solid var(--line);border-radius:16px;overflow:hidden}
@media(max-width:900px){.editor{grid-template-columns:1fr;margin:16px 12px}}
.stage{display:flex;flex-direction:column;align-items:center;gap:18px;padding:28px 26px;
  background:radial-gradient(120% 120% at 50% 25%,#201927 0%,#120f16 72%)}
.frame{border-radius:14px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.5);background:#000}
canvas.preview{display:block;max-width:min(84vw,680px);max-height:58vh;width:auto;height:auto}
.exportbar{width:100%;max-width:440px;display:flex;flex-direction:column;gap:10px;align-items:stretch}
.res{display:flex;background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:3px;gap:3px}
.res button{flex:1;border:0;background:transparent;color:var(--muted);padding:10px;border-radius:7px;font-size:13px;font-weight:600;cursor:pointer}
.res button.on{background:var(--teal);color:#0c211c}
.cta{border:0;border-radius:10px;padding:13px;font-size:15px;font-weight:600;cursor:pointer;background:var(--amber);color:var(--amber-d);width:100%}
.progress{display:none;flex-direction:column;gap:6px}
.pbarWrap{height:10px;border-radius:6px;background:var(--panel2);border:1px solid var(--line);overflow:hidden}
.pbar{height:100%;width:0%;background:linear-gradient(90deg,var(--amber),#f2c96b);transition:width .12s}
.ptext{font-size:12.5px;color:var(--muted);text-align:center;font-variant-numeric:tabular-nums}
.resultwrap{display:none;flex-direction:column;gap:8px}
.resultwrap video,.resultwrap img{width:100%;border-radius:10px;background:#000}
.dlrow{display:flex;gap:8px}
.hint{font-size:11.5px;color:var(--muted);text-align:center;line-height:1.5;margin:0}

/* ---------- settings panel ---------- */
.panel{background:var(--panel);border-left:1px solid var(--line);padding:16px;display:flex;flex-direction:column;gap:12px;overflow:auto;max-height:88vh}
@media(max-width:900px){.panel{border-left:none;border-top:1px solid var(--line);max-height:none}}
.sec{border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.015);padding:14px;display:flex;flex-direction:column;gap:12px}
.sec .head{display:flex;align-items:center;gap:9px}
.sec .num{font-size:10px;letter-spacing:.14em;color:var(--muted);font-weight:700}
.sec h4{margin:0;font-size:14px}
.group{display:flex;flex-direction:column;gap:7px}
.group > .label{font-size:11px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted)}
.seg{display:flex;background:var(--panel2);border:1px solid var(--line);border-radius:9px;padding:3px;gap:3px;flex-wrap:wrap}
.seg button{flex:1;min-width:48px;border:0;background:transparent;color:var(--muted);padding:8px 5px;border-radius:6px;font-size:12.5px;cursor:pointer}
.seg button.on{background:var(--amber);color:var(--amber-d);font-weight:600}
.seg.teal button.on{background:var(--teal);color:#0c211c}
.fmt{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.fmt button{border:1px solid var(--line);background:var(--panel2);color:var(--muted);border-radius:8px;padding:8px 2px;font-size:12px;font-weight:600;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:2px}
.fmt button .s{font-size:9px;font-weight:400;opacity:.7}
.fmt button.on{border-color:var(--amber);color:var(--amber);background:rgba(244,168,38,.1)}
.fmt button:disabled{opacity:.35;cursor:default}
.file{border:1px dashed var(--line);border-radius:9px;padding:12px;text-align:center;cursor:pointer;font-size:13px;color:var(--muted)}
.file:hover{border-color:var(--amber);color:var(--text)}
.file input{display:none}
.row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.row .val{font-variant-numeric:tabular-nums;color:var(--amber);font-size:13px;min-width:52px;text-align:right}
input[type=range]{width:100%;accent-color:var(--amber)}
input[type=color]{width:38px;height:34px;border:1px solid var(--line);border-radius:7px;background:none;padding:0;cursor:pointer}
input.hex{flex:1;background:var(--panel2);border:1px solid var(--line);border-radius:8px;color:var(--text);
  padding:8px 10px;font-family:ui-monospace,monospace;font-size:13px;min-width:0}
.toggle{display:flex;align-items:center;gap:10px;cursor:pointer;user-select:none;font-size:13px}
.toggle input{accent-color:var(--amber);width:16px;height:16px}
.swatches{display:flex;gap:7px;flex-wrap:wrap}
.sw{width:26px;height:26px;border-radius:50%;border:2px solid transparent;cursor:pointer;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.sw.on{border-color:var(--text)}
.caption{font-size:11px;color:var(--muted);line-height:1.5}

/* ---------- content ---------- */
.content{max-width:920px;margin:0 auto;padding:10px 20px 30px}
.content h2{font-size:22px;margin:38px 0 16px;display:flex;align-items:center;gap:10px}
.content h2 svg.ic{width:22px;height:22px}
.content p{color:var(--muted);line-height:1.7;font-size:14.5px}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;margin-top:16px}
.step{border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:20px;display:flex;flex-direction:column;gap:8px}
.step svg.ic{width:24px;height:24px;margin-bottom:2px}
.step h3{margin:0;font-size:14.5px}
.step p{font-size:13px;margin:0;line-height:1.6}
.faq details{border:1px solid var(--line);border-radius:12px;background:var(--panel);margin-bottom:8px;padding:0 16px}
.faq summary{cursor:pointer;font-size:14px;font-weight:600;padding:14px 0;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";color:var(--muted);font-size:18px;flex-shrink:0}
.faq details[open] summary:after{content:"–"}
.faq details p{margin:0 0 14px}

/* ---------- pricing ---------- */
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px;max-width:820px;margin:30px auto;padding:0 20px}
.plan{border:1px solid var(--line);border-radius:16px;background:var(--panel);padding:26px;display:flex;flex-direction:column;gap:14px;position:relative}
.plan.hot{border-color:var(--amber)}
.plan .tag{position:absolute;top:-11px;left:50%;transform:translateX(-50%);background:var(--amber);color:var(--amber-d);
  font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:4px 12px;border-radius:12px}
.plan h3{margin:0;font-size:17px}
.plan .price{font-size:34px;font-weight:700}
.plan .price small{font-size:13px;color:var(--muted);font-weight:400}
.plan ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.plan li{font-size:13.5px;color:var(--muted);display:flex;gap:8px;align-items:flex-start}
.plan li:before{content:"✓";color:var(--amber);font-weight:700}
.cmp{width:100%;max-width:820px;margin:16px auto 0;border-collapse:collapse;font-size:13.5px}
.cmp th,.cmp td{padding:11px 14px;border-bottom:1px solid rgba(255,255,255,.06);text-align:left}
.cmp th{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.08em}
.cmp td:nth-child(2),.cmp td:nth-child(3),.cmp th:nth-child(2),.cmp th:nth-child(3){text-align:center}
.cmp .y{color:var(--amber);font-weight:700}
.cmp .n{color:var(--muted);opacity:.5}

/* ---------- legal / simple pages ---------- */
.doc{max-width:760px;margin:30px auto;padding:0 20px 40px}
.doc h1{font-size:28px}
.doc h2{font-size:17px;margin:28px 0 8px}
.doc p,.doc li{color:var(--muted);font-size:14px;line-height:1.7}
.doc .updated{font-size:12px;color:var(--muted)}

/* ---------- modal ---------- */
.modal-bg{display:none;position:fixed;inset:0;background:rgba(0,0,0,.65);z-index:100;align-items:center;justify-content:center;padding:20px}
.modal-bg.open{display:flex}
.modal{background:var(--panel);border:1px solid var(--line);border-radius:16px;max-width:440px;width:100%;padding:24px;position:relative}
.modal h3{margin:0 0 6px;font-size:18px}
.modal .x{position:absolute;top:12px;right:14px;background:none;border:0;color:var(--muted);font-size:20px;cursor:pointer}
.payopt{display:flex;justify-content:space-between;align-items:center;border:1px solid var(--line);border-radius:12px;padding:14px;margin-top:10px;cursor:pointer;gap:10px}
.payopt:hover{border-color:var(--amber)}
.payopt .t{font-size:14px;font-weight:600}
.payopt .d{font-size:12px;color:var(--muted)}
.payopt .p{font-size:16px;font-weight:700;color:var(--amber);white-space:nowrap}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--line);margin-top:50px;padding:34px 22px 20px;max-width:1100px;margin-left:auto;margin-right:auto}
footer .cols{display:flex;gap:44px;flex-wrap:wrap}
footer .col{display:flex;flex-direction:column;gap:8px;min-width:170px}
footer .col b{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
footer a{color:var(--muted);font-size:13px}
footer .legal{display:flex;gap:10px;justify-content:center;align-items:center;color:var(--muted);font-size:12px;
  border-top:1px solid rgba(255,255,255,.05);margin-top:26px;padding-top:16px;flex-wrap:wrap}
footer .legal a{font-size:12px}
footer .copy{text-align:center;color:var(--muted);font-size:11px;margin-top:8px;opacity:.7}

/* safety: no unstyled giant SVGs */
.top svg,.content h2 svg,.step svg,.sec svg,.plats svg{max-width:24px;max-height:24px}

/* ---------- auth pages ---------- */
.authwrap{min-height:calc(100vh - 61px);display:flex;align-items:center;justify-content:center;padding:30px 16px}
.authcard{width:100%;max-width:400px;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:30px 28px;display:flex;flex-direction:column;gap:14px}
.authcard h1{margin:0 0 2px;font-size:22px;text-align:center}
.authcard .sub{text-align:center;color:var(--muted);font-size:13px;margin:0 0 6px}
.gbtn{display:flex;align-items:center;justify-content:center;gap:10px;background:#fff;color:#1f1f1f;border:0;border-radius:10px;padding:12px;font-size:14px;font-weight:600;cursor:pointer;text-decoration:none}
.gbtn:hover{text-decoration:none;filter:brightness(.96)}
.gbtn svg{width:18px;height:18px}
.divider{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.1em}
.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--line)}
.authcard label{font-size:12px;color:var(--muted);display:flex;flex-direction:column;gap:6px}
.authcard input[type=text],.authcard input[type=email],.authcard input[type=password]{
  background:var(--panel2);border:1px solid var(--line);border-radius:9px;color:var(--text);
  padding:11px 12px;font-size:14px;width:100%}
.authcard input:focus{outline:none;border-color:var(--amber)}
.authcard .err{display:none;background:rgba(216,105,90,.12);border:1px solid rgba(216,105,90,.4);color:#e8a89e;
  border-radius:9px;padding:10px 12px;font-size:12.5px}
.authcard .links{text-align:center;font-size:13px;color:var(--muted)}
.authcard .fine{text-align:center;font-size:11px;color:var(--muted);line-height:1.6}

/* ---------- PRO chips (rodomi tik Basic planui, per .plan-basic) ---------- */
.prochip{display:none;align-items:center;gap:3px;margin-left:6px;font-size:9px;font-weight:700;
  letter-spacing:.06em;color:var(--amber);text-transform:lowercase;vertical-align:middle}
.prochip svg{width:10px;height:10px;fill:var(--amber);stroke:none}
.plan-basic .prochip{display:inline-flex}
.crown-lg{width:16px;height:16px;fill:var(--amber);stroke:none;vertical-align:-2px;margin-right:5px}

/* ---------- 4 korteliu irankiu perjungiklis ---------- */
.styleswitch{max-width:920px;flex-wrap:wrap}
.styleswitch a,.styleswitch button{min-width:150px}
.mini.canvas{width:34px;height:56px;border-radius:8px;position:relative;
  background:linear-gradient(160deg,#3b2f52,#171320);border:1.5px solid #4a3f63}
.mini.canvas:after{content:"";position:absolute;left:50%;top:50%;width:24px;height:24px;margin:-12px 0 0 -12px;
  border-radius:50%;background:radial-gradient(circle,#f4a826 0 28%,#111 29% 100%)}
.mini.mockup{background:#d9d4c8;position:relative;border-radius:8px}
.mini.mockup:after{content:"";position:absolute;right:5px;top:50%;transform:translateY(-50%);
  width:28px;height:28px;border-radius:50%;background:radial-gradient(circle,#efece4 0 30%,#141414 31% 100%)}

/* ---------- audio trim ---------- */
.audrange{font-variant-numeric:tabular-nums;color:var(--amber);font-size:12px}

/* ---------- 2 stulpeliu pasirinkimai (layout, finish) ---------- */
.seg.cols2{display:grid;grid-template-columns:1fr 1fr}
.seg.cols2 button{padding:12px 6px;min-width:0}

/* ---------- upload'u skirtukai Media sekcijoje ---------- */
.updiv{border-top:1px dashed rgba(244,168,38,.3);padding-top:13px;margin-top:2px}

/* ---------- plastiko pasirinkimas su tooltip perziura ---------- */
.plastchoice{position:relative}
.plastchoice .tip{display:none;position:absolute;bottom:120%;left:50%;transform:translateX(-50%);
  background:#000;padding:6px;border:1px solid var(--line);border-radius:10px;z-index:30;
  box-shadow:0 10px 26px rgba(0,0,0,.5)}
.plastchoice:hover .tip{display:block}
.plastchoice .tip img{width:130px;height:130px;object-fit:cover;display:block;border-radius:6px;background:#111}

/* ---------- platesnis editorius (augantiems valdymams) ---------- */
.editor{max-width:1440px;grid-template-columns:1fr 430px}
canvas.preview{max-width:min(86vw,860px)}
@media(max-width:980px){.editor{grid-template-columns:1fr}}

/* ---------- swatch juostos (plastikai / gradientai) ---------- */
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}
.tile{position:relative;aspect-ratio:1;border:1.5px solid var(--line);border-radius:9px;cursor:pointer;
  padding:0;background:var(--panel2);overflow:visible;display:flex;align-items:center;justify-content:center;
  color:var(--muted);font-size:12px;font-weight:600}
.tile.on{border-color:var(--amber);box-shadow:0 0 0 2px rgba(244,168,38,.18)}
.tile:disabled{opacity:.4;cursor:default}
.tile .thumb{position:absolute;inset:0;border-radius:7px;background-size:cover;background-position:center;background-color:#15131a}
.tile .n{position:relative;z-index:2;text-shadow:0 1px 3px rgba(0,0,0,.9);color:#fff}
.tile .tip{display:none;position:absolute;bottom:118%;left:50%;transform:translateX(-50%);z-index:40;
  background:#000;padding:5px;border:1px solid var(--line);border-radius:10px;box-shadow:0 12px 30px rgba(0,0,0,.6)}
.tile:hover .tip{display:block}
.tile .tip img{width:150px;height:150px;object-fit:cover;display:block;border-radius:6px;background:#111}
.tile .tip span{display:block;font-size:10px;color:var(--muted);text-align:center;padding-top:4px}
.tile .prochip{position:absolute;top:3px;right:3px;margin:0;z-index:3}

/* ---------- 5-as irankis: GIF ---------- */
.styleswitch{max-width:1100px}
.styleswitch a,.styleswitch button{min-width:128px}
.mini.gifm{width:56px;height:56px;border-radius:10px;position:relative;
  background:linear-gradient(135deg,#2b2230,#171320);border:1.5px solid #4a3f63}
.mini.gifm:after{content:"GIF";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:800;color:var(--amber);letter-spacing:.04em}

/* ---------- SEO turinio blokai ---------- */
.lead{font-size:16px;line-height:1.75;color:#c6bdb2}
.cards2{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin-top:16px}
.card2{border:1px solid var(--line);border-radius:13px;background:var(--panel);padding:18px}
.card2 h3{margin:0 0 7px;font-size:14.5px;display:flex;align-items:center;gap:8px}
.card2 p{margin:0;font-size:13.5px;line-height:1.65}
.card2 .tagline{display:inline-block;font-size:10px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--amber);font-weight:700;margin-bottom:6px}
.howto{counter-reset:st;display:flex;flex-direction:column;gap:10px;margin-top:16px}
.howto li{list-style:none;position:relative;padding:14px 16px 14px 52px;border:1px solid var(--line);
  border-radius:12px;background:var(--panel);color:var(--muted);font-size:14px;line-height:1.65}
.howto li:before{counter-increment:st;content:counter(st);position:absolute;left:14px;top:13px;
  width:24px;height:24px;border-radius:7px;background:var(--amber);color:var(--amber-d);
  font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center}
.howto li b{color:var(--text)}
.callout{border:1px solid rgba(244,168,38,.35);background:rgba(244,168,38,.06);border-radius:13px;
  padding:16px 18px;margin-top:18px;font-size:14px;line-height:1.7;color:#d9cfc2}
.callout b{color:var(--amber)}

/* ---------- 6 irankiu juosta ---------- */
.styleswitch{max-width:1200px}
.styleswitch a,.styleswitch button{min-width:112px;padding:14px 8px;font-size:12.5px}

/* ---------- kasetes mini ikona ---------- */
.mini.tape{width:60px;height:38px;border-radius:6px;position:relative;
  background:linear-gradient(180deg,#2b2830,#14121a);border:1.5px solid #4a3f63}
.mini.tape:before{content:"";position:absolute;left:6px;right:6px;top:5px;height:12px;
  border-radius:2px;background:#ded8cc}
.mini.tape:after{content:"";position:absolute;left:12px;right:12px;bottom:6px;height:12px;
  border-radius:2px;background:#0c0a10;
  box-shadow:inset 6px 0 0 -2px #e6e2da, inset -6px 0 0 -2px #e6e2da}

/* ---------- besisukantis logo ---------- */
.vlogo{width:26px;height:26px;border-radius:50%;position:relative;flex-shrink:0;
  background:
    radial-gradient(circle at 50% 50%, #1a1030 0 22%, #3b2bb3 23% 34%, #efe9e0 35% 52%, #e33d2e 53% 100%);
  box-shadow:0 3px 10px rgba(0,0,0,.5), -2px 2px 0 rgba(43,72,214,.55), 2px -2px 0 rgba(227,61,46,.35);
  animation:vspin 6s linear infinite}
.vlogo:after{content:"";position:absolute;left:50%;top:50%;width:5px;height:5px;margin:-2.5px 0 0 -2.5px;
  border-radius:50%;background:#0b0812}
@keyframes vspin{to{transform:rotate(360deg)}}
.logo{display:flex;align-items:center;gap:9px;font-weight:700;letter-spacing:.01em}
.logo .disc{display:none}

/* ---------- footer: brand | menu | stripe ---------- */
footer .cols{display:flex;flex-wrap:wrap;gap:34px;align-items:flex-start;justify-content:space-between}
.fbrand{max-width:230px}
.fbrand .logo{font-size:15px;margin-bottom:9px}
.fbrand p{margin:0;color:var(--muted);font-size:12.5px;line-height:1.6}
.fpay{display:flex;align-items:flex-start;justify-content:flex-end}
.fpay img{height:34px;width:auto;opacity:.85;border-radius:6px}
@media(max-width:760px){footer .cols{flex-direction:column}.fpay{justify-content:flex-start}}

/* ---------- GIF badge ant mini ikonu ---------- */
.mini{position:relative}
.mini .b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:2;
  font-size:11px;font-weight:800;letter-spacing:.05em;color:var(--amber);
  text-shadow:0 1px 2px rgba(0,0,0,.95),0 0 6px rgba(0,0,0,.8)}

/* ---------- failu delete mygtukai ---------- */
.filerow{display:flex;gap:7px;align-items:stretch}
.filerow .file{flex:1;min-width:0}
.fdel{display:none;align-items:center;justify-content:center;width:38px;border-radius:10px;cursor:pointer;
  border:1.5px solid rgba(216,105,90,.5);background:rgba(216,105,90,.10);color:#e8a89e;font-size:15px;font-weight:700}
.fdel:hover{background:rgba(216,105,90,.22)}
.fdel.show{display:flex}

/* ---------- logo be underline ---------- */
a.logo,a.logo:hover{text-decoration:none;color:var(--text)}