/* Indowaves Perfect Look – black text on white. All rules are scoped under .iwl so the theme can't clash with them. */
.iwl{--iwl-ink:#000;--iwl-muted:#444;--iwl-line:#D9D9D9;--iwl-soft:#F3F3F3;--iwl-err:#B3261E;
  max-width:600px;margin:0 auto;padding:0;font-family:inherit;line-height:1.4;box-sizing:border-box}
.iwl *,.iwl *::before,.iwl *::after{box-sizing:border-box}
.iwl h2,.iwl p{margin:0;padding:0}
.iwl button{all:unset;box-sizing:border-box;cursor:pointer;font:inherit;color:inherit;-webkit-tap-highlight-color:transparent}
.iwl button:focus-visible,.iwl a:focus-visible,.iwl input:focus-visible{outline:3px solid #000;outline-offset:2px}
.iwl button[hidden]{display:none}

/* heading above the card follows the page colours */
.iwl .iwl-title{padding:6px 0 18px}
.iwl .iwl-title h2{font-size:clamp(30px,8vw,42px);line-height:1.02;letter-spacing:-.03em;font-weight:800;color:inherit}
.iwl .iwl-title p{margin-top:10px;max-width:44ch;color:inherit;opacity:.75}

/* the card itself: always white background, black text, whatever the theme does */
.iwl .iwl-card{background:#fff!important;color:#000!important;border:1px solid #E5E5E5;border-radius:22px;padding:22px 20px 24px;box-shadow:0 12px 32px -18px rgba(0,0,0,.25)}
.iwl .iwl-card h2,.iwl .iwl-card b,.iwl .iwl-card strong,.iwl .iwl-card label{color:#000!important}
.iwl .iwl-progress{display:flex;align-items:center;gap:12px;margin-bottom:22px}
.iwl .iwl-bar{flex:1;height:5px;border-radius:9px;background:var(--iwl-line);overflow:hidden}
.iwl .iwl-bar i{display:block;height:100%;width:0;background:#000;border-radius:9px;transition:width .3s}
.iwl .iwl-count{font-size:13px;color:var(--iwl-muted)!important;font-weight:600;white-space:nowrap}
.iwl .iwl-back{display:inline-block;font-size:13px;color:#000!important;font-weight:600;padding:6px 2px}
.iwl .iwl-q{font-size:24px;letter-spacing:-.02em;line-height:1.12;margin:0 0 6px;font-weight:700;color:#000!important}
.iwl .iwl-help{font-size:14px;color:var(--iwl-muted)!important;margin:0 0 18px;line-height:1.45}
.iwl .iwl-stage{animation:iwl-in .25s ease}
@keyframes iwl-in{from{opacity:0;transform:translateX(10px)}to{opacity:1;transform:none}}
.iwl .iwl-priv{font-size:13px;color:var(--iwl-muted)!important;margin-top:16px;text-align:center;line-height:1.4}

/* tone + choice + size buttons */
.iwl .iwl-tones{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media(min-width:480px){.iwl .iwl-tones{grid-template-columns:repeat(4,1fr)}}
.iwl .iwl-tone{display:flex;flex-direction:column;align-items:center;gap:9px;padding:14px 6px 12px;border:2px solid var(--iwl-line);border-radius:16px;background:#fff;color:#000;font-weight:600;transition:border-color .15s,background .15s}
.iwl .iwl-tone i{display:block;width:54px;height:54px;border-radius:50%;box-shadow:inset 0 0 0 2px rgba(0,0,0,.08)}
.iwl .iwl-tones.iwl-small .iwl-tone{padding:10px 4px 9px;font-size:14px}
.iwl .iwl-tones.iwl-small .iwl-tone i{width:40px;height:40px}
.iwl .iwl-tone[aria-pressed="true"]{border-color:#000;background:var(--iwl-soft)}
.iwl .iwl-choices{display:grid;gap:10px}
.iwl .iwl-choice{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px;border:2px solid var(--iwl-line);border-radius:14px;background:#fff;color:#000;font-weight:600;text-align:left;transition:border-color .15s}
.iwl .iwl-choice small{display:block;font-weight:400;color:var(--iwl-muted)!important;font-size:13px;margin-top:2px}
.iwl .iwl-choice .iwl-ar{color:#000;font-weight:700}
.iwl .iwl-choice.iwl-main{border-color:#000;background:var(--iwl-soft)}
.iwl .iwl-sizes{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.iwl .iwl-size{display:flex;align-items:center;justify-content:center;height:62px;border:2px solid var(--iwl-line);border-radius:14px;background:#fff;color:#000;font-weight:700;font-size:18px;transition:border-color .15s}
.iwl .iwl-tone:hover,.iwl .iwl-choice:hover,.iwl .iwl-size:hover{border-color:#000}

/* camera / photo */
.iwl .iwl-cam{position:relative;width:100%;max-width:380px;aspect-ratio:1/1;margin:0 auto 14px;border-radius:18px;overflow:hidden;background:#111}
.iwl .iwl-cam video,.iwl .iwl-cam canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:none}
.iwl .iwl-cam video{transform:scaleX(-1)}
.iwl .iwl-cam[data-state="live"] video{display:block}
.iwl .iwl-cam[data-state="frame"] canvas{display:block}
.iwl .iwl-ov{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.iwl .iwl-cam[data-state="empty"] .iwl-ov{display:none}
.iwl .iwl-msg{position:absolute;inset:0;display:none;align-items:center;justify-content:center;text-align:center;color:#E6E6E6!important;padding:24px;font-size:14px;line-height:1.45}
.iwl .iwl-cam[data-state="empty"] .iwl-msg{display:flex}
.iwl .iwl-zoom{display:flex;align-items:center;gap:10px;max-width:380px;margin:0 auto 14px;font-size:13px;font-weight:600}
.iwl .iwl-zoom[hidden]{display:none}
.iwl .iwl-zoom input{flex:1;accent-color:#000}
.iwl .iwl-err{font-size:14px;color:var(--iwl-err)!important;margin:0 0 12px;line-height:1.4;text-align:center}
.iwl .iwl-err:empty{display:none}
.iwl .iwl-detect{display:flex;align-items:center;gap:14px;border:1.5px solid var(--iwl-line);border-radius:16px;padding:14px;margin-bottom:14px}
.iwl .iwl-detect i{display:block;flex:none;width:60px;height:60px;border-radius:50%;box-shadow:inset 0 0 0 2px rgba(0,0,0,.08)}
.iwl .iwl-detect b{display:block;font-size:20px}
.iwl .iwl-detect span{font-size:13px;color:var(--iwl-muted)!important}
.iwl .iwl-sub{font-size:13px;color:var(--iwl-muted)!important;margin:20px 0 10px;font-weight:600}

/* action buttons */
.iwl .iwl-row{display:flex;gap:10px}
.iwl .iwl-add,.iwl .iwl-add:hover,.iwl .iwl-add:focus{flex:1;display:block;text-align:center;background:#000;color:#fff!important;padding:16px;border-radius:14px;font-weight:700;text-decoration:none;transition:opacity .15s}
.iwl .iwl-add:hover{opacity:.85}
.iwl .iwl-add.iwl-full{width:100%}
.iwl .iwl-add[disabled]{opacity:.55;cursor:default}
.iwl .iwl-alt{display:block;text-align:center;padding:16px 18px;border:2px solid #000;border-radius:14px;background:#fff;color:#000!important;font-weight:600;transition:background .15s}
.iwl .iwl-alt:hover{background:var(--iwl-soft)}
.iwl .iwl-link{display:inline-block;color:#000!important;font-weight:600;text-decoration:underline;padding:4px}

/* result */
.iwl .iwl-resTop{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:4px}
.iwl .iwl-resTop h2{font-size:26px;letter-spacing:-.03em;font-weight:800}
.iwl .iwl-badge{font-size:12px;font-weight:700;background:var(--iwl-soft);color:#000!important;padding:5px 10px;border-radius:99px;white-space:nowrap}
.iwl .iwl-tag{font-size:14px;color:var(--iwl-muted)!important;margin-bottom:16px}

/* try-on preview */
.iwl .iwl-tryon{background:var(--iwl-soft);border-radius:18px;padding:14px 10px 10px;margin-bottom:14px;text-align:center}
.iwl .iwl-tryon h3{margin:0 0 4px;font-size:15px;font-weight:700;color:#000!important}
.iwl .iwl-fig{display:flex;justify-content:center}
.iwl .iwl-fig svg{display:block;height:300px;width:auto;max-width:100%}
.iwl .iwl-fignote{font-size:12px;color:var(--iwl-muted)!important;margin-top:6px}

.iwl .iwl-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.iwl .iwl-item{display:block;border:1.5px solid var(--iwl-line);border-radius:16px;padding:10px;background:#fff;color:#000!important;text-decoration:none}
.iwl .iwl-thumb{display:grid;place-items:center;aspect-ratio:1/1;background:var(--iwl-soft);border-radius:12px;overflow:hidden}
.iwl .iwl-thumb img{width:100%;height:100%;object-fit:cover;display:block;margin:0}
.iwl .iwl-thumb svg{width:60%;height:60%}
.iwl .iwl-item b{display:block;font-size:15px;margin-top:9px;line-height:1.25}
.iwl .iwl-meta{font-size:13px;color:var(--iwl-muted)!important;margin-top:3px;display:flex;justify-content:space-between;gap:6px}
.iwl .iwl-meta strong{color:#000!important}
.iwl .iwl-why{margin:18px 0;display:grid;gap:10px}
.iwl .iwl-why p{font-size:14px;line-height:1.5;color:#000!important;padding-left:12px;border-left:3px solid #000}
.iwl .iwl-sum{display:flex;justify-content:space-between;align-items:flex-end;gap:10px;margin-bottom:14px;padding-top:16px;border-top:1.5px solid var(--iwl-line)}
.iwl .iwl-price{font-weight:800;font-size:30px;line-height:1;color:#000!important}
.iwl .iwl-price s{font-size:15px;color:var(--iwl-muted)!important;font-weight:500;margin-left:8px}
.iwl .iwl-save{font-size:13px;color:#000!important;font-weight:700}
.iwl .iwl-foot{display:flex;justify-content:space-between;align-items:center;margin-top:14px;font-size:13px;color:var(--iwl-muted)!important}

.iwl .iwl-toast{position:fixed;left:50%;top:18px;transform:translate(-50%,-160%);background:#000;color:#fff!important;padding:12px 18px;border-radius:12px;font-weight:600;z-index:99999;transition:transform .25s;max-width:90vw;text-align:center}
.iwl .iwl-toast.iwl-show{transform:translate(-50%,0)}
.iwl .iwl-toast.iwl-bad{background:var(--iwl-err)}
@media(prefers-reduced-motion:reduce){.iwl *{transition:none!important;animation:none!important}}