/* Graphite is the default. These tokens also cover collaboration surfaces. */
:root {
  --theme-input-bg:#222325;
  --theme-control-bg:#303133;
  --theme-control-border:#454649;
  --theme-soft-accent:#2b302d;
  --theme-accent-text:#b9c6bc;
  --theme-popover-shadow:0 12px 40px #0005,0 2px 7px #0003;
  --theme-focus:#a6b9ac;
  --theme-danger:#e9a29e;
  --theme-subtle:#222425;
}
html[data-theme="light"] {
  color-scheme:light;
  --bg:#fbfbfa;
  --sidebar:#f0f1f0;
  --raised:#fff;
  --hover:#e9ecea;
  --line:#daddd9;
  --line-soft:#e7eae6;
  --text:#292c2d;
  --muted:#626b6a;
  --faint:#67706d;
  --sage:#4f6b55;
  --theme-input-bg:#fff;
  --theme-control-bg:#f2f3f1;
  --theme-control-border:#cdd2cd;
  --theme-soft-accent:#eef2eb;
  --theme-accent-text:#4e6854;
  --theme-popover-shadow:0 12px 40px #252f2118,0 2px 7px #252f210d;
  --theme-focus:#527b5c;
  --theme-danger:#a04138;
  --theme-subtle:#f4f5f2;
}

