:root{
  font-family:Inter,Segoe UI,system-ui,sans-serif;
  --bg-void:#fff;--bg-primary:#fff;--bg-secondary:#fff;--bg-tertiary:#f1f3f4;
  --bg-panel:rgba(255,255,255,.96);--bg-panel-solid:#fff;
  --blue:#1a73e8;--blue-light:#4285f4;--green:#1e8e3e;--red:#d93025;--orange:#f9ab00;--cyan:#26c6da;--purple:#7e57c2;
  --text:#202124;--text2:#5f6368;--muted:#80868b;
  --border:rgba(60,64,67,.16);--border2:rgba(60,64,67,.09);--shadow:0 8px 28px rgba(60,64,67,.20);
}
body.theme-dark{
  --bg-void:#0b1118;--bg-primary:#0d141c;--bg-secondary:#121c27;--bg-tertiary:#182431;
  --bg-panel:rgba(13,20,28,.96);--bg-panel-solid:#101923;
  --blue:#64a5ff;--blue-light:#8bbdff;--green:#61c77a;--red:#ff6b64;--orange:#ffbf47;--cyan:#52cbd7;--purple:#ad8ee6;
  --text:#edf3fa;--text2:#b7c3cf;--muted:#8494a5;
  --border:rgba(190,205,220,.18);--border2:rgba(190,205,220,.09);--shadow:0 8px 28px rgba(0,0,0,.42);
}
body.theme-night{
  --bg-void:#050000;--bg-primary:#090000;--bg-secondary:#100202;--bg-tertiary:#180505;
  --bg-panel:rgba(8,0,0,.97);--bg-panel-solid:#0d0101;
  --blue:#d94a4a;--blue-light:#ff6969;--green:#b83d3d;--red:#ff5252;--orange:#d76b45;--cyan:#c94a4a;--purple:#9f3e4a;
  --text:#f3dede;--text2:#c78e8e;--muted:#8f5f5f;
  --border:rgba(220,70,70,.24);--border2:rgba(220,70,70,.11);--shadow:0 8px 28px rgba(0,0,0,.62);
}
*{box-sizing:border-box}html,body,#app{margin:0;height:100%;background:var(--bg-void);color:var(--text)}body{overflow:hidden;transition:background .15s,color .15s}button,input,textarea,select{font:inherit}
header{height:58px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 14px;border-bottom:1px solid var(--border);background:var(--bg-panel);backdrop-filter:blur(18px) saturate(1.3)}
.brand{display:flex;align-items:center;gap:10px;min-width:0}.brand b{letter-spacing:.08em}.brand small,#identity small{display:block;color:var(--muted);font-size:11px;margin-top:2px}.shield{display:grid;place-items:center;width:34px;height:38px;background:var(--blue);color:#fff;font-weight:900;clip-path:polygon(50% 0,94% 15%,88% 70%,50% 100%,12% 70%,6% 15%)}
.headerRight{display:flex;align-items:center;gap:8px;min-width:0}
.talavaLangSelect{width:auto;min-width:58px;height:30px;padding:0 6px;border:1px solid var(--border);background:var(--bg-panel-solid);color:var(--text2);border-radius:8px;font:800 9px/28px ui-monospace,SFMono-Regular,Consolas,monospace;cursor:pointer}.talavaLangSelect:hover,.talavaLangSelect:focus{border-color:var(--blue);color:var(--blue);box-shadow:none}body.embedded .talavaLangSelect{height:28px;min-width:54px;padding:0 5px}
#identity{text-align:right;font-size:12px}.themeBtn{height:30px;border:1px solid var(--border);background:var(--bg-panel-solid);color:var(--text2);border-radius:8px;padding:0 9px;font:700 9px/28px ui-monospace,SFMono-Regular,Consolas,monospace;white-space:nowrap}.themeBtn:hover{border-color:var(--blue);color:var(--blue)}body.embedded .themeBtn{display:none}
main{height:calc(100% - 58px);display:grid;grid-template-columns:250px minmax(340px,1fr) 290px}aside,section{min-width:0;background:var(--bg-panel-solid);border-right:1px solid var(--border)}#keysPane{border-right:0;border-left:1px solid var(--border)}
.paneTitle{height:44px;padding:12px;font-size:11px;font-weight:800;letter-spacing:.09em;color:var(--text2);border-bottom:1px solid var(--border);display:flex;justify-content:space-between}.iconBtn{background:none;border:0;color:var(--text2);font-size:18px;padding:0}.iconBtn:hover{color:var(--blue)}
.room,.keyCard{padding:11px 12px;border-bottom:1px solid var(--border2);cursor:pointer}.room:hover,.room.active,.keyCard:hover{background:color-mix(in srgb,var(--blue) 8%,var(--bg-panel-solid))}.room.active{box-shadow:inset 3px 0 0 var(--blue)}.room b,.keyCard b{display:block;font-size:14px}.room small,.keyCard small{color:var(--muted);display:block;margin-top:4px;line-height:1.3}
.pill{display:inline-block;border:1px solid var(--border);border-radius:99px;padding:2px 6px;font-size:9px;margin-top:5px;color:var(--text2)}.pill.ok{border-color:var(--green);color:var(--green)}.pill.warn{border-color:var(--orange);color:var(--orange)}
#chatPane{display:grid;grid-template-rows:56px 1fr auto;background:var(--bg-primary)}#chatHead{display:flex;align-items:center;justify-content:space-between;padding:8px 14px;border-bottom:1px solid var(--border);background:var(--bg-panel-solid)}#chatHead small{display:block;color:var(--muted);margin-top:3px}
button{border:1px solid var(--border);border-radius:7px;padding:9px 12px;background:var(--bg-tertiary);color:var(--text);font-weight:700;cursor:pointer}button:hover{border-color:var(--blue);color:var(--blue);background:color-mix(in srgb,var(--blue) 7%,var(--bg-tertiary))}button.primary,#sendBtn{background:var(--blue);border-color:var(--blue);color:#fff}button.primary:hover,#sendBtn:hover{background:var(--blue-light);color:#fff}button.danger{background:color-mix(in srgb,var(--red) 16%,var(--bg-tertiary));border-color:color-mix(in srgb,var(--red) 55%,var(--border));color:var(--red)}.hidden{display:none!important}
#timeline{overflow:auto;padding:15px;display:flex;flex-direction:column;gap:9px}.msg{max-width:76%;padding:9px 11px;border-radius:10px;background:var(--bg-secondary);align-self:flex-start;border:1px solid var(--border)}.msg.mine{align-self:flex-end;background:color-mix(in srgb,var(--green) 12%,var(--bg-panel-solid));border-color:color-mix(in srgb,var(--green) 55%,var(--border))}.msg .who{font-size:10px;color:var(--blue);margin-bottom:4px}.msg .text{white-space:pre-wrap;word-break:break-word}.msg .meta{font-size:9px;color:var(--muted);margin-top:5px}.msg.locked{border-color:var(--orange);color:var(--orange)}
#composer{display:grid;grid-template-columns:auto 1fr auto;gap:8px;padding:10px;border-top:1px solid var(--border);background:var(--bg-panel-solid)}textarea,input,select{width:100%;background:var(--bg-secondary);color:var(--text);border:1px solid var(--border);border-radius:7px;padding:10px;outline:none}textarea:focus,input:focus,select:focus{border-color:var(--blue);box-shadow:0 0 0 2px color-mix(in srgb,var(--blue) 14%,transparent)}#sendBtn{min-width:86px}
.activeCard{margin:10px;padding:10px;border:1px solid color-mix(in srgb,var(--green) 55%,var(--border));background:color-mix(in srgb,var(--green) 8%,var(--bg-panel-solid));border-radius:8px}.activeCard small{display:block;color:var(--text2);margin-top:4px}.keyActions{padding:10px;display:grid;grid-template-columns:1fr 1fr;gap:7px}.keyActions button{font-size:10px}
.overlay{position:fixed;inset:0;background:color-mix(in srgb,var(--bg-void) 78%,transparent);backdrop-filter:blur(3px);z-index:20;display:grid;place-items:center;padding:15px}.modal{width:min(380px,100%);background:var(--bg-panel-solid);color:var(--text);border:1px solid var(--border);border-radius:12px;padding:20px;box-shadow:var(--shadow)}.modal.wide{width:min(520px,100%)}.modal h2{margin:0 0 8px}.modal p{color:var(--muted);font-size:13px}.modal input,.modal select{margin:5px 0}.modal button{margin-top:9px}.row{display:flex;gap:7px}.row>*{flex:1}.error{color:var(--red);font-size:12px;margin-top:8px}.help{color:var(--muted);font-size:11px;line-height:1.4}.entryActions{display:flex;gap:5px;margin-top:7px}.entryActions button{padding:5px 7px;font-size:9px}nav{display:none}
body.embedded header{height:48px}body.embedded main{height:calc(100% - 48px);grid-template-columns:210px minmax(280px,1fr)}body.embedded #keysPane{display:none}body.embedded .brand b{font-size:12px}
.headActions{display:flex;gap:6px;align-items:center}.headActions button{font-size:9px;padding:7px 8px}.memberCheck{display:block;padding:6px;color:var(--text2)}.memberCheck input{width:auto;margin-right:6px}.fileDownload{margin-top:8px;font-size:10px;background:var(--bg-tertiary)}.fileHint{font-size:11px;color:var(--muted);margin-top:4px}.controlActive{color:var(--blue)!important}.keyRef{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:8px!important;word-break:break-all;opacity:.7}.modal hr{border:0;border-top:1px solid var(--border);margin:16px 0}button:disabled{opacity:.45;cursor:not-allowed}
.logoutBtn{margin-top:4px;padding:3px 7px;font-size:8px;background:var(--bg-tertiary);color:var(--text2)}.qrImage{display:block;width:min(360px,100%);height:auto;margin:14px auto;border-radius:8px;background:#fff;padding:8px}.signedClient{color:var(--green)!important;font-weight:800;letter-spacing:.04em}.loginDivider{text-align:center;color:var(--muted);font-size:10px;margin:10px 0 6px;letter-spacing:.12em}#eparakstsLogin{margin-top:8px}#eparakstsLogin button{margin-top:5px;width:100%}
body.theme-night .qrImage{filter:brightness(.78) contrast(1.15)}
@media(max-width:850px){header{height:54px;padding:0 10px}main{height:calc(100% - 108px);display:block}main>aside,main>section{height:100%;border:0!important}#roomsPane,#keysPane{display:none}nav{display:grid;grid-template-columns:repeat(3,1fr);height:54px;border-top:1px solid var(--border);background:var(--bg-panel)}nav button{border-radius:0;background:transparent;border:0;font-size:10px;color:var(--text2)}nav button.active{color:var(--blue);background:color-mix(in srgb,var(--blue) 10%,var(--bg-panel))}.mobileShow{display:block!important}#timeline{padding:10px}.msg{max-width:88%}#identity{max-width:42%;overflow:hidden;text-overflow:ellipsis}.brand b{font-size:13px}.themeBtn{padding:0 6px;font-size:8px}.headActions button{font-size:8px;padding:6px}.headActions{gap:3px}#chatHead{padding:6px 8px}}

:root{color-scheme:light}body.theme-dark,body.theme-night{color-scheme:dark}

/* Tālavas mobile shell v0.3.6 — native/PWA only; embedded AUSEKLIS layout stays separate. */
@media(max-width:850px){
  body:not(.embedded) #app{height:100dvh;min-height:100dvh;display:grid;grid-template-rows:64px minmax(0,1fr) 58px;overflow:hidden}
  body:not(.embedded) header{height:auto;min-height:0;padding:7px 8px;gap:6px;background:var(--bg-panel-solid)}
  body:not(.embedded) .brand{flex:1 1 auto;min-width:0;gap:8px}
  body:not(.embedded) .brand>div{min-width:0}
  body:not(.embedded) .shield{width:30px;height:34px;flex:0 0 30px;font-size:15px}
  body:not(.embedded) .brand b{display:block;font-size:12px;line-height:1.15;letter-spacing:.045em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  body:not(.embedded) #connection{display:block;max-width:174px;margin-top:3px;font-size:9px;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  body:not(.embedded) .headerRight{flex:0 0 auto;gap:4px;min-width:0}
  body:not(.embedded) .themeBtn{width:36px;height:34px;padding:0;line-height:32px;font-size:0;overflow:hidden}
  body:not(.embedded) .themeBtn::before{content:attr(data-icon);font-size:16px;line-height:32px}
  body:not(.embedded) #identity{display:flex;align-items:center;gap:4px;max-width:none;text-align:right;overflow:visible}
  body:not(.embedded) #identity>b{display:block;max-width:68px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px}
  body:not(.embedded) #identity>small{display:none!important}
  body:not(.embedded) .logoutBtn{width:32px;height:34px;margin:0;padding:0;font-size:0;border-radius:8px}
  body:not(.embedded) .logoutBtn::before{content:'⇥';font-size:17px;line-height:32px}

  body:not(.embedded) main{height:auto;min-height:0;display:block;overflow:hidden;background:var(--bg-primary)}
  body:not(.embedded) main>aside,body:not(.embedded) main>section{display:none!important;height:100%;min-height:0;border:0!important;background:var(--bg-primary)}
  body:not(.embedded) #chatPane.mobileShow{display:grid!important;grid-template-rows:48px minmax(0,1fr) auto;height:100%;min-height:0}
  body:not(.embedded) #roomsPane.mobileShow,body:not(.embedded) #keysPane.mobileShow{display:block!important;height:100%;overflow-y:auto;overscroll-behavior:contain;padding-bottom:12px;background:var(--bg-panel-solid)}
  body:not(.embedded) #chatHead{min-height:48px;padding:6px 9px;gap:6px;overflow:hidden}
  body:not(.embedded) #chatHead>div:first-child{min-width:0}
  body:not(.embedded) #roomName{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px}
  body:not(.embedded) #roomMeta{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:58vw;font-size:9px}
  body:not(.embedded) .headActions{flex:0 0 auto;gap:3px}
  body:not(.embedded) .headActions button{padding:5px 6px;font-size:8px;white-space:nowrap}
  body:not(.embedded) #timeline{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:10px 9px 8px;gap:7px;background:var(--bg-primary)}
  body:not(.embedded) .msg{max-width:88%;padding:8px 10px;border-radius:11px}
  body:not(.embedded) #composer{grid-template-columns:64px minmax(0,1fr) 70px;align-items:stretch;gap:6px;padding:7px 8px;border-top:1px solid var(--border);background:var(--bg-panel-solid)}
  body:not(.embedded) #message{height:48px;min-height:48px;max-height:96px;resize:none;padding:11px 10px;font-size:16px;line-height:1.25}
  body:not(.embedded) #chatFileBtn,body:not(.embedded) #sendBtn{height:48px;min-width:0;padding:0 7px;font-size:11px;border-radius:9px}
  body:not(.embedded) .paneTitle{position:sticky;top:0;z-index:2;height:44px;padding:11px 12px;background:var(--bg-panel-solid)}
  body:not(.embedded) .room,body:not(.embedded) .keyCard{padding:12px}
  body:not(.embedded) .activeCard{margin:10px}
  body:not(.embedded) .keyActions{padding:10px 10px 18px;grid-template-columns:1fr 1fr;gap:7px}
  body:not(.embedded) .keyActions button{min-height:42px}

  body:not(.embedded) nav{display:grid;height:auto;min-height:58px;grid-template-columns:repeat(3,1fr);padding:4px 6px max(4px,env(safe-area-inset-bottom));gap:3px;border-top:1px solid var(--border);background:var(--bg-panel-solid);box-shadow:0 -2px 12px color-mix(in srgb,var(--text) 8%,transparent)}
  body:not(.embedded) nav button{min-height:46px;border:0;border-radius:10px;background:transparent;color:var(--text2);font-size:10px;letter-spacing:.04em}
  body:not(.embedded) nav button.active{color:var(--blue);background:color-mix(in srgb,var(--blue) 10%,var(--bg-panel-solid))}

  body:not(.embedded) .overlay{padding:12px max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));overflow:auto}
  body:not(.embedded) .modal{max-height:calc(100dvh - 24px);overflow:auto;padding:16px}
}
@media(max-width:390px){
  body:not(.embedded) #app{grid-template-rows:62px minmax(0,1fr) 56px}
  body:not(.embedded) header{padding:6px}
  body:not(.embedded) .brand{gap:6px}
  body:not(.embedded) .brand b{font-size:11px;letter-spacing:.025em}
  body:not(.embedded) #connection{max-width:142px;font-size:8px}
  body:not(.embedded) #identity>b{max-width:54px;font-size:9px}
  body:not(.embedded) .themeBtn{width:32px}
  body:not(.embedded) #composer{grid-template-columns:56px minmax(0,1fr) 62px;padding:6px}
  body:not(.embedded) #chatFileBtn,body:not(.embedded) #sendBtn{font-size:10px;padding:0 4px}
}

/* Mobile shell v0.3.8 */
.mobileStatus{display:none}
@media(max-width:850px){
  body:not(.embedded) #app{
    height:100dvh;min-height:100dvh;
    display:grid;
    grid-template-rows:52px 26px minmax(0,1fr) 56px;
    overflow:hidden;
    background:var(--bg-primary)
  }
  body:not(.embedded) header{
    grid-row:1;height:52px;min-height:52px;
    padding:5px 10px;gap:6px;
    background:var(--bg-panel-solid);
    border-bottom:1px solid var(--border)
  }
  body:not(.embedded) .brand{min-width:0;flex:1 1 auto;gap:7px}
  body:not(.embedded) .shield{width:28px;height:32px;flex:0 0 28px;font-size:14px}
  body:not(.embedded) .brand>div{min-width:0}
  body:not(.embedded) .brand b{
    display:block;font-size:12px;line-height:1.05;letter-spacing:.035em;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis
  }
  body:not(.embedded) #connection{display:none!important}
  body:not(.embedded) .headerRight{flex:0 0 auto;gap:4px;min-width:0}
  body:not(.embedded) .themeBtn{width:34px;height:34px;padding:0;line-height:32px;font-size:0;border-radius:9px}
  body:not(.embedded) .themeBtn::before{content:attr(data-icon);font-size:16px;line-height:32px}
  body:not(.embedded) #identity{display:flex;align-items:center;gap:4px;max-width:none;text-align:right;overflow:visible}
  body:not(.embedded) #identity>b{display:block;max-width:72px;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  body:not(.embedded) #identity>small{display:none!important}
  body:not(.embedded) .logoutBtn{width:34px;height:34px;margin:0;padding:0;font-size:0;border-radius:9px}
  body:not(.embedded) .logoutBtn::before{content:'⇥';font-size:18px;line-height:32px}

  body:not(.embedded) .mobileStatus{
    grid-row:2;display:flex;align-items:center;
    height:26px;min-height:26px;padding:0 10px;
    border-bottom:1px solid var(--border2);
    background:var(--bg-secondary);color:var(--text2);
    font:700 9px/1 ui-monospace,SFMono-Regular,Consolas,monospace;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    cursor:pointer
  }
  body:not(.embedded) .mobileStatus.bad{color:var(--red);background:color-mix(in srgb,var(--red) 7%,var(--bg-secondary))}
  body:not(.embedded) main{grid-row:3;height:auto;min-height:0;display:block;overflow:hidden;background:var(--bg-primary)}
  body:not(.embedded) nav{grid-row:4;height:56px;min-height:56px;padding:4px 6px;align-self:stretch}
  body:not(.embedded) nav button{min-height:46px;font-size:10px}

  body:not(.embedded) #chatPane.mobileShow{display:grid!important;grid-template-rows:44px minmax(0,1fr) 60px;height:100%;min-height:0}
  body:not(.embedded) #chatHead{min-height:44px;height:44px;padding:5px 10px}
  body:not(.embedded) #roomName{font-size:13px}
  body:not(.embedded) #roomMeta{max-width:56vw;font-size:8px}
  body:not(.embedded) #timeline{padding:10px 9px 8px}
  body:not(.embedded) #timeline:empty::before{
    content:'Izvēlies darba grupu cilnē GRUPAS';
    display:grid;place-items:center;height:100%;
    color:var(--muted);font:700 12px/1.4 ui-monospace,SFMono-Regular,Consolas,monospace;
    text-align:center;padding:24px
  }
  body:not(.embedded) #composer{
    height:60px;grid-template-columns:64px minmax(0,1fr) 72px;
    align-items:center;gap:6px;padding:6px 8px
  }
  body:not(.embedded) #message{height:48px;min-height:48px;max-height:48px;padding:11px 10px;font-size:16px;line-height:1.2}
  body:not(.embedded) #chatFileBtn,body:not(.embedded) #sendBtn{height:48px;border-radius:10px;font-size:11px}
  body:not(.embedded) #roomsPane.mobileShow,body:not(.embedded) #keysPane.mobileShow{height:100%;min-height:0;overflow-y:auto;padding-bottom:10px}
  body:not(.embedded) .paneTitle{height:42px;min-height:42px;padding:10px 12px}
  body:not(.embedded) .room,body:not(.embedded) .keyCard{padding:12px 11px}
  body:not(.embedded) .keyActions{padding-bottom:14px}
}
@media(max-width:390px){
  body:not(.embedded) #app{grid-template-rows:50px 24px minmax(0,1fr) 54px}
  body:not(.embedded) header{height:50px;min-height:50px;padding:4px 7px}
  body:not(.embedded) .mobileStatus{height:24px;min-height:24px;padding:0 8px;font-size:8px}
  body:not(.embedded) nav{height:54px;min-height:54px}
  body:not(.embedded) #identity>b{max-width:56px;font-size:9px}
  body:not(.embedded) .themeBtn,body:not(.embedded) .logoutBtn{width:32px;height:32px}
  body:not(.embedded) #composer{grid-template-columns:56px minmax(0,1fr) 64px;padding:6px}
}

