.app-header{background-color:var(--color-primary);color:var(--color-text-inverse);padding:var(--space-md);align-items:center;gap:var(--space-md);flex-wrap:wrap;display:flex}.app-header h1{font-size:var(--font-size-lg);flex-shrink:0;margin:0}.app-nav{gap:var(--space-xs);flex-wrap:wrap;display:flex}.nav-button{align-items:center;gap:var(--space-xs);color:var(--color-text-inverse);padding:var(--space-sm) var(--space-md);min-height:var(--touch-target-min);font-size:var(--font-size-sm);border-radius:var(--radius-md);background:0 0;border:2px solid #0000;display:flex}.nav-button:hover{background-color:var(--color-primary-hover)}.nav-button--active{border-color:var(--color-text-inverse);background-color:var(--color-primary-hover)}.app-layout{flex-direction:column;min-height:calc(100vh - 120px);display:flex}.app-sidebar{border-bottom:2px solid var(--color-border);padding:var(--space-md);background-color:var(--color-bg-secondary)}.app-main{padding:var(--space-md);flex:1}@media (width>=768px){.app-layout{flex-direction:row}.app-sidebar{border-bottom:none;border-right:2px solid var(--color-border);width:320px;min-width:280px;max-width:380px;max-height:calc(100vh - 120px);overflow-y:auto}.app-main{flex:1;max-height:calc(100vh - 120px);overflow-y:auto}}.big-button{width:100%;max-width:480px;min-height:var(--button-height);padding:var(--space-md) var(--space-lg);font-size:var(--font-size-base);border-radius:var(--radius-md);cursor:pointer;text-align:center;border:2px solid #0000;font-weight:700;display:block}.big-button--primary{background-color:var(--color-primary);color:var(--color-text-inverse)}.big-button--primary:hover{background-color:var(--color-primary-hover)}.big-button--danger{background-color:var(--color-danger);color:var(--color-text-inverse)}.big-button--danger:hover{background-color:var(--color-danger-hover)}.big-button--secondary{background-color:var(--color-bg-secondary);color:var(--color-text);border-color:var(--color-border)}.big-button--secondary:hover{background-color:var(--color-bg-hover)}.form-field{margin-bottom:var(--space-md)}.form-field label{margin-bottom:var(--space-xs);font-weight:600;font-size:var(--font-size-sm);display:block}.form-field input,.form-field textarea,.form-field select{width:100%;max-width:480px;min-height:var(--touch-target-min);padding:var(--space-sm) var(--space-md);font-size:var(--font-size-base);font-family:var(--font-sans);border:2px solid var(--color-border);border-radius:var(--radius-md);background-color:var(--color-bg);color:var(--color-text);display:block}.form-field input:focus,.form-field textarea:focus{box-shadow:var(--focus-ring);outline:2px solid #0000}.error-message{color:var(--color-danger);padding:var(--space-sm);border:2px solid var(--color-danger);border-radius:var(--radius-sm);margin-bottom:var(--space-md);background-color:#fef2f2;font-weight:600}.success-message{color:var(--color-success);padding:var(--space-sm);border:2px solid var(--color-success);border-radius:var(--radius-sm);margin-bottom:var(--space-md);background-color:#f0fdf4;font-weight:600}.login-page{max-width:480px;margin:var(--space-xl) auto}.login-form{margin-top:var(--space-md)}.login-homeserver{overflow-wrap:anywhere;font-weight:700}.room-list h2,.room-list h3{margin:0 0 var(--space-sm) 0}.room-list__create-toggle{width:100%;margin-bottom:var(--space-sm);color:var(--color-text);background:var(--color-bg);border:2px solid var(--color-border)}.room-list__create{margin-bottom:var(--space-md);padding:var(--space-sm);border:2px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg)}.field-help{margin:var(--space-xs) 0 0;font-size:var(--font-size-xs)}.room-list h3{margin-top:var(--space-lg);font-size:var(--font-size-sm);color:var(--color-text-muted)}.room-list__items{margin:0;padding:0;list-style:none}.room-list__item{text-align:left;width:100%;padding:var(--space-sm) var(--space-md);min-height:var(--touch-target-min);background:var(--color-bg);border-radius:var(--radius-md);margin-bottom:var(--space-xs);font-size:var(--font-size-sm);border:2px solid #0000;justify-content:space-between;align-items:center;display:flex}.room-list__item:hover{background-color:var(--color-bg-hover)}.room-list__invite{align-items:center;gap:var(--space-sm);margin-bottom:var(--space-xs);padding:var(--space-sm);border:2px solid var(--color-primary);border-radius:var(--radius-md);background:var(--color-bg);flex-wrap:wrap;display:flex}.room-list__invite button{color:var(--color-text-inverse);background:var(--color-primary);margin-left:auto}.room-list__item--active{border-color:var(--color-primary);background-color:var(--color-bg-hover)}.room-list__item--muted{opacity:.7}.room-list__name{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.room-list__encrypted{margin-left:var(--space-xs);padding:4px var(--space-xs);border:2px solid var(--color-warning);border-radius:var(--radius-sm);font-size:16px;font-weight:700}.room-list__badge{background-color:var(--color-primary);color:var(--color-text-inverse);min-width:32px;height:32px;font-size:var(--font-size-xs);margin-left:var(--space-sm);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-weight:700;display:flex}.message-view{flex-direction:column;height:100%;display:flex}.message-view__header{align-items:center;gap:var(--space-md);margin-bottom:var(--space-md);display:flex}.message-view__header h2{margin:0}.message-view__back{min-height:var(--touch-target-min);padding:var(--space-sm) var(--space-md);background:var(--color-bg-secondary);border:2px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-sm)}@media (width>=768px){.message-view__back{display:none}}.message-view__messages{flex:1;margin:0;padding:0;list-style:none;overflow-y:auto}.message-view__messages>li{padding:var(--space-sm) 0;border-bottom:1px solid var(--color-bg-secondary)}.message-view__messages>li:last-child{border-bottom:none}.message-view__sender{font-size:var(--font-size-sm);margin:0 0 var(--space-xs) 0;font-weight:700}.message-view__bot-tag{color:var(--color-text-muted);font-weight:400;font-size:var(--font-size-xs)}.message-view__time{font-size:var(--font-size-xs);color:var(--color-text-muted);margin-bottom:var(--space-xs);display:block}.message-view__body{white-space:pre-wrap;word-break:break-word;margin:0;line-height:1.5}.message-view__thread-label{margin:0 0 var(--space-xs);font-size:var(--font-size-xs);font-weight:700;display:inline-block}.encryption-notice,.encrypted-message{padding:var(--space-sm);border:2px solid var(--color-warning);border-radius:var(--radius-sm);color:var(--color-text);background:#fff7d6}.encryption-notice{margin-bottom:var(--space-md);font-weight:600}.message-view__empty{min-height:200px;color:var(--color-text-muted);justify-content:center;align-items:center;display:flex}.message-view__composer{gap:var(--space-sm);padding-top:var(--space-md);border-top:2px solid var(--color-border);margin-top:var(--space-md);align-items:flex-end;display:flex}.message-view__textarea{min-height:var(--touch-target-min);padding:var(--space-sm) var(--space-md);font-size:var(--font-size-base);font-family:var(--font-sans);border:2px solid var(--color-border);border-radius:var(--radius-md);resize:vertical;background-color:var(--color-bg);color:var(--color-text);flex:1}.message-view__textarea:focus{box-shadow:var(--focus-ring);outline:2px solid #0000}.message-view__composer .big-button{width:auto;min-width:120px;max-width:none}.message-view__messages details{padding:var(--space-sm)}.message-view__messages summary{cursor:pointer;font-size:var(--font-size-xs);color:var(--color-text-muted);min-height:var(--touch-target-min);align-items:center;display:flex}.search-page{max-width:720px}.search-page h2{margin-top:0}.search-results__group{margin-bottom:var(--space-lg)}.search-results__group h3{margin:0 0 var(--space-sm) 0;font-size:var(--font-size-sm);color:var(--color-text-muted);border-bottom:1px solid var(--color-border);padding-bottom:var(--space-xs)}.search-results__list{margin:0;padding:0;list-style:none}.search-results__link{gap:var(--space-xs);text-align:left;width:100%;padding:var(--space-sm) var(--space-md);min-height:var(--touch-target-min);background:var(--color-bg);border-radius:var(--radius-md);margin-bottom:var(--space-xs);font-size:var(--font-size-sm);border:2px solid #0000;flex-direction:column;display:flex}.search-results__link:hover{background-color:var(--color-bg-hover);border-color:var(--color-primary)}.search-results__sender{font-weight:700}.search-results__snippet{color:var(--color-text-secondary);line-height:1.4}.search-results__time{font-size:var(--font-size-xs);color:var(--color-text-muted)}.members-page h2{margin-top:0}.members-list{margin:0;padding:0;list-style:none}.members-list__item{align-items:center;gap:var(--space-md);padding:var(--space-sm) var(--space-md);min-height:var(--touch-target-min);border-bottom:1px solid var(--color-bg-secondary);flex-wrap:wrap;display:flex}.members-list__name{flex:1;font-weight:600}.members-list__id{font-size:var(--font-size-xs);color:var(--color-text-muted);overflow-wrap:anywhere}.members-list__flag{background-color:var(--color-warning);color:var(--color-text);padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);font-size:var(--font-size-xs);font-weight:700}.settings-page{max-width:480px}.settings-page h2{margin-top:0}.settings-section{margin-bottom:var(--space-xl)}.settings-section h3{margin:0 0 var(--space-sm) 0;border-bottom:1px solid var(--color-border);padding-bottom:var(--space-xs)}.radio-group{gap:var(--space-sm);margin-bottom:var(--space-md);flex-direction:column;display:flex}.radio-label{align-items:center;gap:var(--space-sm);min-height:var(--touch-target-min);padding:var(--space-sm);font-size:var(--font-size-sm);cursor:pointer;display:flex}.radio-label input[type=radio]{width:24px;height:24px;accent-color:var(--color-primary)}fieldset{border:2px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-md);margin:0 0 var(--space-md) 0}legend{font-weight:600;font-size:var(--font-size-sm);padding:0 var(--space-xs)}:root{--color-primary:#1a6b4e;--color-primary-hover:#145540;--color-success:#1d6b2e;--color-success-hover:#155221;--color-warning:#b8860b;--color-warning-hover:#946b09;--color-danger:#c42b2b;--color-danger-hover:#a12222;--color-error:var(--color-danger);--color-error-hover:var(--color-danger-hover);--color-text:#1a1a1a;--color-text-inverse:#faf9f7;--color-text-muted:#3a3a3a;--color-bg:#faf9f7;--color-bg-secondary:#f0eeeb;--color-bg-hover:#e6e3de;--color-border:#3a3a3a;--color-text-secondary:#2e2e2e;--font-sans:"Atkinson Hyperlegible Next", "Atkinson Hyperlegible", system-ui, sans-serif;--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;--font-size-xs:18px;--font-size-sm:20px;--font-size-base:24px;--font-size-lg:32px;--font-size-xl:48px;--font-size-2xl:56px;--space-xs:8px;--space-sm:12px;--space-md:24px;--space-lg:36px;--space-xl:48px;--space-2xl:60px;--touch-target-min:64px;--button-height:80px;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--focus-ring:0 0 0 3px var(--color-bg), 0 0 0 6px #1a6b4eb3}*,:before,:after{box-sizing:border-box}html{font-size:var(--font-size-base)}body{font-family:var(--font-sans);background-color:var(--color-bg);color:var(--color-text);-webkit-font-smoothing:antialiased;margin:0;line-height:1.4}:focus-visible,button:focus-visible,a:focus-visible{box-shadow:var(--focus-ring);outline:2px solid #0000}button{font-family:inherit;font-size:inherit;cursor:pointer;border-radius:var(--radius-md);min-height:var(--touch-target-min);padding:var(--space-md) var(--space-lg);border:none;font-weight:600;transition:background-color .2s,transform .1s}button:active{transform:scale(.98)}button:disabled{opacity:.5;cursor:not-allowed}.skip-link{background:var(--color-primary);color:var(--color-text-inverse);padding:var(--space-md);z-index:100;font-size:var(--font-size-base);position:absolute;top:-100px;left:0}.skip-link:focus{top:0}.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (prefers-reduced-motion:reduce){button{transition:none}button:active{transform:none}}@media (prefers-contrast:more){:root{--color-primary:#0d5639;--color-primary-hover:#0a4530;--color-border:#1a1a1a}:focus-visible,button:focus-visible,a:focus-visible{outline:4px solid var(--color-primary);outline-offset:2px;box-shadow:none}button{border:3px solid var(--color-text)}}
