.lf-gallery,[data-overlay-id="like-fountain"] { --lf-accent:#ec4899; --lf-rgb:236,72,153; --lf-text:#fbcfe8; }
.lf-gallery-utawaku,[data-overlay-id="like-fountain-utawaku"] { --lf-accent:#00D4AA; --lf-rgb:0,212,170; --lf-text:#99f6e4; }
:is([data-overlay-id="like-fountain"],[data-overlay-id="like-fountain-utawaku"]) .ov-settings { padding:18px; min-width:0; max-height:none; overflow:visible; }
:is([data-overlay-id="like-fountain"],[data-overlay-id="like-fountain-utawaku"]) .ov-preview { max-height:none; min-width:0; }
:is([data-overlay-id="like-fountain"],[data-overlay-id="like-fountain-utawaku"]) .preview-area { flex:1; min-height:340px; padding:0; }
:is([data-overlay-id="like-fountain"],[data-overlay-id="like-fountain-utawaku"]) .preview-area iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
:is([data-overlay-id="like-fountain"],[data-overlay-id="like-fountain-utawaku"]) .preview-controls { flex-wrap:wrap; gap:8px; padding:14px; }
:is([data-overlay-id="like-fountain"],[data-overlay-id="like-fountain-utawaku"]) .preview-controls small { color:var(--text-muted); font-size:11px; }
:is([data-overlay-id="like-fountain"],[data-overlay-id="like-fountain-utawaku"]) > .ov-url-bar { margin:0; border-radius:0 0 16px 16px; }
.lf-designs,.lf-ranges { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:12px; }
.lf-design,.lf-field { border:1px solid var(--border,rgba(255,255,255,.1)); border-radius:12px; background:rgba(255,255,255,.025); }
.lf-design { display:flex; align-items:center; gap:10px; padding:10px; min-width:0; text-align:left; color:var(--text-main,#eee); cursor:pointer; }
.lf-design:hover { border-color:var(--lf-accent); background:rgba(var(--lf-rgb),.07); }
.lf-design img,.lf-design canvas { width:82px; height:90px; object-fit:contain; border-radius:8px; background:#181822; flex-shrink:0; }
.lf-design span { display:flex; flex-direction:column; gap:5px; }
.lf-design small,.lf-design em { color:var(--text-sub,#aaa); font-size:10px; font-style:normal; }
.lf-design strong { font-size:12px; line-height:1.5; }
.lf-field { display:block; padding:12px; margin-top:10px; }
.lf-field h4 { display:flex; justify-content:space-between; gap:8px; margin:0 0 10px; color:var(--text-main,#eee); font-size:12px; }
.lf-field h4 small { font-size:10px; color:var(--text-sub,#aaa); font-weight:400; }
.lf-colors { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:5px; }
.lf-colors button,.lf-extras button { border:1px solid transparent; border-radius:8px; background:rgba(255,255,255,.035); color:var(--text-sub,#aaa); font:inherit; cursor:pointer; }
.lf-colors button { display:flex; flex-direction:column; align-items:center; gap:1px; padding:4px 1px 6px; font-size:10px; }
.lf-colors canvas { width:65px; max-width:100%; height:25px; }
.lf-colors button[aria-pressed="true"],.lf-extras button[aria-pressed="true"],.lf-gallery button[aria-pressed="true"] { border-color:var(--lf-accent); background:rgba(var(--lf-rgb),.12); color:var(--lf-text); }
.lf-fixed { display:flex; gap:7px; align-items:center; flex-wrap:wrap; margin-top:10px; }
.lf-fixed[hidden],.lf-help[hidden] { display:none; }
.lf-fixed span { font-size:10px; color:var(--text-sub,#aaa); }
.lf-fixed button { width:22px; height:22px; background:var(--swatch); border:2px solid transparent; border-radius:50%; cursor:pointer; }
.lf-fixed button[aria-pressed="true"] { outline:2px solid white; outline-offset:2px; }
.lf-ranges { margin-top:0; }
.lf-ranges input { width:100%; accent-color:var(--lf-accent); }
.lf-ranges output { color:var(--lf-text); font-variant-numeric:tabular-nums; }
.lf-extras { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; }
.lf-extras button { padding:9px 3px; font-size:10px; }
.lf-help { color:var(--text-muted,#aaa); font-size:10px; line-height:1.6; margin:9px 0 0; }
.lf-gallery { width:min(920px,94vw); max-height:85vh; padding:20px; border:1px solid #484452; border-radius:16px; color:#eee; background:#202026; }
.lf-gallery::backdrop { background:rgba(0,0,0,.7); }
.lf-gallery-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.lf-gallery-head h3 { margin:0; font-size:18px; }
.lf-gallery-head button { font-size:26px; background:none; border:0; color:#ddd; cursor:pointer; }
.lf-gallery-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.lf-gallery-grid button { display:flex; flex-direction:column; gap:8px; padding:10px; border:1px solid #3a3842; border-radius:10px; background:#282830; color:#ddd; text-align:left; cursor:pointer; }
.lf-gallery-grid img,.lf-gallery-grid canvas { width:100%; height:122px; object-fit:contain; background:#15151d; border-radius:6px; }
.lf-gallery-grid strong { font-size:12px; }
.lf-gallery-grid span { font-size:10px; color:#aaa; line-height:1.6; }
.lf-gallery-grid button:hover { border-color:var(--lf-accent); }
@media(max-width:1100px) { .lf-design img,.lf-design canvas { width:56px; height:74px; } .lf-extras { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:900px) {
  :is([data-overlay-id="like-fountain"],[data-overlay-id="like-fountain-utawaku"]) .ov-split { grid-template-columns:minmax(0,1fr); }
  :is([data-overlay-id="like-fountain"],[data-overlay-id="like-fountain-utawaku"]) .ov-preview { border-left:0; border-top:1px solid var(--border); }
  :is([data-overlay-id="like-fountain"],[data-overlay-id="like-fountain-utawaku"]) .preview-area { aspect-ratio:16/9; min-height:260px; }
}
@media(max-width:700px) { .lf-colors { grid-template-columns:repeat(4,minmax(0,1fr)); } .lf-gallery-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .lf-designs { gap:6px; } .lf-design { padding:8px; gap:6px; } }

.lf-designs-three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.lf-designs-three .lf-design { flex-direction:column; align-items:stretch; gap:8px; }
.lf-designs-three .lf-design img,.lf-designs-three .lf-design canvas { width:100%; height:80px; }
.lf-designs-three .lf-design small { color:var(--text-main,#eee); font-size:11px; font-weight:600; }
.lf-designs-three .lf-design strong { color:var(--lf-text); }