/* Always-visible client version badge */
.brandTitleRow{display:flex;align-items:center;gap:7px;min-width:0}.brandTitleRow>b{min-width:0}.versionBadge{display:inline-flex;align-items:center;height:20px;padding:0 6px;border:1px solid var(--border);border-radius:999px;background:var(--bg-tertiary);color:var(--text2);font:800 9px/18px ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.03em;white-space:nowrap;flex:0 0 auto}
@media(max-width:850px){body:not(.embedded) .brandTitleRow{gap:5px}body:not(.embedded) .versionBadge{height:18px;padding:0 5px;font-size:8px;line-height:16px}}
@media(max-width:390px){body:not(.embedded) .versionBadge{font-size:7px;padding:0 4px}}
/* Embedded AUSEKLIS shell v0.3.10: compact header; outer panel already owns the title. */
body.embedded #app{height:100%;display:grid;grid-template-rows:38px 24px minmax(0,1fr);overflow:hidden}
body.embedded header{grid-row:1;height:38px;min-height:38px;padding:3px 7px;background:var(--bg-panel-solid);border-bottom:1px solid var(--border)}
body.embedded .brand{gap:5px;min-width:0}
body.embedded .shield{width:24px;height:28px;flex:0 0 24px;font-size:12px}
body.embedded .brandTitleRow>b{display:none}
body.embedded .versionBadge{height:18px;padding:0 5px;font-size:8px;line-height:16px}
body.embedded #connection{display:none!important}
body.embedded .headerRight{gap:4px;min-width:0}
body.embedded #identity{display:flex;align-items:center;gap:4px;max-width:150px;overflow:hidden;text-align:right}
body.embedded #identity>b{font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.embedded #identity>small{display:none!important}
body.embedded .mobileStatus{grid-row:2;display:flex;height:24px;min-height:24px;padding:0 8px;align-items:center;border-bottom:1px solid var(--border2);background:var(--bg-secondary);color:var(--text2);font:700 8px/1 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
body.embedded .mobileStatus.bad{color:var(--red);background:color-mix(in srgb,var(--red) 7%,var(--bg-secondary))}
body.embedded main{grid-row:3;height:auto;min-height:0;grid-template-columns:150px minmax(0,1fr);overflow:hidden}
body.embedded #roomsPane{min-width:0;overflow-y:auto}
body.embedded #chatPane{min-width:0;min-height:0}
body.embedded .paneTitle{height:36px;min-height:36px;padding:9px 8px;font-size:9px}
body.embedded #chatPane{grid-template-rows:40px minmax(0,1fr) 56px}
body.embedded #chatHead{min-height:40px;height:40px;padding:5px 8px}
body.embedded #roomName{font-size:11px}
body.embedded #roomMeta{font-size:8px;max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.embedded .headActions button{padding:4px 5px;font-size:7px}
body.embedded #timeline{min-height:0;padding:8px}
body.embedded #composer{height:56px;grid-template-columns:56px minmax(0,1fr) 64px;gap:5px;padding:5px 6px}
body.embedded #message{height:44px;min-height:44px;max-height:44px;padding:9px 8px;font-size:13px;resize:none}
body.embedded #chatFileBtn,body.embedded #sendBtn{height:44px;min-width:0;padding:0 5px;font-size:9px}

/* Embedded AUSEKLIS narrow-panel tabs v0.3.12 */
@media(max-width:850px){
  body.embedded #app{
    height:100%;
    display:grid;
    grid-template-rows:38px 24px minmax(0,1fr) 48px;
    overflow:hidden;
  }
  body.embedded header{grid-row:1}
  body.embedded .mobileStatus{grid-row:2}
  body.embedded main{
    grid-row:3;
    height:auto;
    min-height:0;
    display:block!important;
    overflow:hidden;
    background:var(--bg-primary);
  }
  body.embedded main>aside,
  body.embedded main>section{
    display:none!important;
    width:100%;
    height:100%;
    min-height:0;
    border:0!important;
  }
  body.embedded #chatPane.mobileShow{
    display:grid!important;
    grid-template-rows:40px minmax(0,1fr) 56px;
    height:100%;
    min-height:0;
  }
  body.embedded #roomsPane.mobileShow,
  body.embedded #keysPane.mobileShow{
    display:block!important;
    height:100%;
    min-height:0;
    overflow-y:auto;
    overscroll-behavior:contain;
    background:var(--bg-panel-solid);
    padding-bottom:10px;
  }
  body.embedded nav{
    grid-row:4;
    display:grid!important;
    grid-template-columns:repeat(3,1fr);
    height:48px;
    min-height:48px;
    padding:3px 5px;
    gap:3px;
    border-top:1px solid var(--border);
    background:var(--bg-panel-solid);
  }
  body.embedded nav button{
    min-height:40px;
    border:0;
    border-radius:8px;
    background:transparent;
    color:var(--text2);
    font-size:9px;
    letter-spacing:.04em;
  }
  body.embedded nav button.active{
    color:var(--blue);
    background:color-mix(in srgb,var(--blue) 10%,var(--bg-panel-solid));
  }
  body.embedded #keysPane .paneTitle{
    position:sticky;
    top:0;
    z-index:3;
    background:var(--bg-panel-solid);
  }
  body.embedded #keysPane .keyActions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:6px;
    padding:9px;
  }
  body.embedded #keysPane .keyActions button{
    min-height:38px;
    font-size:8px;
    padding:6px;
  }
}
body.embedded #lockBtn{display:none!important}
body.embedded #hardwareBtn{display:none!important}

