/* SiteUp mockup flow. Requires siteup-tokens.css. All classes are prefixed su-.
   One screen per step: the flow fills the viewport (minus the page header, --su-header) and never scrolls the page;
   only the mockup image scrolls, inside its own frame. */
.su-scanner{font-family:var(--su-font);color:var(--su-night);font-size:var(--su-text-md);line-height:var(--su-leading-body);direction:rtl;--su-header:0px}
.su-scanner *,.su-scanner *::before,.su-scanner *::after{box-sizing:border-box}
.su-scanner [hidden]{display:none!important}
.su-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.su-ltr{direction:ltr;unicode-bidi:isolate}
.su-scanner h1,.su-scanner h2,.su-scanner h3{margin:0;font-weight:800;letter-spacing:var(--su-track-heading);line-height:var(--su-leading-snug);text-wrap:balance}
.su-scanner p{margin:0}
/* zero-specificity reset: component classes (su-btn-primary white text, su-link blue...) always win over it */
.su-scanner :where(button,input){font:inherit;color:inherit}

/* buttons and fields */
.su-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--su-s2);min-height:52px;padding:0 var(--su-s6);border-radius:var(--su-r-pill);border:0;font-weight:800;cursor:pointer;text-decoration:none;white-space:nowrap;transition:transform var(--su-dur-press) var(--su-ease-out),background-color var(--su-dur-ui) var(--su-ease-out)}
.su-btn:active{transform:scale(.97)}
.su-btn-primary{background:var(--su-ultra);color:#fff}
.su-btn-primary:hover{background:var(--su-ultra-700)}
.su-btn-primary[disabled]{opacity:.55;cursor:progress}
.su-btn-ghost{background:transparent;color:var(--su-ultra);box-shadow:inset 0 0 0 1.5px var(--su-ultra)}
.su-btn-ghost:hover{background:var(--su-ice)}
.su-btn-lg{min-height:58px;font-size:var(--su-text-lg);padding:0 var(--su-s8)}
.su-link{background:none;border:0;padding:0;color:var(--su-ultra);font-weight:700;cursor:pointer;text-decoration:underline;text-underline-offset:3px;min-height:44px}
.su-scanner :is(button,input,a,[tabindex]):focus-visible{outline:3px solid var(--su-up);outline-offset:2px}
.su-input{width:100%;min-height:52px;border:1.5px solid var(--su-line);border-radius:var(--su-r-input);padding:0 var(--su-s4);background:#fff;transition:border-color var(--su-dur-ui)}
.su-input:hover{border-color:var(--su-ink-400)}
.su-input:focus{outline:none;border-color:var(--su-ultra);box-shadow:0 0 0 3px rgba(43,68,224,.14)}
.su-label{display:block;font-weight:700;margin-bottom:var(--su-s2)}
.su-err{color:var(--su-danger);font-weight:600;margin-top:var(--su-s3)!important}
.su-ok{color:var(--su-success);font-weight:600;margin-top:var(--su-s3)!important}
.su-fields{display:grid;grid-template-columns:1fr 1fr;gap:var(--su-s4);margin-bottom:var(--su-s5)}
.su-muted{color:var(--su-ink-600)}
.su-fine{font-size:var(--su-text-sm);margin-top:var(--su-s3)!important}
.su-chip{display:inline-flex;align-items:center;gap:var(--su-s2);background:var(--su-dawn);color:var(--su-ultra);font-weight:700;border-radius:var(--su-r-pill);padding:var(--su-s1) var(--su-s4);font-size:var(--su-text-sm)}
.su-check{width:18px;height:18px;border-radius:50%;background:rgba(185,196,255,.18);flex:none;position:relative}
.su-check::after{content:"";position:absolute;left:6px;top:3px;width:5px;height:9px;border:solid var(--su-up);border-width:0 2px 2px 0;transform:rotate(45deg)}
.su-check.is-ultra{background:var(--su-ice)}.su-check.is-ultra::after{border-color:var(--su-ultra)}
.su-h2{font-size:var(--su-text-3xl)}
.su-note{font-size:var(--su-text-xs);color:var(--su-ink-600);margin-top:var(--su-s3)!important}

/* ---------- the flow: one screen ---------- */
.su-flow{display:flex;flex-direction:column;min-height:calc(100dvh - var(--su-header));background:var(--su-white)}
.su-scanner:not(.is-started) .su-flow{background:var(--su-night);color:#fff}
.su-screen{flex:1;display:flex;flex-direction:column;padding:var(--su-s5) var(--su-gutter) var(--su-s6);max-width:var(--su-container);width:100%;margin:0 auto}
.su-center{margin:auto 0;max-width:680px;width:100%}
.su-center.su-wide{max-width:960px}
.su-actions{margin-top:var(--su-s6)!important}

/* timeline */
.su-timeline{list-style:none;margin:0;padding:var(--su-s3) var(--su-gutter);display:flex;justify-content:center;gap:0;background:var(--su-white);border-bottom:1px solid var(--su-line)}
.su-scanner:not(.is-started) .su-timeline{background:transparent;border-color:rgba(185,196,255,.16)}
.su-timeline li{display:flex;align-items:center;position:relative}
.su-timeline li+li::before{content:"";width:clamp(20px,5vw,56px);height:2px;background:var(--su-line);margin:0 var(--su-s2)}
.su-scanner:not(.is-started) .su-timeline li+li::before{background:rgba(185,196,255,.25)}
.su-timeline li.is-done+li.is-done::before,.su-timeline li.is-done+li.is-active::before{background:var(--su-ultra)}
.su-tl-btn{display:inline-flex;align-items:center;gap:var(--su-s2);background:none;border:0;padding:var(--su-s1) var(--su-s2);border-radius:var(--su-r-pill);color:var(--su-ink-400);font-weight:700;cursor:default}
.su-scanner:not(.is-started) .su-tl-btn{color:rgba(201,208,238,.7)}
.su-tl-btn:not([disabled]){cursor:pointer}
.su-tl-btn:not([disabled]):hover{background:var(--su-dawn)}
.su-tl-dot{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:var(--su-text-xs);font-weight:800;box-shadow:inset 0 0 0 2px var(--su-line);color:var(--su-ink-400)}
.su-scanner:not(.is-started) .su-tl-dot{box-shadow:inset 0 0 0 2px rgba(185,196,255,.3);color:rgba(201,208,238,.8)}
li.is-active .su-tl-btn{color:var(--su-night)}
.su-scanner:not(.is-started) li.is-active .su-tl-btn{color:#fff}
li.is-active .su-tl-dot{background:var(--su-ultra);color:#fff;box-shadow:none}
li.is-done .su-tl-btn{color:var(--su-night)}
li.is-done .su-tl-dot{background:var(--su-ice);color:transparent;box-shadow:none;position:relative}
li.is-done .su-tl-dot::after{content:"";position:absolute;left:10px;top:6px;width:6px;height:11px;border:solid var(--su-ultra);border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}

/* findings strip: stays under the timeline from step 3 to the end */
.su-strip{border-bottom:1px solid var(--su-line);background:var(--su-dawn)}
.su-strip-btn{width:100%;background:none;border:0;padding:var(--su-s2) var(--su-gutter);display:flex;align-items:center;gap:var(--su-s3);flex-wrap:wrap;cursor:pointer;max-width:var(--su-container);margin:0 auto;text-align:right}
.su-strip-btn:hover .su-strip-more{text-decoration:underline}
.su-strip-items{display:flex;gap:var(--su-s2);flex-wrap:wrap;flex:1}
.su-strip-item{display:inline-flex;align-items:center;gap:6px;font-size:var(--su-text-xs);font-weight:700;padding:3px 10px;border-radius:var(--su-r-pill);background:#fff;color:var(--su-ink-600);box-shadow:inset 0 0 0 1px var(--su-line)}
.su-strip-item i{width:8px;height:8px;border-radius:50%;background:var(--su-ink-400)}
.su-strip-item.is-good{color:var(--su-success)}.su-strip-item.is-good i{background:var(--su-success)}
.su-strip-item.is-bad{color:var(--su-danger)}.su-strip-item.is-bad i{background:var(--su-danger)}
.su-strip-item.is-pending{color:var(--su-ink-400)}
.su-strip-more{font-size:var(--su-text-xs);font-weight:700;color:var(--su-ultra);white-space:nowrap}
.su-strip-panel{padding:var(--su-s3) var(--su-gutter) var(--su-s4);max-width:var(--su-container);margin:0 auto}

/* step 1: address (dark) */
.su-display{font-size:var(--su-text-display);line-height:var(--su-leading-tight);letter-spacing:var(--su-track-display);font-weight:800;margin:0 0 var(--su-s4)}
.su-lead{font-size:var(--su-text-xl);color:var(--su-on-dark-muted);max-width:44ch;margin-bottom:var(--su-s8)!important;line-height:1.5}
.su-urlbar{display:flex;gap:var(--su-s2);background:#fff;padding:var(--su-s2);border-radius:var(--su-r-pill);max-width:680px;box-shadow:var(--su-shadow-3);transition:box-shadow var(--su-dur-ui)}
.su-urlbar:focus-within{box-shadow:0 0 0 3px var(--su-up),var(--su-shadow-3)}
.su-urlbar input{flex:1;min-width:0;border:0;background:transparent;padding:0 var(--su-s5);font-size:var(--su-text-lg);color:var(--su-night);direction:ltr;text-align:right}
.su-urlbar input::placeholder{color:var(--su-ink-400)}
.su-urlbar input:focus{outline:none}
.su-ticks{display:flex;flex-wrap:wrap;gap:var(--su-s3) var(--su-s6);list-style:none;padding:0;margin:var(--su-s5) 0 0;color:var(--su-on-dark-muted);font-size:var(--su-text-sm)}
.su-ticks li{display:flex;align-items:center;gap:var(--su-s2)}
.su-screen-address .su-err{color:#FFB4AB}

/* step 2: scan */
.su-scan-sub{margin:var(--su-s2) 0 var(--su-s6)!important}
[data-view="scan"] .su-chip{margin-bottom:var(--su-s3)}
.su-findings{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--su-s3)}
.su-findings-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.su-finding{border-radius:var(--su-r-card);padding:var(--su-s5);background:var(--su-dawn);display:flex;flex-direction:column;gap:var(--su-s1)}
.su-finding .su-k{font-weight:700;color:var(--su-ink-600);font-size:var(--su-text-sm)}
.su-finding .su-v{font-size:var(--su-text-xl);font-weight:800;letter-spacing:var(--su-track-heading);line-height:1.2;margin:var(--su-s1) 0}
.su-finding .su-d{font-size:15px;color:var(--su-ink-600)}
.su-finding ul{margin:var(--su-s2) 0 0;padding-inline-start:var(--su-s5);font-size:14px;color:var(--su-ink-600)}
.su-finding.is-good{background:var(--su-success-bg)}.su-finding.is-good .su-v{color:var(--su-success)}
.su-finding.is-bad{background:var(--su-danger-bg)}.su-finding.is-bad .su-v{color:var(--su-danger)}
.su-finding.is-pending{background:var(--su-white);box-shadow:inset 0 0 0 1px var(--su-line)}
.su-finding.is-pending .su-v{color:var(--su-ink-400);font-weight:600}

/* step 3, waiting: cubes + notify form */
.su-status{color:var(--su-ultra);font-weight:700;margin-top:var(--su-s2)!important}
.su-cubes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--su-s3);margin:var(--su-s5) 0}
.su-cube{position:relative;overflow:hidden;aspect-ratio:16/9;border-radius:var(--su-r-card);background:var(--su-dawn) center top/cover no-repeat;box-shadow:inset 0 0 0 1px var(--su-line);display:flex;align-items:flex-end;justify-content:space-between;gap:8px;padding:var(--su-s4);border:0;font:inherit;text-align:right;cursor:default}
.su-cube em{position:relative;font-style:normal;font-size:13px;color:var(--su-ink-400)}
.su-cube.is-ready{cursor:pointer;box-shadow:inset 0 0 0 2px var(--su-ultra)}
.su-cube.is-ready .su-cube-shine{display:none}
.su-cube.is-ready b,.su-cube.is-ready em{background:rgba(255,255,255,.94);padding:2px 10px;border-radius:999px;color:var(--su-night)}
.su-cube.is-ready em{background:var(--su-ultra);color:#fff;font-weight:700}
.su-cube.is-ready:hover{box-shadow:inset 0 0 0 3px var(--su-ultra)}
.su-tab[disabled],.su-seg button[disabled]{opacity:.45;cursor:default}
.su-cube b{position:relative;font-weight:700;color:var(--su-ink-600)}
.su-cube-shine{position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.75) 50%,transparent 70%);transform:translateX(100%);animation:su-shine 1.6s var(--su-ease-out) infinite}
.su-cube:nth-child(2) .su-cube-shine{animation-delay:.2s}.su-cube:nth-child(3) .su-cube-shine{animation-delay:.4s}
@keyframes su-shine{to{transform:translateX(-100%)}}
.su-wait{background:var(--su-dawn);border-radius:var(--su-r-card);padding:var(--su-s5)}
.su-wait-title{font-weight:700;margin-bottom:var(--su-s4)!important}
.su-wait .su-fields{margin-bottom:var(--su-s4)}

/* step 3, ready: the viewer fills the screen exactly; only the image scrolls */
.su-scanner.is-mockups .su-flow{height:calc(100dvh - var(--su-header));min-height:0}
.su-screen-mockups{gap:var(--su-s3);min-height:0;overflow:hidden}
.su-mock-head{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--su-s4);flex-wrap:wrap}
.su-mock-head .su-muted{max-width:60ch;font-size:var(--su-text-sm);margin-top:var(--su-s1)!important}
.su-tabs{display:flex;gap:var(--su-s2);flex-wrap:wrap}
.su-tab{border:0;background:#fff;box-shadow:inset 0 0 0 1.5px var(--su-line);border-radius:var(--su-r-card);padding:var(--su-s2) var(--su-s4);min-height:46px;cursor:pointer;color:var(--su-night);display:flex;flex-direction:column;align-items:flex-start;text-align:right;transition:background-color var(--su-dur-ui),color var(--su-dur-ui)}
.su-tab b{font-weight:800;font-size:var(--su-text-sm);line-height:1.2}
.su-tab small{font-size:13px;color:var(--su-ink-600);line-height:1.2;max-width:20ch;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.su-tab:hover{box-shadow:inset 0 0 0 1.5px var(--su-ink-400)}
.su-tab[aria-selected=true]{background:var(--su-night);color:#fff;box-shadow:none}
.su-tab[aria-selected=true] small{color:var(--su-on-dark-muted)}
.su-controls{display:flex;gap:var(--su-s2);flex-wrap:wrap;justify-content:space-between}
.su-seg{display:flex;background:var(--su-dawn);border-radius:var(--su-r-pill);padding:var(--su-s1)}
.su-seg button{border:0;background:transparent;padding:0 var(--su-s4);min-height:38px;border-radius:var(--su-r-pill);font-weight:700;cursor:pointer;color:var(--su-ink-600)}
.su-seg button[aria-pressed=true]{background:#fff;color:var(--su-night);box-shadow:0 1px 3px rgba(15,26,61,.15)}
.su-stage{flex:1;min-height:0;background:var(--su-dawn);border-radius:var(--su-r-card);padding:var(--su-s3);display:flex;justify-content:center}
.su-browser{width:100%;display:flex;flex-direction:column;min-height:0;border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 0 0 1px var(--su-line),var(--su-shadow-2)}
.su-browser-bar{display:flex;align-items:center;gap:var(--su-s3);padding:8px 14px;background:#F4F6FC;border-bottom:1px solid var(--su-line)}
.su-dots{display:flex;gap:6px}.su-dots i{width:10px;height:10px;border-radius:50%;background:var(--su-line)}
.su-addr{flex:1;background:#fff;border-radius:var(--su-r-pill);padding:3px 14px;font-size:var(--su-text-xs);color:var(--su-ink-600);text-align:center;box-shadow:inset 0 0 0 1px var(--su-line);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.su-addr b{color:var(--su-success);font-weight:700;margin-inline-end:6px}
.su-shot{display:block;flex:1;min-height:200px;overflow:auto;cursor:zoom-in;background:#fff}
.su-shot img{display:block;width:100%;height:auto}
.su-stage.is-mobile{background:var(--su-night)}
.su-phone{width:min(340px,100%);border-radius:36px;padding:10px;background:#1B2550;box-shadow:var(--su-shadow-3);display:flex;min-height:0}
.su-phone .su-shot{width:100%;border-radius:28px}
.su-mock-actions{display:flex;gap:var(--su-s3);align-items:center;justify-content:center;flex-wrap:wrap;padding-top:var(--su-s1)}

/* step 4: details */
.su-details-head{display:flex;gap:var(--su-s4);align-items:center;margin-bottom:var(--su-s5)}
.su-thumb-sm{flex:none;width:112px;aspect-ratio:16/10;border-radius:var(--su-r-input);background:var(--su-dawn) center top/cover no-repeat;box-shadow:inset 0 0 0 1px var(--su-line)}
.su-thumb-sm.is-more{display:grid;place-items:center;font-size:36px;font-weight:300;color:var(--su-ultra);background:var(--su-ice)}
.su-price{background:var(--su-night);color:#fff;border-radius:var(--su-r-panel);padding:var(--su-s6);margin-bottom:var(--su-s5)}
.su-price .su-k{color:var(--su-up);font-weight:700;font-size:var(--su-text-sm)}
.su-price .su-was{color:var(--su-on-dark-muted);font-size:var(--su-text-md);margin-top:var(--su-s2)}
.su-price .su-was s{font-size:var(--su-text-xl);margin-inline-end:6px}
.su-price .su-v{font-size:clamp(36px,4vw,52px);font-weight:800;letter-spacing:var(--su-track-display);line-height:1.1;margin:var(--su-s1) 0 var(--su-s2);font-variant-numeric:tabular-nums}
.su-price p{color:var(--su-on-dark-muted);font-size:var(--su-text-sm)}
.su-price .su-timer{margin-top:var(--su-s2);color:#fff}
.su-price .su-timer b{color:var(--su-up)}
.su-thanks{background:var(--su-dawn);border-radius:var(--su-r-card);padding:var(--su-s6);display:flex;gap:var(--su-s4);align-items:flex-start}
.su-thanks h3{font-size:var(--su-text-xl);margin-bottom:var(--su-s1)}

/* lightbox */
.su-lightbox{position:fixed;inset:0;background:rgba(15,26,61,.92);z-index:1000;overflow:auto;display:flex;justify-content:center;padding:var(--su-s14) var(--su-s4)}
.su-lightbox img{max-width:min(1440px,100%);height:auto;align-self:flex-start;border-radius:8px}
.su-lightbox .su-close{font-size:28px;line-height:1;color:var(--su-night);position:fixed;top:14px;inset-inline-start:18px;width:48px;height:48px;border-radius:50%;border:0;background:#fff;cursor:pointer;display:grid;place-items:center}

/* mockup stages */
.su-gen{list-style:none;margin:var(--su-s5) 0 var(--su-s2);padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--su-s2)}
.su-gen .su-gen-open{min-height:0;font-size:13px;text-align:right;margin-top:2px}
.su-gen li{display:flex;gap:var(--su-s3);align-items:flex-start;padding:var(--su-s3) var(--su-s4);border-radius:var(--su-r-card);background:var(--su-white);box-shadow:inset 0 0 0 1px var(--su-line);color:var(--su-ink-400)}
.su-gen li>div{display:flex;flex-direction:column;min-width:0;flex:1}
.su-gen b{font-size:var(--su-text-sm);line-height:1.3}
.su-gen small{font-size:13px;line-height:1.35;margin-top:2px}
.su-gen li.is-active{background:#fff;color:var(--su-night);box-shadow:inset 0 0 0 1.5px var(--su-ultra)}
.su-gen li.is-active small{color:var(--su-ink-600)}
.su-gen li.is-done{color:var(--su-night);background:var(--su-dawn);box-shadow:none}
.su-gen li.is-done small{color:var(--su-ink-600)}
.su-gen .su-spin{margin:2px 0 0;width:20px;height:20px}
.su-gen-dot{flex:none;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:800;box-shadow:inset 0 0 0 1.5px var(--su-line);margin-top:2px;position:relative}
.su-gen li.is-done .su-gen-dot{background:var(--su-ultra);box-shadow:none}
.su-gen li.is-done .su-gen-dot::after{content:"";position:absolute;left:7px;top:4px;width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.su-gen-bar{display:block;height:6px;border-radius:99px;background:var(--su-ice);margin-top:var(--su-s2);overflow:hidden}
.su-gen-bar i{display:block;height:100%;background:var(--su-ultra);border-radius:99px;transition:width .6s var(--su-ease-out)}
.su-gen-count{font-size:12px;color:var(--su-ultra);font-weight:700;margin-top:4px}
@media (max-width:980px){.su-gen{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.su-gen{grid-template-columns:1fr;gap:6px}.su-gen li{padding:10px 12px}.su-gen li:not(.is-active) small{display:none}}

/* loading circle: shows that a check or the mockups are still in progress */
.su-spin{display:inline-block;width:16px;height:16px;border-radius:50%;border:2.5px solid var(--su-ice);border-top-color:var(--su-ultra);margin-inline-end:8px;vertical-align:-2px;animation:su-rot .8s linear infinite;flex:none}
.su-spin-lg{width:26px;height:26px;border-width:3.5px;vertical-align:-3px;margin-inline-end:12px}
.su-strip-item .su-spin{width:10px;height:10px;border-width:2px;margin:0}
.su-status{display:flex;align-items:center}
@keyframes su-rot{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.su-scanner *{animation:none!important;transition:none!important}.su-cube-shine{display:none}.su-scanner .su-spin{animation:su-rot 2.4s linear infinite!important}}
@media (max-width:980px){.su-findings-4{grid-template-columns:1fr 1fr}}
@media (max-width:820px){
  .su-screen{padding:var(--su-s4) var(--su-gutter) var(--su-s5)}
  .su-urlbar{flex-direction:column;border-radius:var(--su-r-panel)}
  .su-urlbar input{min-height:52px;text-align:center}
  .su-lead{font-size:var(--su-text-lg);margin-bottom:var(--su-s5)!important}
  .su-fields{grid-template-columns:1fr}
  .su-cubes{gap:var(--su-s2)}.su-cube{aspect-ratio:4/3;padding:var(--su-s3)}
  .su-tl-label{font-size:var(--su-text-xs)}
  .su-timeline li+li::before{width:12px;margin:0 2px}
  .su-tl-btn{padding:var(--su-s1)}
  .su-mock-head .su-h2{font-size:var(--su-text-xl)}
  .su-tab{padding:var(--su-s1) var(--su-s3);min-height:40px}
  .su-tab small{display:none}
  .su-stage{padding:var(--su-s2)}
  .su-phone{width:min(300px,100%)}
  .su-mock-actions .su-btn-lg{min-height:52px;font-size:var(--su-text-md);padding:0 var(--su-s6)}
  .su-details-head{align-items:flex-start}
  .su-thumb-sm{width:84px}
}
@media (max-width:640px){
  .su-findings-4{grid-template-columns:1fr}
  .su-finding{padding:var(--su-s3) var(--su-s4);flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:var(--su-s1) var(--su-s3)}
  .su-finding .su-k{min-width:52px}
  .su-finding .su-v{font-size:var(--su-text-md);margin:0}
  .su-finding .su-d{flex-basis:100%;font-size:14px}
  .su-finding ul{display:none}
  .su-strip-more{display:none}
  .su-tl-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  li.is-active .su-tl-label{position:static;width:auto;height:auto;clip:auto}
}