/* ══════════════════════════════════════════════════════
   SETTINGS — sidebar profil, 11 panneaux, abonnement
══════════════════════════════════════════════════════ */
.stg-layout{display:flex;min-height:calc(100vh - 60px)}
.stg-sidebar{width:240px;flex-shrink:0;border-right:1px solid var(--border);position:sticky;top:60px;height:calc(100vh - 60px);overflow-y:auto;display:flex;flex-direction:column}
.stg-profile{padding:20px;border-bottom:1px solid var(--border)}
.stg-av-wrap{position:relative;width:52px;height:52px;margin-bottom:10px}
.stg-av-svg{position:absolute;inset:0;width:52px;height:52px;transform:rotate(-90deg)}
.stg-av-inner{position:absolute;inset:4px;border-radius:50%;background:var(--purple-d);border:none;display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:20px;color:var(--purple-l)}
.stg-name{font-size:14px;font-weight:500;margin-bottom:2px}.stg-email{font-size:11px;color:var(--g5);margin-bottom:8px}
.stg-pct{font-size:11px;color:var(--g5)}
.snav{padding:10px 0;flex:1}
.snav-sec{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--g4);padding:12px 20px 5px}
.snav-item{display:flex;align-items:center;gap:9px;padding:8px 20px;font-size:13px;color:var(--g5);cursor:pointer;transition:all .15s;border:none;background:none;width:100%;text-align:left;font-family:var(--sans)}.snav-item:hover{color:var(--w);background:rgba(0,0,0,.04)}.snav-item.on{color:var(--w);background:var(--purple-d);border-right:2px solid var(--purple)}
.snav-ico{font-size:14px;width:20px;text-align:center;flex-shrink:0}
.snav-badge{margin-left:auto;font-size:10px;background:var(--coral-d);color:var(--coral);padding:2px 7px;border-radius:10px}
.stg-content{flex:1;padding:36px 44px;overflow-y:auto}
.sct-h{font-family:var(--serif);font-size:30px;font-weight:300;margin-bottom:5px}
.sct-s{font-size:14px;color:var(--g5);margin-bottom:28px;border-bottom:1px solid var(--border);padding-bottom:20px}
.sform-sec{margin-bottom:28px}.sform-lbl{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--g5);margin-bottom:11px;display:block}
.sform-in{width:100%;padding:10px 15px;background:var(--bg-card);border:1px solid var(--border-h);border-radius:var(--r);font-family:var(--sans);font-size:14px;color:var(--w);outline:none;transition:border-color .2s}.sform-in:focus{border-color:var(--purple)}
.sform-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
.sform-grp{display:flex;flex-direction:column;gap:6px}.sform-grp label{font-size:13px;color:var(--g5)}
.ob-opts{display:flex;flex-wrap:wrap;gap:8px}
.ob-opt{padding:6px 14px;border-radius:20px;border:1px solid var(--border-h);font-size:13px;color:var(--g6);cursor:pointer;transition:all .2s;font-family:var(--sans);background:none}.ob-opt.sel{background:var(--purple-d);border-color:var(--purple);color:var(--w)}
.save-row{display:flex;justify-content:flex-end;margin-top:22px;padding-top:18px;border-top:1px solid var(--border)}
/* Radar */
.radar-wrap{display:flex;align-items:flex-start;gap:32px;flex-wrap:wrap}
.radar-box{width:260px;flex-shrink:0}
.radar-legend{flex:1;min-width:180px}
.rli{display:flex;align-items:center;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--border)}
.rli-l{display:flex;align-items:center;gap:9px}.rli-dot{width:7px;height:7px;border-radius:50%;background:var(--purple);flex-shrink:0}
.rli-nm{font-size:13px;color:var(--g6)}.rli-bar{flex:1;height:3px;background:var(--g2);border-radius:2px;margin:0 10px}.rli-fill{height:100%;background:var(--purple);border-radius:2px}.rli-v{font-size:12px;color:var(--g5);width:24px;text-align:right}
/* Morpho */
.morph-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.morph-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r-lg);padding:14px 8px;text-align:center;cursor:pointer;transition:all .2s}.morph-card:hover{border-color:var(--border-h)}.morph-card.sel{border-color:var(--purple);background:var(--purple-d)}
.morph-fig{height:96px;margin:0 auto 10px;display:flex;align-items:flex-end;justify-content:center}.morph-nm{font-size:11px;color:var(--g5)}
/* Colors */
.color-grid{display:flex;flex-wrap:wrap;gap:9px}
.c-sw{width:32px;height:32px;border-radius:50%;cursor:pointer;border:2px solid transparent;transition:all .2s;position:relative}.c-sw:hover{transform:scale(1.1)}.c-sw.avoided{opacity:.4}.c-sw.avoided::after{content:'×';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:16px}
.skin-row{display:flex;gap:8px;flex-wrap:wrap}
.skin-btn{display:flex;align-items:center;gap:8px;padding:8px 13px;background:var(--bg-card);border:1px solid var(--border-h);border-radius:var(--r);cursor:pointer;transition:all .2s;font-family:var(--sans);font-size:13px;color:var(--g6)}.skin-btn.sel{border-color:var(--purple);color:var(--w)}
.skin-dot{width:16px;height:16px;border-radius:50%;flex-shrink:0}
/* Wardrobe */
.ward-upload{border:1.5px dashed var(--border-h);border-radius:var(--r-lg);padding:36px;text-align:center;cursor:pointer;transition:all .2s}.ward-upload:hover{border-color:var(--purple);background:var(--purple-d)}
/* Trends */
.trend-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:13px}
.trend-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;transition:all .2s}.trend-card.on{border-color:var(--purple)}
.trend-img{height:105px;display:flex;align-items:center;justify-content:center}
.trend-info{padding:11px 13px}.trend-nm{font-size:13px;font-weight:500;margin-bottom:3px}.trend-desc{font-size:12px;color:var(--g5);line-height:1.5}
.t-toggle{width:32px;height:18px;border-radius:9px;background:var(--g3);cursor:pointer;transition:all .2s;position:relative;margin-top:7px;display:block}.t-toggle.on{background:var(--purple)}.t-toggle::after{content:'';position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.3);transition:all .2s}.t-toggle.on::after{left:16px}
/* Style Icons settings - bigger cards + sliders (grille non utilisée actuellement, voir README) */
.si-settings-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}
.si-s-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;transition:all .2s}
.si-s-img{height:130px;display:flex;align-items:center;justify-content:center}
.si-s-info{padding:12px 14px}
.si-s-name{font-size:13px;font-weight:500;margin-bottom:3px}.si-s-style{font-size:12px;color:var(--g5);margin-bottom:10px}
.si-s-slider{-webkit-appearance:none;appearance:none;width:100%;height:2px;border-radius:2px;background:var(--g2);outline:none;cursor:pointer}.si-s-slider::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;border-radius:50%;background:var(--purple);cursor:pointer}
.si-s-val{font-size:11px;color:var(--g4);text-align:right;margin-top:3px}
/* Claia Plus */
.plus-panel{background:linear-gradient(135deg,rgba(137,165,255,.16),rgba(240,128,112,.06));border:1px solid rgba(137,165,255,.35);border-radius:var(--r-xl);padding:32px;text-align:center;margin-bottom:28px}
.plus-crown{font-size:36px;margin-bottom:12px}
.plus-ttl{font-family:var(--serif);font-size:28px;font-weight:300;margin-bottom:6px}
.plus-sub{font-size:14px;color:var(--g5);margin-bottom:24px;max-width:380px;margin-left:auto;margin-right:auto}
.plus-price{font-size:36px;font-weight:300;margin-bottom:4px;font-family:var(--serif)}.plus-price span{font-size:16px;color:var(--g5)}
.plus-perks{display:flex;flex-direction:column;gap:9px;text-align:left;max-width:320px;margin:20px auto 28px}
.plus-perk{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--g6)}.plus-perk::before{content:'✓';color:var(--green);font-weight:600;flex-shrink:0}
.plus-current{background:var(--g1);border:1px solid var(--border);border-radius:var(--r-lg);padding:16px 20px;display:flex;align-items:center;justify-content:space-between}
.pc-plan{font-size:14px}.pc-plan strong{color:var(--w)}.pc-plan .badge{display:inline-block;padding:3px 10px;background:var(--g2);border-radius:20px;font-size:11px;color:var(--g5);margin-left:8px}

/* Mobile settings horizontal nav */
.mob-stg-nav{display:none;overflow-x:auto;padding:12px 16px;gap:8px;border-bottom:1px solid var(--border);background:var(--bg-card);-webkit-overflow-scrolling:touch}
.mob-stg-nav::-webkit-scrollbar{display:none}
.mob-stg-pill{padding:6px 13px;border-radius:20px;border:1px solid var(--border-h);font-size:12px;color:var(--g5);cursor:pointer;white-space:nowrap;background:none;font-family:var(--sans);flex-shrink:0}
.mob-stg-pill.on{background:var(--purple);border-color:var(--purple);color:#1A1A1A}