/* Embedded release links v0.3.13 */
.embeddedLinks{display:none;align-items:center;gap:4px;flex:0 0 auto}
body.embedded .mobileStatus{justify-content:space-between;gap:6px}
body.embedded #mobileStatusText{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.embedded .embeddedLinks{display:flex}
body.embedded .embeddedLinks a{display:inline-flex;align-items:center;height:18px;padding:0 6px;border:1px solid var(--border);border-radius:999px;background:var(--bg-panel-solid);color:var(--blue);text-decoration:none;font:800 8px/16px ui-monospace,SFMono-Regular,Consolas,monospace;white-space:nowrap}
body.embedded .embeddedLinks a:hover{border-color:var(--blue);background:color-mix(in srgb,var(--blue) 8%,var(--bg-panel-solid))}
@media(max-width:520px){body.embedded .embeddedLinks a{padding:0 5px;font-size:7px}}


/* Help center v0.3.14 */
.helpBtn{height:30px;border:1px solid var(--border);background:var(--bg-panel-solid);color:var(--text2);border-radius:8px;padding:0 9px;font:800 9px/28px ui-monospace,SFMono-Regular,Consolas,monospace;white-space:nowrap}
.helpBtn:hover{border-color:var(--blue);color:var(--blue)}
.helpDoc{max-height:min(78vh,760px);overflow:auto;padding-right:2px}
.helpHead{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;position:sticky;top:-20px;z-index:4;background:var(--bg-panel-solid);padding:0 0 10px;border-bottom:1px solid var(--border)}
.helpHead h2{margin:0}.helpSurface{margin-top:4px;color:var(--muted);font:700 9px/1.3 ui-monospace,SFMono-Regular,Consolas,monospace}.helpClose{font-size:22px!important;line-height:1!important;flex:0 0 auto}
.helpDoc h3{margin:18px 0 7px;font-size:12px;letter-spacing:.07em;color:var(--blue);text-transform:uppercase}
.helpRow{display:grid;grid-template-columns:minmax(110px,150px) minmax(0,1fr);gap:10px;padding:8px 0;border-bottom:1px solid var(--border2)}
.helpKey{font-size:11px;color:var(--text)}.helpDesc{font-size:11px;line-height:1.45;color:var(--text2)}
.helpCallout{margin:10px 0;padding:10px 11px;border:1px solid color-mix(in srgb,var(--blue) 35%,var(--border));border-radius:9px;background:color-mix(in srgb,var(--blue) 6%,var(--bg-panel-solid));font-size:11px;line-height:1.45;color:var(--text2)}
.helpCallout b{color:var(--text)}.helpFooter{margin-top:16px;padding-top:10px;border-top:1px solid var(--border);font-size:10px;line-height:1.45;color:var(--muted)}
@media(max-width:850px){body:not(.embedded) .helpBtn{width:34px;height:34px;padding:0;font-size:0;border-radius:9px}body:not(.embedded) .helpBtn::before{content:'?';font-size:16px;line-height:32px}.helpDoc{max-height:calc(100dvh - 48px)}.helpRow{grid-template-columns:100px minmax(0,1fr);gap:8px}}
@media(max-width:390px){body:not(.embedded) .helpBtn{width:32px;height:32px}.helpRow{grid-template-columns:92px minmax(0,1fr)}}
body.embedded .helpBtn{width:28px;height:28px;padding:0;font-size:0;border-radius:7px}body.embedded .helpBtn::before{content:'?';font-size:14px;line-height:26px}

