.settings-page{max-width:1180px;margin:0 auto;padding:24px 28px 80px;color:var(--text)}
.settings-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:28px 32px;border:1px solid var(--line);border-radius:24px;background:radial-gradient(ellipse at 95% 0,rgba(247,183,35,.14),transparent 55%),linear-gradient(120deg,var(--surface),color-mix(in srgb,var(--surface) 90%,#16825f))}
.settings-kicker{color:var(--accent);font-size:10px;font-weight:900;letter-spacing:.16em;margin:0 0 10px}.settings-hero h1{font-size:38px;letter-spacing:-.04em;margin:0}.settings-subtitle{color:var(--muted);margin:10px 0 0;font-size:14px}.settings-identity{font:inherit;font-size:13px;border:1px solid var(--line);background:var(--surface);color:var(--text);padding:12px 16px;border-radius:12px;cursor:pointer}
.settings-tabs{display:flex;gap:6px;overflow:auto;margin:18px 0 22px;padding-bottom:12px;border-bottom:1px solid var(--line)}.settings-tabs button{font:inherit;font-weight:700;font-size:13px;padding:10px 16px;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--muted);white-space:nowrap;cursor:pointer}.settings-tabs button[aria-selected=true]{background:var(--soft);color:var(--text);border-color:var(--line)}
.settings-content{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}.settings-content .profile-block{border:1px solid var(--line);border-radius:20px;padding:22px 24px;background:var(--surface);margin:0}.settings-content .profile-block__title{font-size:18px;margin:0 0 16px;letter-spacing:-.02em}.settings-content p{color:var(--muted);font-size:13px;line-height:1.55}.settings-content .settings-count{font-size:28px;font-weight:800;color:var(--text);letter-spacing:-.03em;margin:0 0 8px}
.settings-controls{display:flex;flex-wrap:wrap;gap:14px;align-items:flex-end;margin-top:18px}.settings-controls .profile-field{flex:1;min-width:145px;max-width:280px}.settings-page select,.settings-page input{font:inherit;color:var(--text);background:var(--bg);border:1px solid var(--line);padding:10px 12px;border-radius:10px;min-height:42px;width:100%;box-sizing:border-box}.settings-page input:focus,.settings-page select:focus{outline:2px solid var(--accent);outline-offset:2px}
.settings-event{display:grid;grid-template-columns:minmax(0,1fr) 145px 190px;gap:18px;align-items:center;padding:15px 0;border-top:1px solid var(--line)}.settings-event strong{font-size:14px}.settings-event p{margin:5px 0 0;font-size:12px}.settings-event-control>span{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.settings-event select{font-size:12px}.settings-event select:disabled{opacity:.5}.settings-footer{display:flex;gap:20px;justify-content:space-between;align-items:center}.settings-footer p,.settings-footnote{font-size:12px;color:var(--muted)}.settings-footer button{flex-shrink:0}
.settings-content .profile-channel{padding:16px 0}.settings-content .profile-form{max-width:580px}.settings-content .profile-feed{max-width:760px}.profile-settings-link{position:relative;display:flex;flex-direction:column;gap:6px;width:100%;text-align:left;padding:18px 20px;border:1px solid var(--line);border-radius:16px;background:var(--soft);color:var(--text);font:inherit;cursor:pointer}.profile-settings-link small{color:var(--muted);font-size:12px}.profile-settings-link b{position:absolute;right:20px;top:24px}.profile-head{padding-bottom:12px}.settings-page button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media(min-width:850px){.settings-overview{display:grid;grid-template-columns:1fr 1fr;column-gap:36px}.settings-overview h3{grid-column:1/-1}.settings-overview .settings-count{grid-column:1}.settings-overview>p:not(.settings-count){grid-column:1}.settings-overview .settings-controls{grid-column:2;grid-row:2/4;margin-top:0}}
@media(max-width:650px){.settings-page{padding:16px 14px 100px}.settings-hero{padding:22px;align-items:flex-start;flex-direction:column;gap:16px}.settings-hero h1{font-size:32px}.settings-tabs button{padding:10px 12px}.settings-content .profile-block{padding:18px}.settings-event{grid-template-columns:1fr 1fr;gap:10px}.settings-event>div:first-child{grid-column:1/-1}.settings-event select{width:100%}.settings-footer{align-items:flex-start;flex-direction:column;gap:8px}.settings-controls .profile-field{max-width:none}.settings-content .profile-form{grid-template-columns:1fr}.settings-content .profile-feed__line{flex-wrap:wrap}}

.settings-optional{margin-top:12px;border-top:1px solid var(--line)}.settings-optional summary{padding:18px 0 6px;font-size:13px;font-weight:700;cursor:pointer;color:var(--accent)}.settings-connection-note{grid-column:1/-1!important;font-size:12px!important;color:var(--accent)!important;margin:12px 0 0!important}

/* The profile enters from the right at every screen size. */
#profile-drawer{opacity:0;transition:opacity 300ms ease;overflow:hidden}
#profile-drawer.is-open{opacity:1}
#profile-drawer .drawer__box{animation:none;transform:translateX(100%);transition:transform 300ms cubic-bezier(.22,1,.36,1);height:100dvh;margin-top:0;border-radius:26px 0 0 26px}
#profile-drawer.is-open .drawer__box{transform:translateX(0)}
@media(prefers-reduced-motion:reduce){#profile-drawer,#profile-drawer .drawer__box{transition:none}}

.settings-page { padding-bottom:150px; }
.settings-subtitle,.settings-identity,.settings-tabs button { font-size:16px; }
.settings-kicker { font-size:12px; }
.settings-content p { font-size:16px; line-height:1.6; }
.settings-content .profile-block__title { font-size:22px; }
.settings-page .profile-field>span { font-size:15px; line-height:1.4; }
.settings-page .settings-controls { align-items:stretch; }
.settings-page .settings-controls .profile-field { display:flex; flex-direction:column; gap:10px; }
.settings-page select,.settings-page input { height:50px; min-height:50px; background:var(--bg); font-size:16px; border:1px solid var(--line); border-radius:12px; padding:12px 14px; }
.settings-event-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.settings-event-list>.profile-block__title { grid-column:1/-1; margin-bottom:0; }
.settings-event { grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; gap:18px 12px; padding:22px; border:1px solid var(--line); border-radius:16px; background:var(--soft); }
.settings-event>div:first-child { grid-column:1/-1; }
.settings-event strong { font-size:18px; line-height:1.4; }
.settings-event p { font-size:16px; margin-top:8px; }
.settings-event-control { display:flex; flex-direction:column; gap:8px; min-width:0; }
.settings-event-control>span { position:static; width:auto; height:auto; overflow:visible; clip:auto; white-space:normal; font-size:14px; color:var(--muted); }
.settings-event select { font-size:16px; }
.settings-optional { grid-column:1/-1; border:0; margin:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.settings-optional:not([open])>.settings-event { display:none; }
.settings-optional summary { grid-column:1/-1; font-size:16px; padding:12px 0; }
.settings-footer p,.settings-footnote,.settings-connection-note { font-size:15px!important; }
.settings-savebar { position:sticky; bottom:22px; z-index:15; display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:24px; padding:16px 22px; border:1px solid var(--line); border-radius:18px; background:var(--surface); box-shadow:0 8px 32px rgba(0,0,0,.22); }
.settings-savebar p { font-size:16px; margin:0; }
.settings-savebar .btn { width:auto; flex:none; font-size:16px; }
.settings-savebar .btn:disabled { opacity:.55; cursor:default; }
.settings-content .settings-access { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.settings-access>.profile-block__title { grid-column:1/-1; margin:0; }
.settings-access-tile { border:1px solid var(--line); border-radius:16px; padding:24px; background:var(--soft); }
.settings-content .settings-access-label { margin:0 0 12px; font-size:18px; font-weight:700; color:var(--text); }
.settings-content .settings-login { font-size:30px; font-weight:800; color:var(--text); margin:0; }
.settings-access-tile>.btn { width:auto; margin-top:12px; }
.settings-password { margin-top:20px; }
.settings-leave-dialog { width:min(520px,calc(100vw - 40px)); box-sizing:border-box; background:var(--surface); color:var(--text); border:1px solid var(--line); border-radius:22px; padding:28px; }
.settings-leave-dialog::backdrop { background:rgba(0,0,0,.6); }
.settings-leave-dialog h2 { font-size:24px; margin-top:0; }
.settings-leave-dialog p { font-size:16px; line-height:1.6; }
.settings-leave-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
@media(max-width:750px) { .settings-event-list,.settings-optional,.settings-content .settings-access { grid-template-columns:1fr; } .settings-savebar { bottom:85px; gap:12px; padding:14px; flex-wrap:wrap; } .settings-savebar .btn { flex:1; } .settings-event { padding:18px; } }

.settings-page,.settings-leave-dialog { --text:var(--ink); --muted:var(--ink-soft); --surface:var(--paper-card); --soft:var(--paper-soft); --bg:var(--paper-card); }
.settings-page .settings-controls select,.settings-page .settings-controls input { background-color:var(--paper-soft); }

.settings-page .settings-controls input,.settings-page .settings-controls select { background:var(--paper-soft)!important; color:var(--ink)!important; }

.settings-identity { display:flex; align-items:center; gap:16px; flex-shrink:0; padding:18px 22px; text-align:left; border-radius:18px; background:var(--paper-card); }
.settings-identity__avatar { display:flex; align-items:center; justify-content:center; width:64px; height:64px; flex:none; border-radius:50%; background:var(--tint,#1f7a5a); color:#fff; font-size:24px; font-weight:800; }
.settings-identity__copy { display:flex; flex-direction:column; gap:6px; }
.settings-identity__copy strong { font-size:20px; line-height:1.3; }
.settings-identity__copy>span { color:var(--ink-soft); font-size:15px; }
.settings-identity:hover { border-color:var(--accent); }
.profile-settings-button { width:auto; align-self:flex-start; padding:12px 18px; font-size:16px; }
@media(max-width:850px) { .settings-hero { flex-wrap:wrap; } }
@media(max-width:650px) { .settings-identity { width:100%; box-sizing:border-box; padding:16px; } .settings-identity__avatar { width:56px; height:56px; font-size:22px; } }

.settings-hero{background:var(--paper-soft);color:var(--ink)}
.settings-identity{background:color-mix(in srgb,var(--accent) 8%,var(--paper-card));color:var(--ink);border-color:color-mix(in srgb,var(--accent) 24%,var(--line))}
.settings-identity__avatar{background:color-mix(in srgb,var(--accent) 18%,var(--paper-card));color:var(--ink)}
.settings-savebar[hidden]{display:none}
.settings-savebar{min-height:64px;box-sizing:border-box;padding:10px 20px;gap:16px}
.settings-savebar p{font-size:18px;line-height:1.4;align-self:center}
.settings-savebar .btn{align-self:center;min-height:44px;margin:0;line-height:1.2;padding:12px 20px;font-size:18px;opacity:1}
.settings-channel-badge{display:inline-flex;align-items:center;gap:9px;padding:8px 12px;border:1px solid var(--line);border-radius:10px;background:var(--paper-soft);color:var(--ink);font-size:16px;font-weight:700;max-width:100%;overflow-wrap:anywhere}
.settings-channel-badge svg{width:20px;height:20px;flex:none}
.settings-channel-checks{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;flex-wrap:wrap}
.settings-content .settings-channel-checks .btn{width:auto;flex:none;margin:0;min-height:42px;padding:10px 16px;font-size:16px}
#profile-drawer.profile-popup{align-items:center;justify-content:center;background:rgba(10,25,20,.24);backdrop-filter:none;-webkit-backdrop-filter:none;transition:opacity 180ms ease}
#profile-drawer.profile-popup .drawer__box{width:min(440px,calc(100vw - 32px));height:auto;max-height:calc(100dvh - 48px);border:1px solid var(--line);border-radius:22px;transform:translateY(8px);transition:transform 180ms ease;box-shadow:0 20px 60px rgba(0,0,0,.2);color:var(--ink)}
#profile-drawer.profile-popup.is-open .drawer__box{transform:translateY(0)}
#profile-drawer.profile-popup .drawer__body{padding:22px;gap:18px}
#profile-drawer.profile-popup .drawer__foot{padding:16px 22px}
#profile-drawer.profile-popup .profile-block{margin:0;padding:18px;border-radius:16px;background:var(--paper-soft)}
#profile-drawer.profile-popup .profile-settings-button{display:none}
#profile-drawer.profile-popup .profile-head__name{font-size:21px}
#profile-drawer.profile-popup .profile-form input{font-size:17px}
#profile-drawer.profile-popup .profile-avatar{background:color-mix(in srgb,var(--accent) 18%,var(--paper-card));color:var(--ink)}
@media(max-width:600px){.settings-savebar{justify-content:center;text-align:center}.settings-savebar .btn{flex:none}.settings-channel-checks{justify-content:flex-start}}