/* Theme picker stays independent of workspace renders and project state. */
.oak-theme-control{position:relative;flex:none}
.oak-theme-button{height:29px;display:inline-flex;align-items:center;gap:6px;padding:0 8px;color:var(--muted);font-size:11px;white-space:nowrap;border:1px solid var(--line);border-radius:5px}
.oak-theme-button:hover,.oak-theme-button[aria-expanded="true"]{background:var(--hover);color:var(--text);border-color:var(--theme-control-border)}
.oak-theme-button .icon{width:14px;height:14px}
.oak-theme-menu{position:absolute;z-index:55;right:0;top:calc(100% + 9px);width:224px;padding:6px;border:1px solid var(--theme-control-border);border-radius:9px;background:var(--raised);box-shadow:var(--theme-popover-shadow)}
.oak-theme-menu[hidden]{display:none}
.oak-theme-menu-title{padding:7px 9px 8px;color:var(--faint);font-size:10px;font-weight:600;letter-spacing:.05em;text-transform:uppercase}
.oak-theme-option{display:flex;align-items:center;gap:11px;padding:10px;width:100%;text-align:left;border-radius:5px;font-size:12px;line-height:1.35}
.oak-theme-option>.icon{width:17px;height:17px;color:var(--muted)}
.oak-theme-option>span:nth-child(2){flex:1}
.oak-theme-option small{display:block;margin-top:4px;font-size:10px;color:var(--muted);font-weight:400}
.oak-theme-option:hover,.oak-theme-option:focus-visible{background:var(--hover)}
.oak-theme-option[aria-checked="true"]{background:var(--theme-soft-accent)}
.oak-theme-check{visibility:hidden;color:var(--theme-accent-text);display:flex}
.oak-theme-check .icon{width:15px;height:15px}
.oak-theme-option[aria-checked="true"] .oak-theme-check{visibility:visible}
.oak-theme-announcement{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

/* Warm paper, graphite ink, and restrained project accents. */
html[data-theme="light"] ::selection{background:#d7e3d4;color:#203324}
html[data-theme="light"] :is(button,a,input,select,textarea,[contenteditable]):focus-visible{outline-color:var(--theme-focus)}
html[data-theme="light"] :is(input,textarea,select){background:var(--theme-input-bg);border-color:var(--theme-control-border)}
html[data-theme="light"] :is(input,textarea)::placeholder{color:var(--faint)}
html[data-theme="light"] .btn{background:var(--theme-control-bg);border-color:var(--theme-control-border)}
html[data-theme="light"] .btn:hover{background:#e8ebe6}
html[data-theme="light"] .btn.primary{background:#333836;border-color:#333836;color:#fff}
html[data-theme="light"] .btn.primary:hover{background:#252c28;border-color:#252c28}
html[data-theme="light"] .btn.ghost{background:transparent;border-color:transparent}
html[data-theme="light"] .btn.ghost:hover{background:var(--hover)}
html[data-theme="light"] .btn.danger{color:#963d35;border-color:#cfada5}
html[data-theme="light"] .chip{background:#edf0eb;color:#596159}
html[data-theme="light"] .chip.progress{background:#e6edf0;color:#416373}
html[data-theme="light"] .chip.review{background:#f0ecdf;color:#705d26}
html[data-theme="light"] .chip.done{background:#e5eee3;color:#426749}
html[data-theme="light"] .service{background:#eeefec;color:#5a6059}
html[data-theme="light"] .service.website{background:#e8edf3;color:#4c6079}
html[data-theme="light"] .service.seo{background:#efefdf;color:#616230}
html[data-theme="light"] .service.geo{background:#eee6f0;color:#71547c}
html[data-theme="light"] .service.automation{background:#e5eee8;color:#446653}
html[data-theme="light"] .service.beauty{background:#e6eee4;color:#49664b}
html[data-theme="light"] .service.nightlife{background:#eee7f1;color:#6d5779}
html[data-theme="light"] .service.logistics{background:#e5edf4;color:#42627b}
html[data-theme="light"] .service.oak-service{background:#eeedde;color:#606139}
html[data-theme="light"] .sidebar{border-right-color:#dfe3dc}
html[data-theme="light"] .brand-mark{background:#e6e9e2;border-color:#ccd3c8;color:#4b5946}
html[data-theme="light"] .nav-item{color:var(--muted)}
html[data-theme="light"] .nav-item:hover{background:#e6eae3;color:#343e33}
html[data-theme="light"] .nav-item.active{background:#dde3d9;color:#343e32}
html[data-theme="light"] .nav-item .icon{color:#5a6153}
html[data-theme="light"] .nav-item.active .icon{color:#4f6147}
html[data-theme="light"] :is(.nav-item .kbd,.nav-label,.nav-label button,.local-label,.profile-meta){color:#5a615a}
html[data-theme="light"] .team-label{color:#55634d}
html[data-theme="light"] .team-square{background:#e0e8db;border-color:#c5d0bf;color:#516449}
html[data-theme="light"] .avatar{background:#d8e1d4;color:#40543a}
html[data-theme="light"] .avatar.you{background:#d7e0d3}
html[data-theme="light"] .sidebar .profile .avatar{border-color:#ccd3c8}
html[data-theme="light"] .breadcrumb{color:var(--muted)}
html[data-theme="light"] .breadcrumb .current{color:#4c544a}
html[data-theme="light"] .breadcrumb .slash{color:#5c6059}
html[data-theme="light"] .save-state{color:var(--muted)}
html[data-theme="light"] .starred{color:#6e5d2a!important}
html[data-theme="light"] .cover{background:linear-gradient(113deg,#e8ece5,#eff1eb 37%,#e9ede5 74%,#e0e7dc);border-bottom-color:#dee4d7}
html[data-theme="light"] .cover:before{background:repeating-linear-gradient(0deg,transparent 0,transparent 37px,#31452a0a 38px,transparent 39px)}
html[data-theme="light"] .cover:after{border-color:#354a2b0b;background:linear-gradient(90deg,#32442a03,transparent);box-shadow:95px 0 0 #31452a02,190px 0 0 #31452a02}
html[data-theme="light"] .cover-word{color:#586253}
html[data-theme="light"] .page-emblem{background:#e2e9db;border-color:#b6c5a9;color:#4d6542}
html[data-theme="light"] :is(.page-heading p,.page-heading .date-label){color:var(--muted)}
html[data-theme="light"] .page-heading .eyebrow{color:#51644a}
html[data-theme="light"] .callout{background:#eff3eb;border-color:#d9e2d1}
html[data-theme="light"] .callout>.icon{color:#4e6546}
html[data-theme="light"] .callout strong{color:#3f5b35}
html[data-theme="light"] .callout span{color:#54634c}
html[data-theme="light"] .quick-link{background:linear-gradient(120deg,#fafaf7,#f3f5ef);border-color:#dce2d5}
html[data-theme="light"] .quick-link:hover{background:#eef3e8;border-color:#b9c9ab}
html[data-theme="light"] .quick-icon{background:#e6edde;border-color:#cfdcc1;color:#516542}
html[data-theme="light"] .quick-link:nth-child(2) .quick-icon{background:#ebe7ed;border-color:#d9cfdf;color:#695873}
html[data-theme="light"] .quick-link:nth-child(3) .quick-icon{background:#efeddc;border-color:#dfdbba;color:#646039}
html[data-theme="light"] .quick-link small{color:var(--muted)}
html[data-theme="light"] .quick-link>.icon{color:#57624e}
html[data-theme="light"] .section-heading h2>.icon{color:var(--muted)}
html[data-theme="light"] .database-toolbar{border-bottom-color:#d4dccb}
html[data-theme="light"] .tab{color:var(--muted)}
html[data-theme="light"] .tab.active{color:#3b4b31}
html[data-theme="light"] .tab.active:after{background:#657d51}
html[data-theme="light"] .database-controls select{background:var(--bg);border-color:var(--line)}
html[data-theme="light"] .project-table th{color:var(--muted)}
html[data-theme="light"] .project-table tr:hover td{background:#f3f6ef}
html[data-theme="light"] .project-name .icon{color:#55634c}
html[data-theme="light"] .project-table td:nth-child(4){color:var(--muted)}
html[data-theme="light"] .progress-wrap{color:var(--muted)}
html[data-theme="light"] .progress-track{background:#e0e7d9}
html[data-theme="light"] .progress-track i{background:#849d75}
html[data-theme="light"] :is(.new-row,.board-add){color:var(--muted)}
html[data-theme="light"] .new-row:hover{background:#edf2e8;color:#4c653f}
html[data-theme="light"] .checkbox{border-color:#96a78a}
html[data-theme="light"] .checkbox.checked{background:#6f8a5f;border-color:#6f8a5f;color:#fff}
html[data-theme="light"] .task-row.completed .task-text{color:#586253}
html[data-theme="light"] .task-due{color:var(--muted)}
html[data-theme="light"] .task-due.today{color:#6f5d2a}
html[data-theme="light"] .doc-list-item>.icon{color:#54634d}
html[data-theme="light"] .doc-list-item small{color:var(--muted)}
html[data-theme="light"] .page-footer{color:var(--muted)}
html[data-theme="light"] .heading-icon{color:#506446}
html[data-theme="light"] .board-column.drag-over{background:#e8f0e0;outline-color:#95ab86}
html[data-theme="light"] .column-heading .count{color:var(--muted)}
html[data-theme="light"] .project-card{background:#fff;border-color:#dce4d4;box-shadow:0 2px 3px #1f321209}
html[data-theme="light"] .project-card:hover{background:#fbfdf8;border-color:#b1c7a0}
html[data-theme="light"] :is(.project-card>p,.project-card .card-bottom){color:var(--muted)}
html[data-theme="light"] .document-card{background:#fff;border-color:#dce5d4}
html[data-theme="light"] .document-card:hover{border-color:#acc597}
html[data-theme="light"] .document-preview{color:#536448;background:#edf3e6;border-bottom-color:#d7e2ce}
html[data-theme="light"] .document-card:nth-child(2n) .document-preview{color:#675971;background:#f0edf4}
html[data-theme="light"] .document-preview b{color:#506544}
html[data-theme="light"] .document-card:nth-child(2n) .document-preview b{color:#6a5974}
html[data-theme="light"] .document-card small{color:var(--muted)}
html[data-theme="light"] .doc-title{background:transparent;border:0}
html[data-theme="light"] .doc-info{color:var(--muted)}
html[data-theme="light"] :is(.block-body:empty:before,.project-note-grid .block-body:empty:before){color:#586153}
html[data-theme="light"] .document-block.callout-block{background:#f0f5ea;border-color:#d2e0c7}
html[data-theme="light"] .document-block.callout-block>.icon{color:#4d6543}
html[data-theme="light"] .document-block .checked+.block-body{color:#57624e}
html[data-theme="light"] .block-add button{color:#52644a}
html[data-theme="light"] .block-add button:hover{color:#3f5f33}
html[data-theme="light"] .task-project{color:var(--muted)}
html[data-theme="light"] dialog{background:#fdfefa;border-color:#dce6d2;box-shadow:0 30px 100px #1b2c1830}
html[data-theme="light"] dialog::backdrop{background:#29352755}
html[data-theme="light"] .form-field label{color:#506447}
html[data-theme="light"] .dialog-actions{border-top-color:#e3eadb}
html[data-theme="light"] .dialog-note{color:var(--muted)}
html[data-theme="light"] .search-box{border-bottom-color:#e0e9d6}
html[data-theme="light"] .search-box input{background:transparent;border:0}
html[data-theme="light"] .search-box>.icon{color:#526446}
html[data-theme="light"] .search-box kbd{color:#566250;border-color:#ccd6c3;background:#f0f4eb}
html[data-theme="light"] :is(.search-result:hover,.search-result:focus){background:#eaf1e2}
html[data-theme="light"] .search-result small{color:var(--muted)}
html[data-theme="light"] .search-label{color:var(--muted)}
html[data-theme="light"] .settings-section{border-bottom-color:#e1e9d8}
html[data-theme="light"] .settings-section p{color:var(--muted)}
html[data-theme="light"] #toast{background:#333f2c;color:#f3f7ef;box-shadow:0 5px 25px #26332025}
html[data-theme="light"] .back-link{color:var(--muted)}
html[data-theme="light"] .project-emblem{background:#e8f0e0;border-color:#cadbc0;color:#466637}
html[data-theme="light"] .project-emblem.nightlife{background:#eee6f3;border-color:#d9cbe2;color:#75508a}
html[data-theme="light"] .project-emblem.logistics{background:#e4eef7;border-color:#c6dbe9;color:#3b637e}
html[data-theme="light"] .project-emblem.oak-service{background:#ebeedf;border-color:#d3dac0;color:#56633c}
html[data-theme="light"] .project-properties>div>span:first-child{color:var(--muted)}
html[data-theme="light"] .property-value{color:#506446}
html[data-theme="light"] .project-tasks .task-empty>span{background:#eef3e8;color:#53634b}
html[data-theme="light"] .project-tasks .task-empty strong{color:#506543}

@media(max-width:960px){.oak-theme-label{display:none}.oak-theme-button{width:29px;padding:0;justify-content:center}}
@media(max-width:700px){.oak-theme-button{width:38px;height:38px;border-color:transparent}.oak-theme-button .icon{width:17px;height:17px}.oak-theme-option{min-height:54px;font-size:14px}.oak-theme-option small{font-size:11px}.oak-theme-menu{position:fixed;top:60px;right:12px;max-width:calc(100vw - 24px)}}
@media(prefers-reduced-motion:no-preference){.oak-theme-button,.oak-theme-option{transition:background .15s ease,color .15s ease}}

html[data-theme="light"] :is(.presence-avatar,.actor-avatar,.live-typing){color:color-mix(in srgb,var(--person-color,#a6c2aa) 45%,#18231c)}

/* Narrow layouts: keep long names and controls inside their own scroll regions. */
.main .page-heading>div,.main .task-text,.main .doc-list-item strong,.main .project-properties>div{min-width:0}.main .page-heading h1,.main .task-text,.main .project-properties .property-value,.main .document-card h2{overflow-wrap:anywhere}html[data-theme] .od-panel-header>div{flex:1;min-width:0}html[data-theme] .od-panel-page{max-width:100%}
@media(max-width:768px){
  .main .content{min-width:0;max-width:100%}.main .section-heading{flex-wrap:wrap}.main .section-heading>.flex,.main .project-title-row{flex-wrap:wrap}.main .section-heading>.flex{max-width:100%;gap:7px}.main .section-heading>.flex .btn{min-height:40px}.main .task-scope{display:flex;flex-wrap:wrap;width:100%;max-width:100%;gap:4px}.main .task-scope>a{min-width:0;text-align:center;white-space:normal}.main .task-view-switch{min-width:0}.main .database-toolbar{flex-wrap:wrap}.main .database-toolbar>.small{margin-left:auto}.main #task-project-filter{max-width:100%;min-height:40px;min-width:0}.main .project-properties{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 14px}.main .project-properties button{max-width:100%}.main .document-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.main .doc-list-item strong{overflow-wrap:anywhere}.main .doc-list-item small{flex:none}.main .task-row{flex-wrap:wrap;column-gap:10px}.main .task-text{flex-basis:calc(100% - 140px)}.main .task-assignee-stack{margin-left:auto}.main .task-due{white-space:nowrap}.main .page-heading p,.main .project-card h3{overflow-wrap:anywhere}.main .docs-toolbar{min-width:0}.main .docs-search{min-width:0;max-width:100%}html[data-theme] .sidebar{padding-bottom:env(safe-area-inset-bottom)}html[data-theme] .sidebar-scroll{min-height:0;overscroll-behavior:contain}html[data-theme] .sidebar-bottom{flex-shrink:0}html[data-theme] .dialog-header h2{min-width:0;overflow-wrap:anywhere}html[data-theme] .dialog-header .icon-button{flex:none}html[data-theme] .dialog-body{overflow-wrap:anywhere}html[data-theme] .task-assignee-picker>div{grid-template-columns:repeat(2,minmax(0,1fr))}html[data-theme] .task-assignee-picker label{min-width:0;min-height:44px}html[data-theme] .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}html[data-theme] .help-search input{font-size:16px}html[data-theme] .help-shortcut-row>*{min-width:0}html[data-theme] .help-shortcut-row>span{overflow-wrap:anywhere}.main .oak-canvas{min-height:0}.main .oak-canvas .oc-viewport{min-height:180px}.main .oc-header{flex-wrap:wrap;gap:12px}.main .oc-header-actions{flex-wrap:wrap}.main .oc-header>div{min-width:0}.main .oc-footer{flex-wrap:wrap;gap:5px}body:has(#oak-messenger:not([hidden])) .main .oc-instruction{bottom:132px;max-width:calc(100% - 24px)}
}
@media(max-width:420px){.main .task-scope>a{flex:1;padding-inline:9px}.main .task-view-switch{flex-basis:100%;justify-content:flex-end;border-top:1px solid var(--line-soft);padding-top:3px}.main .document-grid{grid-template-columns:minmax(0,1fr)}.main .task-row .task-assignee-stack{order:3;margin-left:30px}.main .task-row .task-due{order:4;margin-left:auto}.main .task-row .task-text{flex-basis:calc(100% - 32px)}.main .task-row>.chip{display:none}html[data-theme] .form-grid{grid-template-columns:minmax(0,1fr)}.main .project-properties{gap:18px 11px}.main .project-title-row>.flex{flex-wrap:wrap;max-width:100%}.main .topbar .breadcrumb{overflow:hidden}.main .topbar .breadcrumb>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}
@media(max-width:768px) and (max-height:600px){.main .oak-canvas{padding-top:14px;padding-bottom:12px;min-height:0}.main .oak-canvas .oc-viewport{min-height:0}.main .oak-canvas .oc-header{flex-wrap:nowrap;padding-bottom:12px;gap:8px}.main .oak-canvas .oc-header h1{font-size:22px}.main .oak-canvas .oc-header p,.main .oak-canvas .oc-eyebrow,.main .oak-canvas .oc-footer,.main .oak-canvas .oc-instruction{display:none}.main .oak-canvas .oc-header-actions{gap:5px;flex-wrap:nowrap}.main .oak-canvas .oc-button{padding-inline:8px;font-size:11px}.main .oak-canvas .oc-controls{bottom:12px;left:10px;right:auto}body:has(#oak-messenger:not([hidden])) .main .oak-canvas .oc-controls{bottom:62px}}