/* Help button visibility v0.3.17 */
.helpBtn{min-width:92px!important;width:auto!important;padding:0 10px!important;font-size:9px!important;display:inline-flex!important;align-items:center;justify-content:center}
.helpBtn::before{content:none!important}
body.embedded .helpBtn{min-width:88px!important;width:auto!important;height:28px!important;padding:0 8px!important;font-size:8px!important}
body:not(.embedded) .helpBtn{min-width:86px!important;width:auto!important;height:34px!important;padding:0 8px!important;font-size:8px!important}
.helpKeysBtn{grid-column:1/-1!important;border-color:var(--blue)!important;color:var(--blue)!important;font-weight:800!important}
@media(max-width:390px){body:not(.embedded) .helpBtn{min-width:74px!important;font-size:7px!important;padding:0 6px!important}}


/* Group dialog layout v0.3.18 */
#dialog .modal.wide:has(.groupDialogShell){
  width:min(640px,calc(100vw - 28px));
  max-height:min(86dvh,760px);
  padding:0;
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
.groupDialogShell{display:flex;flex-direction:column;min-height:0;max-height:min(86dvh,760px)}
.groupDialogHead{flex:0 0 auto;padding:18px 20px 12px;border-bottom:1px solid var(--border2);background:var(--bg-panel-solid)}
.groupDialogHead h2{margin:0}
.groupDialogBody{flex:1 1 auto;min-height:0;overflow-y:auto;padding:14px 20px 10px;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.groupMembersLabel{margin-top:10px!important;margin-bottom:4px}
.groupMemberList{max-height:min(46dvh,380px);overflow-y:auto;border:1px solid var(--border2);border-radius:10px;background:var(--bg-secondary);padding:4px 8px;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.groupMemberList .memberCheck{min-height:38px;display:flex;align-items:center;gap:8px;padding:6px 4px}
.groupMemberList .memberCheck input{flex:0 0 auto}
.groupDialogFooter{flex:0 0 auto;display:flex;justify-content:flex-end;gap:8px;padding:12px 20px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--border2);background:var(--bg-panel-solid)}
.groupDialogFooter button{margin:0;min-width:108px}
@media(max-width:850px){
  #dialog .modal.wide:has(.groupDialogShell){width:calc(100vw - 20px);max-height:calc(100dvh - 24px)}
  .groupDialogShell{max-height:calc(100dvh - 24px)}
  .groupDialogHead{padding:15px 16px 10px}
  .groupDialogBody{padding:12px 16px 8px}
  .groupMemberList{max-height:none;min-height:160px}
  .groupDialogFooter{padding:10px 16px calc(10px + env(safe-area-inset-bottom))}
  .groupDialogFooter button{flex:1;min-width:0;min-height:42px}
}
body.embedded #dialog{align-items:center;padding:10px}
body.embedded #dialog .modal.wide:has(.groupDialogShell){max-height:calc(100dvh - 20px)}
body.embedded .groupDialogShell{max-height:calc(100dvh - 20px)}

/* Embedded mobile pane refresh/layout v0.3.18 */
/* v0.3.18 embedded inner-scroll rule removed in v0.3.31 */


/* Human-verifiable key identity v0.3.24 */
.keyIdentity{min-width:0}.keyName{display:block;font-size:14px;line-height:1.25}.humanId{margin-top:5px;font:900 12px/1.35 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.035em;color:var(--blue);word-break:normal}.keyMeta,.workHumanId,.protectionMeta{display:block;margin-top:4px;color:var(--muted);line-height:1.3}.workHumanId{color:var(--text2)!important;font:800 10px/1.35 ui-monospace,SFMono-Regular,Consolas,monospace}.activeLabel{margin:8px 0 3px;font-size:8px;font-weight:900;letter-spacing:.11em;color:var(--muted)}.activeGroup{padding-bottom:7px;border-bottom:1px solid var(--border2)}.activeGroup small{display:block;margin-top:3px;color:var(--muted)}.controlLabel{margin-top:10px}.activeCard .keyIdentity{padding:2px 0 6px}.activeCard .keyRef{display:block!important}.keyCard .keyIdentity{pointer-events:none}@media(max-width:850px){.humanId{font-size:11px}.keyName{font-size:13px}.workHumanId{font-size:9px}}

/* Embedded mobile vault/login modal fix v0.3.26 */
@media(max-width:850px){
  body.embedded #vaultLock,
  body.embedded #login{
    display:flex;
    align-items:flex-start;
    justify-content:center;
    overflow-y:auto;
    overscroll-behavior:contain;
    padding:18px 10px max(18px,env(safe-area-inset-bottom));
  }
  body.embedded #vaultLock.hidden,
  body.embedded #login.hidden{display:none!important}
  body.embedded #vaultLock .modal,
  body.embedded #login .modal{
    width:min(520px,100%);
    height:auto!important;
    min-height:0!important;
    max-height:calc(100dvh - 36px);
    overflow-y:auto;
    flex:0 0 auto;
    padding:18px 16px;
  }
  body.embedded #vaultLock .modal h2,
  body.embedded #login .modal h2{
    font-size:24px;
    line-height:1.12;
    margin-bottom:12px;
  }
  body.embedded #vaultLock .modal p,
  body.embedded #login .modal p{
    font-size:14px;
    line-height:1.4;
    margin:0 0 12px;
  }
  body.embedded #vaultLock input,
  body.embedded #login input,
  body.embedded #vaultLock button,
  body.embedded #login button{
    min-height:44px;
  }
}


