/* Akış 2.0: shared light-first design language for public, member and staff UI. */
:root,
body[data-theme=light]{
  color-scheme:light;
  --bg:#f7f8f5;
  --surface:#fff;
  --surface-2:#f3f7f3;
  --surface-3:#e8f0eb;
  --text:#20312f;
  --muted:#667571;
  --line:#e1e8e2;
  --accent:#247a68;
  --accent-strong:#196554;
  --teal:#247a68;
  --warm:#d97755;
  --shadow:0 18px 46px #264d3d12;
  --soft-shadow:0 8px 24px #264d3d0b;
  font-family:Manrope,DM Sans,system-ui,sans-serif;
}
body[data-theme=dark]{
  color-scheme:dark;
  --bg:#142321;
  --surface:#1c302c;
  --surface-2:#233b35;
  --surface-3:#2b463e;
  --text:#f4f8f3;
  --muted:#b1c4bb;
  --line:#3b554c;
  --accent:#90d5b5;
  --accent-strong:#b0ebcd;
  --teal:#90d5b5;
  --warm:#e4a486;
  --shadow:0 20px 52px #08140f70;
  --soft-shadow:0 8px 24px #08140f44;
}
html{font-size:16px}
body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}
button,input,select,textarea{font-family:inherit}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
button{transition:background-color .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease}
button:active{transform:scale(.985)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.eyebrow{color:var(--accent);letter-spacing:.12em}
.button{background:var(--accent);border-color:var(--accent);color:#fff;border-radius:14px;box-shadow:0 7px 18px #247a6826}
.button:hover{background:var(--accent-strong);box-shadow:0 10px 22px #247a6833}
.button.secondary{background:var(--surface);border-color:var(--line);color:var(--text);box-shadow:none}
.button.ghost{color:var(--accent);border-color:var(--line)}
.brand,.brand-icon,.brand-dot,.rail-logo{color:var(--accent)}
.public-nav{border-color:var(--line)}
.public-nav a:first-child{color:var(--accent)}
.public-hero{max-width:820px}
.public-hero h1{font-weight:800;color:var(--text)}
.public-card{box-shadow:var(--soft-shadow);border-radius:18px}

/* Welcome and authentication */
.auth-screen{grid-template-columns:minmax(0,1fr) minmax(420px,.82fr);background:var(--bg)}
.auth-art{background:radial-gradient(circle at 84% 22%,#d7eee1 0,transparent 35%),radial-gradient(circle at 8% 90%,#fff0e6 0,transparent 35%),#f0f7f1;color:var(--text);padding:clamp(32px,6vw,104px)}
.auth-art:after{border-color:#93c2a938;width:660px;height:660px;left:43%;top:12%}
.brand-mark{color:var(--accent);font-size:3rem;margin-bottom:clamp(44px,9vh,110px)}
.auth-art h1{max-width:700px;font-size:clamp(3.2rem,5.4vw,6.5rem);line-height:1.03;letter-spacing:-.08em}
.auth-art h1 em{color:var(--accent)}
.auth-art>p:not(.eyebrow){color:#566e64;max-width:550px}
.auth-art small{color:#627a6e}
.auth-orbit span{color:#325b4c;background:#ffffffbd;border:1px solid #c9dfd1;box-shadow:var(--soft-shadow)}
.auth-panel{background:var(--surface);border-left:1px solid var(--line)}
.auth-box{width:min(100%,440px)}
.auth-box h2{font-size:clamp(2rem,3vw,2.7rem);line-height:1.12}
.auth-box>p:not(.eyebrow){line-height:1.6}
.auth-tabs{gap:10px;border:0;margin:30px 0 24px}
.auth-tabs button{flex:1;margin:0;border:1px solid var(--line);border-radius:12px;padding:12px 6px;background:var(--surface);font-size:.78rem}
.auth-tabs button.active{color:var(--accent);background:var(--surface-2);border-color:#b6d5c4}
.auth-box input,.stack-form input{border-radius:13px;background:var(--surface);border-color:#dce6de}
.auth-box input:focus,.stack-form input:focus{border-color:var(--accent)}
.auth-note{color:var(--muted)}
.form-error{color:#b93c3b}
body[data-theme=dark] .auth-art{background:radial-gradient(circle at 84% 22%,#254c3b 0,transparent 35%),#1a3029}
body[data-theme=dark] .auth-art>p:not(.eyebrow),body[data-theme=dark] .auth-art small{color:var(--muted)}
body[data-theme=dark] .auth-orbit span{background:#1d3a2f;color:var(--text);border-color:var(--line)}

/* Member workspace */
.shell{grid-template-columns:72px minmax(285px,320px) minmax(0,1fr) 250px}
.rail,body[data-theme=light] .rail{background:var(--surface);border-color:var(--line);padding:20px 10px;gap:8px}
.rail-logo{height:52px;margin-bottom:28px}
.rail-item,.rail-avatar{border-radius:15px;color:var(--muted)}
.rail-item:hover,.rail-item.active{background:var(--surface-3);color:var(--accent)}
.rail-item[data-view=inbox],.bottom-nav button[data-view=inbox]{position:relative}
.nav-badge{position:absolute;top:2px;right:1px;min-width:18px;height:18px;padding:0 4px;display:grid;place-items:center;border-radius:9px;background:#d85c53;color:#fff;font-size:.62rem;font-weight:800;line-height:1;box-shadow:0 0 0 2px var(--surface)}
.nav-badge[hidden]{display:none}
.rail-avatar{background:var(--accent);color:#fff}
.sidebar{background:var(--bg);border-color:var(--line)}
.sidebar-top{height:78px;padding:20px 23px}
.sidebar-content{padding:28px 16px}
.section-heading h2{font-size:1.75rem}
.soft-pill{background:var(--surface);border:1px solid var(--line);color:var(--muted)}
.search-wrap{background:var(--surface);border-radius:13px;height:46px;box-shadow:var(--soft-shadow)}
.category-tabs{gap:8px;padding:19px 0 14px}
.category-tab{background:var(--surface);border-color:var(--line);min-height:37px}
.category-tab.active{background:var(--accent);border-color:var(--accent);color:#fff}
.room-list{gap:7px}
.room-card{min-height:69px;padding:12px;border-color:transparent;border-radius:15px}
.room-card:hover,.room-card.selected{background:var(--surface);border-color:var(--line);box-shadow:var(--soft-shadow)}
.room-card.selected{border-left:3px solid var(--accent)}
.room-icon{border-radius:13px;width:45px;height:45px}
.room-card-text strong{font-size:.89rem;letter-spacing:-.015em}
.room-card-text small{font-size:.72rem}
.room-unread{background:var(--accent);color:#fff}
.sidebar-tip,body[data-theme=light] .sidebar-tip{background:linear-gradient(145deg,#e9f3eb,#f8fbf8);border-color:#d4e6da;border-radius:19px;padding:20px;margin-top:24px}
.sidebar-tip>span{color:var(--accent)}
.sidebar-tip a{color:var(--accent)}
.sidebar-user{height:76px;background:var(--bg);border-color:var(--line)}
.avatar{background:#a8c5b4;color:#184537;border-radius:14px}
.main-area{background:var(--surface)}
.chat-header{height:78px;background:var(--surface);padding:15px clamp(18px,3vw,42px)}
.chat-heading h1{font-size:1.1rem}
.chat-heading p{font-size:.75rem}
.people-button{background:var(--surface-2);color:var(--accent);border-color:var(--line);min-height:38px}
.messages{padding:30px clamp(18px,4vw,56px);gap:18px;background:radial-gradient(circle at 92% 7%,#e9f5ec94,transparent 35%),var(--surface)}
.message-row{max-width:840px}
.message-content{max-width:min(78%,610px)}
.message-meta button{font-size:.79rem}
.bubble{background:var(--surface);border-color:var(--line);border-radius:5px 16px 16px 16px;box-shadow:var(--soft-shadow);padding:12px 16px;font-size:.92rem}
.message-row.own .bubble{background:#e6f4ea;border-color:#cbe4d2;color:#204739}
body[data-theme=dark] .messages{background:var(--surface)}
body[data-theme=dark] .message-row.own .bubble{background:#29493b;border-color:#436b54;color:var(--text)}
.message-reply-quote,.reply-preview{background:var(--surface-2);border-left-color:var(--accent)}
.message-reply-quote strong,.reply-preview strong{color:var(--accent)}
.message-actions{margin-top:20px}
.message-actions button{color:var(--muted);min-width:29px;min-height:29px}
.message-actions button:hover{color:var(--accent)}
.reaction-chip{background:var(--surface-2);border-color:var(--line)}
.reaction-chip.active{color:var(--accent);border-color:var(--accent)}
.composer-wrap{background:var(--surface);padding:16px clamp(18px,4vw,56px) 18px}
.composer{max-width:850px;background:var(--surface);border-color:#cbded1;border-radius:18px;box-shadow:0 4px 22px #254d3710}
.composer input{font-size:.91rem}
.composer button{background:var(--accent);color:#fff;border-radius:13px;min-width:42px;min-height:42px}
.people-panel{background:var(--bg);border-color:var(--line)}
.person-row{min-height:48px}
.person-row:hover{background:var(--surface-2);border-radius:11px}
.connection-banner{background:#fff2e6;color:#8a4f20;border-color:#f3d2af}
.typing-indicator{color:var(--accent)}

/* DM, profile, settings, invitations and dialogs */
.panel-view{background:var(--bg);padding:44px clamp(24px,5vw,78px)}
.panel-header{margin-bottom:26px}
.panel-header h1{font-size:clamp(2rem,4vw,3rem)}
.empty-card,.feature-card,.settings-card,.profile-card,.admin-card{background:var(--surface);border:1px solid var(--line);box-shadow:var(--soft-shadow);border-radius:22px}
.feature-symbol{background:var(--surface-3);color:var(--accent)}
.note-box{background:var(--surface-2)}
.dm-list-row{min-height:70px;background:var(--surface);box-shadow:var(--soft-shadow)}
.dm-list-row:hover,.dm-list-row.active{background:var(--surface-2);border-color:var(--accent)}
.dm-list-text strong{display:flex;align-items:center;gap:8px}
.dm-unread{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:var(--accent);color:#fff;font-size:.66rem;line-height:1}
.dm-bubble.own small{color:var(--accent)}
.dm-person{display:flex;align-items:center;gap:12px;max-width:760px}
.dm-person .icon-button{display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--text);font-size:1.25rem;flex:none}
.dm-private-label{margin-left:auto;color:var(--muted);font-size:.72rem;font-weight:500}
.dm-bubble.own{background:#e6f4ea;color:#204739}
body[data-theme=dark] .dm-bubble.own{background:#29493b;color:var(--text)}
.history-more{align-self:center;flex:none;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--accent);padding:10px 17px;font-size:.76rem;font-weight:800;cursor:pointer;box-shadow:var(--soft-shadow)}.history-more:hover{border-color:var(--accent);background:var(--surface-2)}.history-more:disabled{opacity:.65;cursor:wait}.history-more[hidden]{display:none}
.message-search-form{max-width:850px;display:flex;flex-direction:column;gap:11px;background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:20px;box-shadow:var(--soft-shadow)}.message-search-form>label{font-size:.78rem;font-weight:800}.message-search-input-row{display:flex;gap:9px}.message-search-input-row input{min-width:0;flex:1;padding:0 15px;min-height:46px;border:1px solid var(--line);border-radius:12px;background:var(--surface-2);color:var(--text);font:inherit}.message-search-scopes{border:0;padding:4px 0 0;margin:0;display:flex;gap:9px;flex-wrap:wrap}.message-search-scopes legend{font-size:.73rem;color:var(--muted);margin-bottom:8px}.message-search-scopes label{display:flex;align-items:center;gap:5px;border:1px solid var(--line);border-radius:20px;padding:8px 11px;font-size:.74rem;font-weight:700;cursor:pointer}.message-search-scopes input{accent-color:var(--accent)}.message-search-status{color:var(--muted);font-size:.8rem;margin:18px 0}.message-search-results{max-width:850px;display:flex;flex-direction:column;gap:9px}.message-search-result{width:100%;display:flex;flex-direction:column;gap:10px;text-align:left;padding:18px 20px;background:var(--surface);border:1px solid var(--line);border-radius:16px;color:var(--text);box-shadow:var(--soft-shadow);cursor:pointer}.message-search-result:hover,.message-search-result:focus-visible{border-color:var(--accent);background:var(--surface-2)}.message-search-result-meta{display:flex;align-items:center;justify-content:space-between;gap:12px}.message-search-result-meta strong{font-size:.82rem}.message-search-result-meta small,.message-search-result-author{color:var(--muted);font-size:.7rem}.message-search-result-body{font-size:.86rem;line-height:1.55;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.message-search-result-author{color:var(--accent);font-weight:700}#message-search-more{margin:18px 0 45px}.search-focused .bubble,.search-focused.dm-bubble{outline:3px solid color-mix(in srgb,var(--accent) 55%,transparent);outline-offset:3px}@media(max-width:680px){.message-search-form{padding:16px}.message-search-result{padding:16px}.message-search-result-meta{align-items:flex-start;flex-direction:column;gap:3px}.message-search-input-row .button{min-width:70px}}
.dm-message-actions{display:flex;gap:8px;margin-top:5px}.dm-message-actions button{border:0;border-radius:7px;background:transparent;color:var(--accent);font-size:.72rem;font-weight:700;padding:5px 7px;cursor:pointer}.dm-message-actions button:hover{background:var(--surface-3)}
.message-change-dialog .dialog-card{width:min(460px,calc(100vw - 32px));display:flex;flex-direction:column;gap:12px}.message-change-dialog h2{font-size:1.55rem;letter-spacing:-.04em;margin:0}.message-change-dialog p{font-size:.83rem;line-height:1.55;margin:0 0 4px}.message-change-dialog label{font-weight:700;font-size:.8rem}.message-change-dialog textarea{min-height:120px;width:100%;resize:vertical;padding:12px 14px;background:var(--surface-2);color:var(--text);border:1px solid var(--line);border-radius:12px;font:inherit;line-height:1.5}.message-change-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:6px}.message-change-actions .button{min-height:42px;font-size:.79rem}.message-change-actions .danger{background:#9e3442;color:#fff}@media(max-width:680px){.message-change-actions{flex-direction:column-reverse}.message-change-actions .button{width:100%}}
.settings-card select{background:var(--surface)}
.password-card>p{margin:0;color:var(--muted);font-size:.86rem;line-height:1.55;max-width:56ch}.password-card h2{margin:0}.password-card form{display:flex;flex-direction:column;align-items:flex-start;gap:9px;width:100%}.password-card label{margin-top:8px}.password-card input{width:min(100%,500px);height:48px;border:1px solid var(--line);border-radius:12px;background:var(--surface-2);color:var(--text);padding:0 14px}.password-card #password-status{min-height:1.2em;margin:3px 0 0;color:var(--muted);font-size:.78rem;line-height:1.45}
.profile-bio{margin-top:8px;max-width:58ch;overflow-wrap:anywhere}
.profile-edit{margin-top:18px}
.profile-edit h2{margin:0 0 4px}
.profile-edit textarea{width:100%;min-height:104px;resize:vertical;background:var(--surface);color:var(--text);border:1px solid var(--line);border-radius:13px;padding:13px 15px;font-size:.92rem;line-height:1.5}
.profile-edit small{color:var(--muted)}
.dialog-card{background:var(--surface);border-color:var(--line);box-shadow:var(--shadow)}
.dialog-bio{overflow-wrap:anywhere;line-height:1.55}
dialog::backdrop{background:#10251a94}
#toast{background:#1d4234;color:#fff;box-shadow:var(--shadow)}

/* Staff workspace uses the same design tokens with higher information density. */
.admin-view,body[data-theme=light] .admin-view,body[data-theme=dark] .admin-view{
  --admin-bg:var(--bg);
  --admin-card:var(--surface);
  --admin-card-raised:var(--surface-2);
  --admin-border:var(--line);
  --admin-muted:var(--muted);
  --admin-text:var(--text);
  --admin-accent:var(--accent);
  --admin-accent-dark:#fff;
}
.admin-topbar{background:var(--surface)}
.admin-metric,.admin-workspace{box-shadow:var(--soft-shadow)}
.admin-metric{border-radius:18px}
.admin-record{border-radius:13px}
.admin-action.danger{color:#af4f4c;border-color:#e6b9b5}
.admin-status.warning{color:#9a5d2b;background:#fff0e0}
.admin-status.success{color:var(--accent);background:var(--surface-3)}

@media(max-width:1180px){.shell{grid-template-columns:70px minmax(260px,290px) minmax(0,1fr)}}
@media(min-width:681px) and (max-width:1180px){body.people-open .people-panel{display:block;position:fixed;right:0;top:0;bottom:0;width:280px;z-index:30;box-shadow:var(--shadow)}body.people-open #close-people{display:grid;place-items:center}}
@media(max-width:850px){.auth-screen{grid-template-columns:1fr}.auth-panel{border-left:0}.shell{grid-template-columns:68px minmax(245px,270px) minmax(0,1fr)}}
@media(max-width:680px){
  .app-body{overflow:hidden}
  .auth-panel{min-height:100dvh;padding:24px 22px calc(32px + env(safe-area-inset-bottom))}
  .auth-box{width:100%;max-width:430px}
  .auth-tabs button{min-height:48px}
  .shell{display:block}
  .mobile-discover{background:var(--bg);padding:29px 18px calc(92px + env(safe-area-inset-bottom))}
  .mobile-discover h1{font-size:2.1rem}
  .mobile-discover .room-card{min-height:82px;border-radius:17px;box-shadow:var(--soft-shadow);padding:14px}
  .room-card-text small{font-size:.78rem}
  .bottom-nav{background:var(--surface);box-shadow:0 -7px 30px #193a2810}
  .bottom-nav button{min-width:44px;min-height:56px}
  .bottom-nav .nav-badge{top:4px;right:calc(50% - 23px)}
  .chat-header{height:69px;padding:10px 14px}
  .chat-header .room-icon{width:39px;height:39px}
  .messages{padding:20px 14px;gap:15px;background:var(--surface)}
  .message-content{max-width:calc(100vw - 103px)}
  .bubble{font-size:.9rem}
  .composer-wrap{padding:10px 12px calc(10px + env(safe-area-inset-bottom))}
  .composer{max-width:none}
  .composer input{font-size:16px}
  .panel-view{padding:30px 18px calc(92px + env(safe-area-inset-bottom))}
  body.dm-open .shell{padding-bottom:0}
  body.dm-open .bottom-nav{display:none}
  body.dm-open #inbox-view{padding:0;height:100dvh;background:var(--surface)}
  body.dm-open #inbox-view>.panel-header,body.dm-open #dm-list{display:none}
  body.dm-open #dm-panel{height:100%;display:flex;flex-direction:column;min-height:0}
  body.dm-open .dm-person{height:69px;min-height:69px;margin:0;padding:10px 14px;border-bottom:1px solid var(--line);background:var(--surface)}
  body.dm-open .dm-messages{height:auto;flex:1;min-height:0;max-width:none;border:0;border-radius:0;margin:0;padding:20px 14px}
  body.dm-open #dm-composer{margin:10px 12px calc(10px + env(safe-area-inset-bottom));max-width:none;flex:none}
  body.dm-open #dm-input{font-size:16px}
  .empty-card,.feature-card,.settings-card,.profile-card{padding:22px}
  .admin-view{background:var(--bg)}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;scroll-behavior:auto!important}}
.account-data-card{display:flex;flex-direction:column;align-items:flex-start;gap:12px}.account-data-card h2{margin:0}.account-data-card p{margin:0;color:var(--muted);line-height:1.55;max-width:54ch;font-size:.88rem}.account-data-card .button{margin-top:3px}.account-data-card small{color:var(--muted);font-size:.72rem;line-height:1.45}
.rail-item[data-view=notifications],.bottom-nav button[data-view=notifications]{position:relative}.notification-badge{background:var(--accent)}.notification-header{display:flex;align-items:end;justify-content:space-between;gap:18px}.notification-header .button{font-size:.75rem;min-height:40px;white-space:nowrap}.notification-list{display:flex;flex-direction:column;gap:10px;max-width:850px}.notification-card{display:flex;align-items:center;gap:15px;background:var(--surface);border:1px solid var(--line);border-radius:17px;padding:17px 19px;box-shadow:var(--soft-shadow)}.notification-card.unread{border-color:color-mix(in srgb,var(--accent) 48%,var(--line));background:color-mix(in srgb,var(--accent) 5%,var(--surface))}.notification-icon{width:40px;height:40px;display:grid;place-items:center;flex:none;border-radius:12px;background:var(--surface-3);color:var(--accent);font-size:1.15rem}.notification-content{display:flex;flex:1;min-width:0;flex-direction:column;gap:6px}.notification-content strong{font-size:.85rem;line-height:1.35}.notification-content small{font-size:.7rem;color:var(--muted)}.notification-action{font-size:.72rem;min-height:36px;padding:7px 12px}.notification-action:disabled{opacity:.55;cursor:default}
@media(max-width:680px){.notification-header{align-items:flex-start;flex-direction:column}.notification-header .button{margin-top:-8px}.notification-card{padding:15px;gap:11px;flex-wrap:wrap}.notification-icon{width:35px;height:35px}.notification-content{flex-basis:calc(100% - 50px)}.notification-action{margin-left:46px}.bottom-nav button[data-view=notifications] .nav-badge{top:4px;right:calc(50% - 23px)}}
