:root {
    color-scheme: light;
    font-family: Consolas, 'Liberation Mono', monospace;
    font-size: 14px;
    color: #26352b;
    background: #f7f8f5;
    --accent: #3e6247;
    --dim: #60705e;
    --line: #cbd5c5;
}
* { box-sizing: border-box; }
body { margin: 0; user-select: none; -webkit-user-select: none; }
body[data-authenticated=false] { min-height: 100dvh; display: grid; place-items: center; padding: 24px; }
.auth-terminal { width: min(100%, 640px); }
form, p { margin: 0; }
.input-line { display: flex; gap: 10px; align-items: center; color: var(--accent); }
.auth-form .input-line { padding: 12px 0; border-bottom: 1px solid var(--line); }
.auth-form .input-line:focus-within { border-color: #587b51; }
input { font: inherit; min-width: 0; width: 100%; border: 0; outline: 0; background: transparent; color: #24352b; padding: 0; caret-color: var(--accent); user-select: text; -webkit-user-select: text; border-radius: 0; }
input::placeholder { color: #687861; }
input[readonly] { color: var(--dim); }
body[data-authenticated=true] { position: fixed; top: var(--screen-top, 0px); left: 0; width: 100%; height: var(--screen-height, 100dvh); overflow: hidden; }
.terminal-dock { position: absolute; bottom: 0; left: 0; width: 100%; z-index: 5; background: #f7f8f5; }
#command-form { position: relative; margin: 0; border: 0; }
#command-form .input-line { height: 36px; padding: 0 6px; border: 0; }
.command-status { position: absolute; left: 0; bottom: 100%; max-width: 100%; padding: 5px 8px; background: #f7f8f5; color: var(--dim); font-size: 11px; line-height: 1.5; overflow-wrap: anywhere; }
.command-status:empty { display: none; }
.secret-entry #command-prefix { color: #86661f; }
#command-options { position: absolute; z-index: 10; left: 0; bottom: 100%; width: min(100%, 720px); max-height: min(270px, calc(var(--screen-height, 100dvh) - 50px)); border: 1px solid #dce3d6; background: #ffffff; padding: 5px; font-size: 12px; pointer-events: none; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: var(--line) transparent; box-shadow: 0 -8px 24px #273d1712; }
.option { display: flex; justify-content: space-between; gap: 20px; padding: 10px 12px; color: #466044; }
.option span:last-child { color: #687861; }
.option[aria-selected=true] { color: #254a2c; background: #e5eedf; }
.option[aria-selected=true] span:last-child { color: #536b48; }
.error { font-size: 12px; color: #a03b30; line-height: 1.6; margin-top: 12px; }
.error:empty { display: none; }
.panes { position: absolute; inset: 6px 6px 42px; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); gap: 6px; }
.pane { position: relative; min-width: 0; min-height: 0; border: 1px solid #d2dccb; overflow: hidden; }
.pane.active { border-color: #789569; }
.pane-label { position: absolute; top: 0; right: 0; padding: 9px 12px; color: #526947; font-size: 12px; background: #f7f8f5; z-index: 1; }
.pane-body { display: flex; flex-direction: column; height: 100%; padding: 12px; min-height: 0; min-width: 0; }
.mail-heading { padding: 0 120px 13px 0; display: flex; justify-content: space-between; gap: 18px; font-size: 11px; color: var(--dim); flex-wrap: wrap; }
.mail-notice { font-size: 12px; color: var(--dim); line-height: 1.7; padding: 12px 0; }
.mail-notice:empty { display: none; }
.mail-layout { display: grid; grid-template-columns: minmax(0, 1fr); flex: 1; min-height: 0; min-width: 0; }
.mail-layout.has-preview { grid-template-columns: minmax(220px, 34%) minmax(0, 1fr); }
.mail-list { position: relative; overflow: auto; min-height: 0; min-width: 0; scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
.mail-row { display: grid; grid-template-columns: 12px minmax(100px, 24%) minmax(0, 1fr) 66px; gap: 12px; align-items: center; padding: 12px 8px; font-size: 12px; line-height: 1.5; border-bottom: 1px solid #e2e8dc; }
.mail-row span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mail-row[aria-selected=true] { background: #e5eedf; color: #263e24; }
.mail-row .mail-unread { color: var(--accent); }
.mail-date, .mail-from { color: #63735c; }
.mail-date { font-size: 10px; text-align: right; }
.has-preview .mail-row { grid-template-columns: 8px minmax(0, 1fr) 58px; gap: 5px 8px; }
.has-preview .mail-subject { grid-column: 2 / 4; grid-row: 2; }
.has-preview .mail-date { grid-column: 3; grid-row: 1; }
.mail-reader { min-width: 0; min-height: 0; overflow: auto; border-left: 1px solid #d2dccb; padding: 18px 24px; scrollbar-width: thin; scrollbar-color: var(--line) transparent; user-select: text; -webkit-user-select: text; }
.mail-reader h1 { font: 17px/1.5 Consolas, 'Liberation Mono', monospace; margin: 0 0 16px; overflow-wrap: anywhere; }
.mail-meta { white-space: pre-wrap; overflow-wrap: anywhere; color: var(--dim); font-size: 11px; line-height: 1.8; margin-bottom: 25px; }
.mail-text { font: 13px/1.8 Consolas, 'Liberation Mono', monospace; white-space: pre-wrap; overflow-wrap: anywhere; margin: 0; }
.mail-key { font-size: 10px; color: #687861; padding-top: 12px; line-height: 1.5; }
[hidden] { display: none !important; }
.calendar-body { display: block; overflow: auto; padding: 22px; scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
.calendar-heading { font: 16px/1.5 Consolas, 'Liberation Mono', monospace; margin: 0 120px 6px 0; }
.calendar-source { color: var(--dim); font-size: 11px; line-height: 1.8; }
.calendar-empty { margin: 30px 0 10px; font-size: 13px; }
.calendar-events { width: 100%; border-collapse: collapse; margin-top: 26px; font-size: 13px; text-align: left; }
.calendar-events th { color: var(--dim); font-size: 10px; font-weight: normal; padding: 0 0 12px; }
.calendar-events td { border-top: 1px solid #dce3d6; padding: 18px 0; vertical-align: top; line-height: 1.7; }
.calendar-events .calendar-time { width: 160px; padding-right: 24px; white-space: nowrap; color: var(--accent); }
.calendar-details { margin-top: 5px; color: var(--dim); font-size: 11px; }
@media (max-width: 680px) {
    .calendar-body { padding: 14px; }
    .calendar-heading { font-size: 14px; margin-right: 95px; }
    .calendar-events { font-size: 12px; }
    .calendar-events .calendar-time { width: 105px; padding-right: 12px; font-size: 11px; }
}
@media (max-width: 680px) {
    .pane-body { padding: 10px; }
    .mail-heading { font-size: 10px; gap: 6px; padding-right: 90px; }
    .pane-label { padding: 9px; font-size: 11px; }
    .mail-row { grid-template-columns: 8px minmax(0, 1fr) 58px; gap: 5px 8px; }
    .mail-subject { grid-column: 2 / 4; grid-row: 2; }
    .mail-date { grid-column: 3; grid-row: 1; }
    .mail-layout.has-preview { grid-template-columns: minmax(0, 1fr); }
    .has-preview .mail-list { display: none; }
    .mail-reader { border-left: 0; padding: 10px 0; }
    .mail-key { font-size: 9px; }
    #command-form input { font-size: 16px; }
    .option { font-size: 11px; }
}

button { font: inherit; color: inherit; }
button:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.mobile-navigation, .mobile-submit, .mobile-cancel, .mail-touch { display: none; }
@media (max-width: 680px), (pointer: coarse) {
    body[data-authenticated=false] input { font-size: 16px; }
    .terminal-dock { padding-bottom: env(safe-area-inset-bottom, 0px); }
    #command-form .input-line { min-height: 52px; height: 52px; padding: 0 10px; gap: 8px; }
    #command-form input { font-size: 16px; }
    .mobile-submit, .secret-entry .mobile-cancel { display: inline-grid; place-items: center; flex: 0 0 40px; height: 44px; padding: 0; border: 0; border-radius: 10px; background: transparent; color: var(--accent); font-size: 24px; }
    .mobile-submit:active, .mobile-cancel:active { background: #e5eedf; }
    .panes { inset: 6px 6px calc(58px + env(safe-area-inset-bottom, 0px)); display: block; }
    .pane { width: 100%; height: 100%; background: #fff; border-radius: 10px; }
    .pane:not(.active) { display: none; }
    .pane-label { background: #fff; }
    .pane-body { padding: 16px 12px 76px; }
    .calendar-body { padding: 20px 16px 80px; }
    .calendar-heading { font-size: 15px; }
    .calendar-events td { padding-top: 18px; padding-bottom: 18px; }
    .calendar-details { line-height: 1.8; }
    .mail-layout.has-preview { grid-template-columns: minmax(0, 1fr); }
    .has-preview .mail-list { display: none; }
    .mail-reader { border: 0; padding: 12px 4px; }
    .mail-row { cursor: pointer; min-height: 68px; font-size: 13px; }
    .mail-row:active { background: #e5eedf; }
    .mail-key { display: none; }
    .mail-touch { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 6px; padding-top: 10px; }
    .mail-touch button { min-height: 44px; padding: 8px 12px; background: #f2f5ee; border: 1px solid #dce3d6; border-radius: 8px; font-size: 11px; }
    #command-options { pointer-events: auto; max-height: min(280px, calc(var(--screen-height, 100dvh) - 64px)); }
    .option { min-height: 48px; align-items: center; font-size: 12px; }
    .command-status { max-width: calc(100% - 10px); }
    .mobile-navigation { display: block; position: absolute; inset: 0; z-index: 20; pointer-events: none; }
    .secret-entry .mobile-navigation { display: none; }
    .radial-backdrop { position: absolute; inset: 0; background: #f7f8f5c9; backdrop-filter: blur(4px); pointer-events: auto; }
    .radial-anchor { position: absolute; left: 50%; bottom: calc(64px + env(safe-area-inset-bottom, 0px)); width: 52px; height: 52px; transform: translateX(-50%); --radius: min(124px, calc((100vw - 88px) / 2)); --diagonal: calc(var(--radius) * .7071); }
    .radial-trigger { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; width: 52px; height: 52px; border: 1px solid #bdcbb4; border-radius: 50%; padding: 0; background: #edf3e6; box-shadow: 0 3px 12px #30451b14; color: #3e6247; pointer-events: auto; touch-action: none; -webkit-touch-callout: none; user-select: none; }
    .radial-trigger>span { font-size: 23px; line-height: 1; }
    .radial-trigger>small { font-size: 9px; margin-top: 2px; }
    .radial-trigger[aria-expanded=true] { background: #3e6247; border-color: #3e6247; color: #fff; }
    .radial-actions { position: absolute; inset: 0; }
    .radial-item { position: absolute; top: 50%; left: 50%; width: 76px; min-height: 78px; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 0 2px; border: 0; background: transparent; color: #34482d; font-size: 10px; line-height: 1.3; text-align: center; pointer-events: auto; touch-action: none; transform: translate(-50%, -50%) translate(var(--x), var(--y)); }
    .radial-icon { display: grid; place-items: center; width: 50px; height: 50px; background: #fff; border: 1px solid #cbd5c5; border-radius: 50%; font-size: 24px; box-shadow: 0 4px 14px #30451b10; }
    .radial-item.is-target .radial-icon, .radial-item:focus-visible .radial-icon, .radial-item:active .radial-icon { background: #3e6247; color: #fff; border-color: #3e6247; }
    .radial-item-0 { --x: calc(-1 * var(--radius)); --y: 0px; }
    .radial-item-1 { --x: calc(-1 * var(--diagonal)); --y: calc(-1 * var(--diagonal)); }
    .radial-item-2 { --x: 0px; --y: calc(-1 * var(--radius)); }
    .radial-item-3 { --x: var(--diagonal); --y: calc(-1 * var(--diagonal)); }
    .radial-item-4 { --x: var(--radius); --y: 0px; }
}

/* Numbered pane navigation and document workspace. */
.pane.active { border-color: #537948; box-shadow: inset 0 0 0 1px #537948; }
.pane.pane-candidate { outline: 3px dashed #769267; outline-offset: -4px; }
.pane:focus, .pane-body:focus, .mail-list:focus, .mail-reader:focus { outline: none; }
#command-prefix { max-width: 35%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.mail-row.unread .mail-subject { font-weight: 600; }
.mail-row .mail-unread { font-size: 20px; font-weight: bold; }
.doc-body { padding: 14px 14px 10px; }
.doc-heading { display: flex; gap: 15px; justify-content: space-between; padding-right: 95px; font-size: 11px; line-height: 1.6; margin-bottom: 12px; }
.doc-filename { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.doc-state { color: var(--dim); white-space: nowrap; }
.doc-toolbar { display: flex; gap: 5px; flex-wrap: wrap; padding-bottom: 10px; }
.doc-toolbar button { min-height: 32px; min-width: 32px; padding: 5px 9px; border: 1px solid #d2dccb; background: #fff; border-radius: 5px; font-size: 11px; cursor: pointer; }
.doc-toolbar button:hover { background: #e5eedf; }
.doc-work { flex: 1; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); min-height: 0; border: 1px solid #dce3d6; }
.doc-source { display: block; width: 100%; height: 100%; min-width: 0; min-height: 0; border: 0; resize: none; outline: none; background: #fff; padding: 20px; font: 13px/1.8 Consolas, monospace; color: #29382b; tab-size: 4; user-select: text; }
.doc-preview { min-width: 0; overflow: auto; border-left: 1px solid #dce3d6; background: #fff; padding: 24px; font: 15px/1.75 Georgia, serif; color: #28332a; user-select: text; overflow-wrap: anywhere; }
.doc-preview:empty::before { content: 'Preview'; color: #8a9385; font: 12px Consolas, monospace; }
.doc-preview h1, .doc-preview h2, .doc-preview h3 { line-height: 1.3; margin: 1em 0 .6em; }
.doc-preview h1:first-child { margin-top: 0; }
.doc-preview p { margin: .7em 0; }
.doc-preview pre { white-space: pre-wrap; padding: 14px; background: #f2f5ee; }
.doc-preview code { font: .88em Consolas, monospace; background: #f2f5ee; }
.doc-preview table { width: 100%; border-collapse: collapse; }
.doc-preview td, .doc-preview th { border: 1px solid #d2dccb; padding: 6px 10px; }
.doc-preview blockquote { border-left: 3px solid #aabc9d; margin-left: 0; padding-left: 16px; color: #62715a; }
.doc-preview .katex-display { overflow-x: auto; overflow-y: hidden; padding: 8px 0; }
.doc-key { font-size: 9px; color: var(--dim); padding-top: 8px; }
.preview-only .doc-work { grid-template-columns: minmax(0,1fr); }
.preview-only .doc-source { display: none; }
.preview-only .doc-preview { border-left: 0; }
.files-body { padding: 16px; }
.files-path { padding: 0 100px 18px 0; font-size: 12px; color: var(--accent); overflow-wrap: anywhere; }
.file-tree { flex: 1; overflow: auto; min-height: 0; outline: none; font-size: 12px; }
.file-row { display: grid; grid-template-columns: 14px minmax(0,1fr) 50px; align-items: center; gap: 8px; padding: 12px; border-bottom: 1px solid #e2e8dc; cursor: pointer; }
.file-row>span { overflow-wrap: anywhere; }
.file-row[aria-selected=true] { background: #e5eedf; color: #254a2c; }
.choice-arrow { font-size: 21px; color: var(--accent); }
.file-kind { color: var(--dim); font-size: 10px; text-align: right; }
.files-key { font-size: 9px; color: var(--dim); padding-top: 12px; }
@media (max-width: 680px), (pointer: coarse) {
    .doc-body { padding: 14px 12px 78px; }
    .doc-heading { flex-wrap: wrap; gap: 3px; }
    .doc-work { grid-template-columns: minmax(0,1fr); }
    .doc-source { font-size: 16px; padding: 14px; }
    .doc-preview { display: none; padding: 18px; }
    .preview-only .doc-preview { display: block; }
    .doc-toolbar button { min-height: 42px; min-width: 42px; }
    .doc-key { display: none; }
    .files-body { padding-bottom: 78px; }
    .file-row { min-height: 52px; font-size: 13px; }
}

.doc-preview img { display:block; max-width:100%; height:auto; margin:1em 0; }
.doc-body.image-drop { outline:2px dashed var(--accent); outline-offset:-8px; }

/* Shared dialogs and touch actions. */
.app-modal { width:min(620px,calc(100vw - 28px)); max-height:calc(100dvh - 32px); overflow:auto; border:1px solid var(--line); border-radius:18px; padding:28px; color:#26352b; background:#fff; box-shadow:0 24px 90px #19321b30; user-select:text; animation:modal-in .18s ease-out; }
.app-modal::backdrop { background:#20311e55; backdrop-filter:blur(4px); }
.app-modal h2 { font:600 22px/1.3 system-ui; margin:0 0 10px; }
.app-modal p { font:13px/1.6 system-ui; overflow-wrap:anywhere; }
.modal-fields { display:grid; gap:16px; margin:22px 0; }
.modal-fields label { display:grid; gap:7px; font:13px system-ui; }
.modal-fields input,.modal-fields textarea,.modal-fields select { width:100%; padding:12px; color:#26352b; background:#f7f8f5; border:1px solid var(--line); border-radius:8px; font:16px/1.5 system-ui; user-select:text; }
.modal-fields textarea { min-height:220px; resize:vertical; }
.modal-fields :focus { outline:2px solid #789569; outline-offset:1px; }
.modal-actions { display:flex; gap:10px; justify-content:flex-end; margin-top:20px; }
.modal-actions button,.module-actions button,.file-actions { border:1px solid var(--line); border-radius:8px; background:#f5f8f1; color:#334a2d; padding:10px 14px; cursor:pointer; font:13px system-ui; }
.modal-actions .primary { background:#3e6247; color:white; }
.modal-actions .danger { background:#a33229; color:white; }
.modal-error { color:#a33229; }
.module-actions { display:flex; gap:8px; flex-wrap:wrap; margin:0 0 12px; }
.file-row { grid-template-columns:14px minmax(0,1fr) 50px 40px; }
.file-actions { padding:5px; font-size:22px; }
.pane-tabs { display:none; }
@keyframes modal-in { from { opacity:0; transform:translateY(12px) scale(.97); } to { opacity:1; transform:none; } }
@keyframes radial-in { from { opacity:0; transform:scale(.78); } to { opacity:1; transform:scale(1); } }
@media (max-width:680px), (pointer:coarse) {
    #command-form { display:none; }
    .terminal-dock { pointer-events:none; background:none; }
    .command-status { position:fixed; left:12px; right:12px; bottom:128px; border-radius:10px; box-shadow:0 3px 18px #21332120; }
    .panes { display:flex; gap:10px; inset:6px 6px calc(58px + env(safe-area-inset-bottom,0px)); overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory; scrollbar-width:none; overscroll-behavior-x:contain; }
    .panes::-webkit-scrollbar { display:none; }
    .panes .pane,.panes .pane:not(.active) { display:block; flex:0 0 100%; width:100%; height:100%; scroll-snap-align:start; scroll-snap-stop:always; }
    .pane-tabs { display:flex; position:absolute; left:8px; right:8px; bottom:calc(8px + env(safe-area-inset-bottom,0px)); gap:6px; overflow-x:auto; justify-content:center; }
    .pane-tabs button { min-height:40px; padding:9px 15px; background:#edf3e6; color:#526947; border:1px solid #d2dccb; border-radius:20px; font:12px system-ui; transition:background .18s,color .18s; }
    .pane-tabs button[aria-current=true] { background:#3e6247; color:white; }
    .radial-actions:not([hidden]) { animation:radial-in .2s cubic-bezier(.16,1,.3,1); transform-origin:center; }
    .radial-trigger { transition:transform .18s,background .18s; }
    .radial-trigger[aria-expanded=true] { transform:scale(1.12); }
    .radial-closing .radial-actions { opacity:0; transform:scale(.78); transition:opacity .16s,transform .16s; pointer-events:none; }
    .radial-closing .radial-item,.radial-closing .radial-backdrop { pointer-events:none; }
    .radial-backdrop { transition:opacity .16s; }
    .radial-closing .radial-backdrop { opacity:0; }
    .app-modal { padding:22px 18px; border-radius:16px; max-height:calc(var(--screen-height,100dvh) - 24px); }
    .modal-actions button { min-height:46px; flex:1; }
    .module-actions button,.file-actions { min-height:44px; }
    .files-key { display:none; }
    .doc-heading { padding-right:80px; }
}
@media (prefers-reduced-motion:reduce) {
    *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
}