/* Canonical desktop layout v0.3.30 */
@media(min-width:851px){
  body:not(.embedded) #app{
    height:100dvh;
    min-height:0;
    display:grid;
    grid-template-rows:58px minmax(0,1fr);
    overflow:hidden;
  }
  body:not(.embedded) header{
    grid-row:1;
    height:58px;
    min-height:58px;
  }
  body:not(.embedded) main{
    grid-row:2;
    height:auto;
    min-height:0;
    display:grid;
    grid-template-columns:250px minmax(340px,1fr) 290px;
    overflow:hidden;
  }
  body:not(.embedded) #roomsPane,
  body:not(.embedded) #keysPane{
    min-height:0;
    height:auto;
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
    scrollbar-gutter:stable;
  }
  body:not(.embedded) #roomsPane .paneTitle,
  body:not(.embedded) #keysPane .paneTitle{
    position:sticky;
    top:0;
    z-index:5;
    background:var(--bg-panel-solid);
  }
  body:not(.embedded) #chatPane{
    position:static;
    display:grid;
    grid-template-rows:56px minmax(0,1fr) 66px;
    height:auto;
    min-height:0;
    overflow:hidden;
    background:var(--bg-primary);
  }
  body:not(.embedded) #chatHead{
    position:static;
    height:56px;
    min-height:56px;
  }
  body:not(.embedded) #timeline{
    position:static;
    min-height:0;
    overflow-y:auto;
    overflow-x:hidden;
  }
  body:not(.embedded) #composer{
    position:static;
    display:grid;
    height:66px;
    min-height:66px;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    overflow:hidden;
    background:var(--bg-panel-solid);
  }
  body:not(.embedded) #message{
    height:44px;
    min-height:44px;
    max-height:44px;
    resize:none;
  }
  body:not(.embedded) #chatFileBtn,
  body:not(.embedded) #sendBtn{
    height:44px;
  }
}

