app-user-settings{width:100%;max-width:960px;margin:0 auto;display:block}app-user-settings .settings-tabs{margin-bottom:20px;display:block}app-user-settings .settings-panel{background:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius-lg,12px);transition:border-color var(--transition-fast,.15s ease);margin-bottom:20px;padding:20px 24px;box-shadow:0 1px 3px #0000000a}app-user-settings .settings-panel>.alert{margin:16px 0 0}app-user-settings .settings-panel--danger{background:#ff3b300a;border-color:#ff3b3059}app-user-settings .settings-panel--rows{padding-top:8px;padding-bottom:8px}app-user-settings .setting-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px 16px;padding:14px 0;display:flex}app-user-settings .setting-row+app-user-settings .setting-row{border-top:1px solid var(--border-color)}app-user-settings .setting-row .chips{justify-content:flex-end}app-user-settings .settings-form{width:100%}app-user-settings .settings-form__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 20px;display:grid}app-user-settings .settings-form__grid .field{min-width:0;margin-bottom:0}app-user-settings .settings-form__grid .field--full{grid-column:1/-1}@media (max-width:640px){app-user-settings .settings-form__grid{grid-template-columns:minmax(0,1fr)}}app-user-settings .settings-form .alert{margin:16px 0 0}app-user-settings .settings-form__actions{justify-content:flex-end;margin-top:20px;display:flex}@media (max-width:640px){app-user-settings .settings-form__actions .btn{width:100%}}app-user-settings .pw-field{position:relative}app-user-settings .pw-field .input{min-height:44px;padding-right:44px}app-user-settings .pw-field__toggle{width:32px;height:32px;color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:8px;place-items:center;padding:0;display:grid;position:absolute;top:50%;right:6px;transform:translateY(-50%)}app-user-settings .pw-field__toggle:hover{color:var(--text-primary);background:var(--bg-hover,#0000000a)}app-user-settings .pw-field__toggle svg{width:18px;height:18px}app-user-settings .input.is-invalid{border-color:var(--color-error)}app-user-settings .field__error{font-size:var(--font-xs);color:var(--color-error);margin-top:6px;display:block}app-user-settings .switch__desc{font-size:var(--font-xs);color:var(--text-secondary);margin-top:3px;font-weight:400;line-height:1.45;display:block}app-user-settings .danger-row{justify-content:space-between;align-items:center;gap:16px;display:flex}app-user-settings .danger-row__body{flex:1;min-width:0}app-user-settings .danger-row .btn{flex-shrink:0}app-user-settings .danger-row__title{font-size:var(--font-base);color:var(--text-primary);font-weight:600}app-user-settings .danger-row__desc{font-size:var(--font-sm);color:var(--text-secondary);margin-top:4px;line-height:1.45}app-user-settings .notif-grid{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:20px;display:grid}@media (max-width:1100px){app-user-settings .notif-grid{grid-template-columns:1fr;gap:16px}}app-user-settings .notif-col{flex-direction:column;gap:20px;display:flex}@media (max-width:1100px){app-user-settings .notif-col{gap:16px}}app-user-settings .notif-card{margin-bottom:0;padding:20px}app-user-settings .panel__head{border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;padding-bottom:14px;display:flex}app-user-settings .panel__head--split{align-items:flex-start}app-user-settings .panel__head-titles{flex:1;min-width:0}app-user-settings .panel__title{color:var(--text-primary);align-items:center;gap:10px;margin:0;font-size:16px;font-weight:700;display:flex}app-user-settings .panel__title-icon{border-radius:8px;flex-shrink:0;place-items:center;width:28px;height:28px;display:inline-grid}app-user-settings .panel__title-icon app-icon{width:16px;height:16px}app-user-settings .panel__title-icon--pink{color:var(--primary,#e63946);background:#eb57571f}app-user-settings .panel__title-icon--amber{color:#d97706;background:#f59e0b1f}app-user-settings .panel__title-icon--blue{color:#2563eb;background:#3b82f61f}app-user-settings .panel__title-icon--purple{color:#7c3aed;background:#8b5cf61f}app-user-settings .panel__title-icon--shield{color:#dc2626;background:#dc26261f}app-user-settings .panel__sub{font-size:var(--font-xs);color:var(--text-secondary);margin-top:4px;line-height:1.45}app-user-settings .notif-card__actions{flex-shrink:0}app-user-settings .btn-text{font-size:var(--font-xs);cursor:pointer;background:0 0;border:none;border-radius:6px;align-items:center;padding:4px 10px;font-weight:600;transition:all .15s;display:inline-flex}app-user-settings .btn-text--primary{color:var(--primary);background:var(--primary-light,#e6394614)}app-user-settings .btn-text--primary:hover{background:#e6394626}app-user-settings .btn-text--muted{color:var(--text-secondary);background:var(--bg-hover,#0000000a)}app-user-settings .btn-text--muted:hover{color:var(--text-primary);background:#00000014}app-user-settings .notif-list{flex-direction:column;display:flex}app-user-settings .notif-switch{cursor:pointer;border-radius:10px;justify-content:flex-start;align-items:center;gap:14px;padding:10px 8px;transition:background-color .15s;display:flex}app-user-settings .notif-switch:hover{background-color:var(--bg-hover,#ffffff08)}app-user-settings .notif-switch+.notif-switch{border-top:1px solid var(--border-color)}app-user-settings .notif-switch__icon{background:var(--primary-light,#e6394614);width:36px;height:36px;color:var(--primary,#e63946);border-radius:10px;flex-shrink:0;place-items:center;display:grid}app-user-settings .notif-switch__icon app-icon{width:17px;height:17px}app-user-settings .notif-switch__icon--red{color:var(--primary,#e63946);background:#e639461a}app-user-settings .notif-switch__icon--orange{color:#d97706;background:#f59e0b1a}app-user-settings .notif-switch__icon--blue{color:#2563eb;background:#3b82f61a}app-user-settings .notif-switch__icon--purple{color:#7c3aed;background:#8b5cf61a}app-user-settings .notif-switch__icon--locked{color:#dc2626;background:#ef44441f}app-user-settings .notif-switch .switch__text{flex:1;min-width:0}app-user-settings .notif-switch .switch__title{font-size:var(--font-sm);color:var(--text-primary);font-weight:600;display:block}app-user-settings .notif-switch--channel{padding:10px 8px 6px}app-user-settings .notif-channel-row{align-items:flex-start;gap:14px;padding:10px 8px;display:flex}app-user-settings .notif-channel-row__body{flex:1;min-width:0}app-user-settings .notif-channel-row__header{justify-content:space-between;align-items:center;gap:8px;display:flex}app-user-settings .notif-channel-row+.notif-channel-block,app-user-settings .notif-channel-block+.notif-channel-block{border-top:1px solid var(--border-color)}app-user-settings .channel-hint{font-size:var(--font-xs);border-radius:6px;align-items:center;gap:8px;margin:0 8px 10px 58px;padding:6px 12px;line-height:1.4;display:flex}app-user-settings .channel-hint app-icon{flex-shrink:0;width:14px;height:14px}app-user-settings .channel-hint--warning{color:#b45309;background:#f59e0b1a;border:1px solid #f59e0b33}app-user-settings .channel-hint--info{color:#059669;background:#10b9811a;border:1px solid #10b98133}app-user-settings .channel-hint--muted{color:var(--text-secondary);background:#6b728014}app-user-settings .channel-hint--meta{color:var(--text-secondary);background:0 0;justify-content:space-between;align-items:center;gap:10px;padding:0 4px;display:flex}app-user-settings .channel-email-badge{font-size:var(--font-xs);color:var(--text-primary);align-items:center;gap:6px;font-weight:500;display:inline-flex}app-user-settings .channel-email-badge app-icon{width:13px;height:13px;color:var(--text-secondary)}app-user-settings .channel-email-limit{color:var(--text-secondary);opacity:.85;font-size:11px}app-user-settings .notif-locked{margin:0;padding:0;list-style:none}app-user-settings .notif-locked__row{align-items:center;gap:14px;padding:10px 8px;display:flex}app-user-settings .notif-locked__row+.notif-locked__row{border-top:1px solid var(--border-color)}app-user-settings .notif-locked__content{flex:1;min-width:0}app-user-settings .notif-locked__text{font-size:var(--font-sm);color:var(--text-primary);font-weight:600}app-user-settings .pill--mandatory{border-radius:var(--radius-full,9999px);color:#dc2626;cursor:help;background:#ef44441f;border:1px solid #ef444440;align-items:center;gap:5px;padding:3px 9px;font-size:12px;font-weight:600;display:inline-flex}app-user-settings .pill--mandatory app-icon{width:12px;height:12px}app-user-settings .pill--success{border-radius:var(--radius-full,9999px);color:#059669;background:#10b9811f;align-items:center;gap:4px;padding:2px 8px;font-size:11px;font-weight:600;display:inline-flex}app-user-settings .pill--success app-icon{width:11px;height:11px}app-user-settings .notif-saving-bar{background:var(--primary-light,#e6394614);color:var(--primary);font-size:var(--font-xs);border-radius:8px;align-items:center;gap:8px;margin-bottom:14px;padding:8px 14px;font-weight:600;animation:.2s app-user-settings__fadeIn;display:flex}app-user-settings .notif-saving-bar .loader--xs{border-width:2px;width:14px;height:14px}app-user-settings .notif-grid--skeleton{pointer-events:none}app-user-settings .skeleton-card{padding:20px}app-user-settings .skeleton-line{background:linear-gradient(90deg, var(--bg-hover,#ffffff0d) 25%, var(--border-color) 50%, var(--bg-hover,#ffffff0d) 75%);background-size:200% 100%;border-radius:4px;height:14px;animation:1.5s infinite app-user-settings__shimmer}app-user-settings .skeleton-line--head{width:45%;height:18px;margin-bottom:8px}app-user-settings .skeleton-line--sub{opacity:.7;width:70%;height:12px;margin-bottom:20px}app-user-settings .skeleton-row{background:linear-gradient(90deg, var(--bg-hover,#ffffff0a) 25%, var(--border-color) 50%, var(--bg-hover,#ffffff0a) 75%);background-size:200% 100%;border-radius:8px;height:44px;margin-bottom:12px;animation:1.5s infinite app-user-settings__shimmer}@keyframes app-user-settings__shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@keyframes app-user-settings__fadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}@media (max-width:640px){app-user-settings .settings-panel{border-radius:10px;padding:16px}app-user-settings .notif-card{padding:16px}app-user-settings .channel-hint{margin-left:0}app-user-settings .danger-row{flex-direction:column;align-items:flex-start}app-user-settings .danger-row .btn{width:100%}}app-user-settings .settings-link{align-self:flex-start;margin-top:16px}
