/* Profile-only subtitle appearance panel. The rest of Profile keeps its layout. */
.subtitle-style-settings { min-width:0; }
.subtitle-style-toggle {
    width:100%; min-height:60px; color:var(--text-1);
    font:inherit; text-align:left; cursor:pointer;
}
.subtitle-style-toggle .setting-label { display:block; }
.subtitle-style-chevron { flex:none; color:var(--text-2); font-size:13px; transition:transform .15s ease; }
.subtitle-style-toggle[aria-expanded="true"] .subtitle-style-chevron { transform:rotate(180deg); }
.subtitle-style-panel {
    margin-top:2px; padding:15px; border-radius:var(--radius-md);
    border:1px solid var(--border); background:var(--bg-card);
}
.subtitle-style-panel[hidden] { display:none!important; }
.subtitle-style-preview {
    min-height:138px; padding:17px 12px 22px; display:flex; flex-direction:column;
    align-items:center; justify-content:center; gap:7px; text-align:center;
    background:#10121a; border-radius:12px; overflow-wrap:anywhere;
}
.subtitle-style-preview-kicker { margin-bottom:8px; color:var(--text-3); font-size:11px; }
.subtitle-style-preview-original {
    font-size:calc(20px * var(--rs-subtitle-preview-original-scale, 1));
    color:var(--rs-subtitle-preview-original-color, #8fd3ff);
    line-height:1.65; font-weight:600;
    text-shadow:0 1px 3px #000,0 0 5px #000;
}
.subtitle-style-preview-active { color:#ff6b84; }
.subtitle-style-preview-translation {
    font-size:calc(14px * var(--rs-subtitle-preview-translation-scale, 1));
    color:var(--rs-subtitle-preview-translation-color, rgba(255,255,255,.92));
    line-height:1.6; font-weight:600; text-shadow:0 1px 3px #000,0 0 5px #000;
}
.subtitle-style-tabs {
    display:grid; grid-template-columns:1fr 1fr; margin:16px 0;
    padding:4px; gap:4px; border-radius:12px; background:rgba(255,255,255,.055);
}
.subtitle-style-tabs button {
    min-height:42px; border:0; border-radius:9px; color:var(--text-2);
    background:transparent; font:inherit; font-size:13px; font-weight:600; cursor:pointer;
}
.subtitle-style-tabs button[aria-selected="true"] { color:var(--text-1); background:rgba(255,255,255,.12); }
.subtitle-style-control-label { font-size:13px; font-weight:600; color:var(--text-1); margin:13px 0 9px; }
.subtitle-style-sizes { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; }
.subtitle-style-sizes button {
    min-height:43px; border:1px solid var(--border-hi); border-radius:9px; padding:5px 4px;
    background:var(--rs-surface-1,#171724); color:var(--text-2);
    font:inherit; font-size:13px; cursor:pointer;
}
.subtitle-style-sizes button[aria-pressed="true"] {
    border-color:var(--rs-accent,#e94560);
    background:rgba(233,69,96,.11); color:var(--text-1);
}
.subtitle-style-colors { display:flex; flex-wrap:wrap; align-items:center; gap:11px; padding:3px 0 9px; }
.subtitle-style-colors button {
    width:44px; height:44px; padding:7px; flex:none; border-radius:50%;
    border:2px solid transparent; background:transparent; cursor:pointer;
}
.subtitle-style-colors button[aria-pressed="true"] { border-color:var(--text-1); }
.subtitle-style-colors button span { display:block; width:26px; height:26px; border-radius:50%; }
.subtitle-style-tabs button:focus-visible,
.subtitle-style-toggle:focus-visible,
.subtitle-style-sizes button:focus-visible,
.subtitle-style-colors button:focus-visible,
.subtitle-style-footer button:focus-visible { outline:2px solid #8fd3ff; outline-offset:2px; }
.subtitle-style-footer { display:flex; align-items:center; gap:12px; justify-content:space-between; margin-top:16px; }
.subtitle-style-footer small { max-width:35ch; font-size:11px; line-height:1.5; color:var(--text-3); }
.subtitle-style-footer button { min-height:40px; padding:7px 12px; flex:none; font-size:12px; }
.subtitle-style-status { color:var(--rs-danger,#ff6b6b); font-size:12px; line-height:1.4; }
.subtitle-style-status:empty { display:none; }
@media (max-width:360px) {
    .subtitle-style-panel { padding:12px; }
    .subtitle-style-colors { gap:7px; }
    .subtitle-style-footer { align-items:flex-start; flex-direction:column; }
    .subtitle-style-footer button { align-self:flex-end; }
}