/* Embedded AUSEKLIS pane scrolling v0.3.31 */
@media(max-width:850px){
  body.embedded #roomsPane.mobileShow,
  body.embedded #keysPane.mobileShow{
    display:block!important;
    height:100%!important;
    min-height:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior-y:contain;
    -webkit-overflow-scrolling:touch;
    touch-action:pan-y;
    padding-bottom:14px;
    background:var(--bg-panel-solid);
    scrollbar-gutter:stable;
  }
  body.embedded #roomsPane.mobileShow #rooms,
  body.embedded #keysPane.mobileShow #keys{
    display:block!important;
    min-height:0!important;
    height:auto!important;
    overflow:visible!important;
    flex:none!important;
  }
  body.embedded #keysPane.mobileShow .keyActions{
    display:grid!important;
    position:static!important;
    flex:none!important;
    padding-bottom:18px!important;
  }
  body.embedded #roomsPane.mobileShow .paneTitle,
  body.embedded #keysPane.mobileShow .paneTitle{
    position:sticky!important;
    top:0!important;
    z-index:5!important;
    background:var(--bg-panel-solid)!important;
  }
}


/* Embedded Android migration sheet v0.3.34 */
@media(max-width:850px){
  body.embedded #vaultLock.migrationMode{
    display:flex!important;
    align-items:flex-start!important;
    justify-content:center!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding:12px 10px 18px!important;
    -webkit-overflow-scrolling:touch;
  }
  body.embedded #vaultLock.migrationMode .modal{
    width:min(460px,100%)!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
    flex:0 0 auto!important;
    margin:0!important;
    padding:14px 14px 16px!important;
    border-radius:12px!important;
  }
  body.embedded #vaultLock.migrationMode .modal h2{
    font-size:20px!important;
    line-height:1.15!important;
    margin:0 0 9px!important;
  }
  body.embedded #vaultLock.migrationMode .modal p{
    font-size:12px!important;
    line-height:1.35!important;
    margin:0 0 10px!important;
  }
  body.embedded #vaultLock.migrationMode #vaultPin{
    height:42px!important;
    min-height:42px!important;
    margin:4px 0!important;
    font-size:16px!important;
  }
  body.embedded #vaultLock.migrationMode #vaultBtn{
    width:100%!important;
    min-height:42px!important;
    margin-top:7px!important;
  }
  body.embedded #vaultLock.migrationMode #vaultOut{
    margin-top:6px!important;
  }
}


/* Privacy-preserving Tālavas directory v0.3.36 */
.directoryLookup{margin-top:14px;padding-top:12px;border-top:1px solid var(--border2)}
.directoryRow{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:6px;align-items:center;margin-top:6px}
.directoryRow button{min-height:40px;white-space:nowrap}
.directoryEmpty{padding:12px;color:var(--muted);font-size:11px}
.inviteCodeText{margin:14px 0;padding:12px;border:1px solid var(--blue);border-radius:9px;text-align:center;font:900 20px/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.08em;color:var(--blue);user-select:all}
#inviteCodeBtn{width:auto!important;min-width:44px!important;padding:0 6px!important;font-size:7px!important}
@media(max-width:850px){.directoryRow{grid-template-columns:minmax(0,1fr) auto}.directoryRow #gInviteQrBtn{grid-column:2}.inviteCodeText{font-size:16px;letter-spacing:.04em}}


/* Rotation controls v0.3.37 */
.rotationMeta{display:block;margin-top:5px;color:var(--blue);font-weight:700;line-height:1.3}
.rotationFields{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0}
.rotationFields label,.fieldLabel{display:block;color:var(--text2);font-size:11px;font-weight:700;letter-spacing:.03em}
.rotationFields input{margin-top:5px}
.rotationState{margin:10px 0;padding:10px;border:1px solid var(--border2);border-radius:9px;background:var(--bg-secondary);font-size:11px;line-height:1.5;color:var(--text2)}
@media(max-width:600px){.rotationFields{grid-template-columns:1fr}}

@keyframes talavaIncomingFlash{0%,100%{filter:none}25%,70%{filter:brightness(1.16)}}
body.incomingFlash{animation:talavaIncomingFlash .9s ease-out}

/* Per-conversation unread state v2 */
.room{position:relative}.roomUnread{position:absolute;right:8px;top:8px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:#d93025;color:#fff;border:2px solid var(--bg-panel-solid);display:none;align-items:center;justify-content:center;box-sizing:border-box;font:900 10px/16px ui-monospace,SFMono-Regular,Consolas,monospace;z-index:2}.roomUnread.show{display:flex}

@media(max-width:850px){body:not(.embedded) .talavaLangSelect{width:48px;min-width:48px;height:34px;padding:0 3px;font-size:9px}body.embedded .talavaLangSelect{width:48px;min-width:48px}}
@media(max-width:390px){body:not(.embedded) .talavaLangSelect{width:44px;min-width:44px}}