
:root{--bg:#f6f7f4;--paper:#fff;--ink:#202b28;--muted:#626e68;--line:#e0e6df;--green:#286147;--soft:#eaf1e9;--sand:#f7f0e3;--orange:#885524;--radius:16px}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button,input,select,textarea{font:inherit}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
button,a{touch-action:manipulation}
button{cursor:pointer;color:inherit}
button{transition:background .16s,border-color .16s}
button:disabled{cursor:default;opacity:.6}
button:hover{filter:brightness(.97)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #81aa91;outline-offset:3px}
button svg{pointer-events:none}
svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle;flex-shrink:0}
button{border:0;background:none}
a{color:var(--green)}
h1,h2,h3,p{margin:0}
h1{font-size:36px;line-height:1.15;letter-spacing:-1.2px;font-weight:650}
h2{font-size:18px;letter-spacing:-.25px}
h3{font-size:16px}
small,.small{font-size:12px}
.muted{color:var(--muted)}
.eyebrow{text-transform:uppercase;letter-spacing:1.7px;font-size:11px;font-weight:750;color:var(--muted)}
.row{display:flex;align-items:center;gap:10px}
.between{justify-content:space-between}
.wrap{flex-wrap:wrap}
.btn{min-height:44px;border-radius:9px;padding:10px 15px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);background:var(--paper);font-weight:600;font-size:13px}
.btn.primary{background:var(--green);border-color:var(--green);color:#fff}
.btn.soft{background:var(--soft);border-color:transparent;color:var(--green)}
.iconbtn{width:44px;height:44px;border-radius:9px;display:inline-grid;place-items:center}
.pill{padding:4px 9px;border-radius:6px;font-size:11px;font-weight:650;background:var(--soft);color:var(--green);white-space:nowrap}
.pill.demo{background:#eeeee8;color:#646659}
.dot{width:8px;height:8px;border-radius:50%;display:inline-block;flex-shrink:0}
.demo-bar{height:auto;min-height:37px;background:#e9eee7;border-bottom:1px solid #d8e0d4;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 24px;color:#405044;font-size:12px}
.demo-bar button{font-size:12px;text-decoration:underline;min-height:28px}
.shell{display:grid;grid-template-columns:220px minmax(0,1fr);min-height:calc(100vh - 37px)}
.sidebar{padding:27px 16px 20px;border-right:1px solid var(--line);background:#fafbf8;display:flex;flex-direction:column;gap:26px}
.brand{display:flex;align-items:center;gap:10px;padding:0 12px;font-size:23px;font-weight:750;letter-spacing:-1px}
.brandmark{background:var(--green);color:#fff;border-radius:11px;padding:8px;display:grid;place-items:center}
.brandmark svg{width:22px;height:22px}
.nav-label{padding:0 13px;margin:18px 0 9px}
.navbtn{width:100%;display:flex;align-items:center;gap:11px;min-height:44px;padding:9px 12px;border-radius:8px;text-align:left;font-size:13px;color:#57635c;margin:3px 0}
.navbtn.active{background:#e6eee4;color:#234f36;font-weight:700}
.navbtn .count{margin-left:auto;font-size:11px;color:var(--muted)}
.navbtn:hover{background:#eef1eb}
.sidefoot{margin-top:auto;padding:16px 10px 0;border-top:1px solid var(--line);font-size:12px}
.avatar{background:#e5e9df;width:33px;height:33px;border-radius:50%;display:grid;place-items:center;font-weight:700}
.workspace{min-width:0}
.topbar{padding:18px 32px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fafbf8}
.crumb{font-size:13px;color:var(--muted)}
.layoutswitch{display:flex;background:#edf0e9;border-radius:8px;padding:3px}
.layoutswitch button{min-height:34px;font-size:12px;padding:5px 12px;border-radius:6px}
.layoutswitch .active{background:#fff;color:var(--green);box-shadow:0 1px 3px #0000000d}
.content{padding:30px 32px 40px;max-width:1600px;margin:auto}
.heading{margin-bottom:25px}
.heading .eyebrow{margin-bottom:10px}
.heading p{margin-top:10px;color:var(--muted)}
.columns{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:25px}
.maincol{min-width:0}
.welcome{border:1px solid #dce6d8;background:#edf3e9;border-radius:var(--radius);padding:20px;display:flex;gap:16px;align-items:flex-start;margin-bottom:24px}
.spark{background:#fff;border-radius:10px;padding:10px;display:grid;place-items:center;color:var(--green)}
.welcome p{font-size:13px;color:#52624e;margin-top:5px;max-width:500px}
.welcome .btn{margin-top:13px}
.welcome .eyebrow{margin-bottom:5px;color:var(--green)}
.sectionhead{margin:22px 0 14px}
.sectionhead:first-child{margin-top:0}
.sectionhead .muted{font-size:12px}
.seg{display:flex;gap:5px;border-bottom:1px solid var(--line);margin-bottom:5px;overflow-x:auto}
.seg button{padding:12px 14px;min-height:45px;color:var(--muted);white-space:nowrap;border-bottom:2px solid transparent;font-size:13px}
.seg button.active{color:var(--green);border-color:var(--green);font-weight:700}
.search{margin:15px 0;display:flex;align-items:center;gap:10px;border:1px solid var(--line);background:#fff;border-radius:9px;padding:0 12px}
.search input{width:100%;border:0;background:transparent;min-height:44px;outline-offset:0;font-size:13px}
.tasklist{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.task{display:flex;align-items:flex-start;gap:7px;padding:12px 10px;border-bottom:1px solid #edf0ea}
.task:last-child{border-bottom:0}
.check{min-width:44px;min-height:44px;display:grid;place-items:center;padding:0}
.check span{width:20px;height:20px;border-radius:6px;border:1.5px solid #98a69b;display:grid;place-items:center}
.check[aria-pressed=true] span{background:var(--green);border-color:var(--green);color:white}
.check svg{width:14px;height:14px}
.taskbody{flex:1;min-width:0}
.tasktitle{display:block;min-height:36px;padding:5px 0;text-align:left;font-weight:600;font-size:14px;width:100%;overflow-wrap:anywhere}
.tasktitle:hover{color:var(--green)}
.task.done .tasktitle{text-decoration:line-through;color:var(--muted)}
.taskmeta{display:flex;gap:7px 12px;flex-wrap:wrap;align-items:center;font-size:11px;color:var(--muted);padding:1px 0 4px}
.tag{display:inline-flex;align-items:center;gap:5px;font-weight:600}
.deadline{color:var(--orange)}
.tasktime{font-size:11px;border-radius:5px;background:#f1f4ee;padding:4px 7px;white-space:nowrap;margin-top:9px}
.empty{padding:35px 20px;color:var(--muted);text-align:center}
.quickadd{width:100%;text-align:left;min-height:47px;color:var(--green);font-size:13px;margin-top:6px;padding:8px 13px}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:20px}
.rail{display:flex;flex-direction:column;gap:18px}
.rail h2{font-size:15px}
.rail .sectionhead{margin:0 0 15px}
.timeline{margin:16px 0 6px}
.slot{display:grid;grid-template-columns:43px 1fr;gap:10px;margin:0 0 16px;font-size:12px}
.slot time{color:var(--muted);padding-top:7px;font-variant-numeric:tabular-nums}
.slotbox{padding:9px 12px;border-left:3px solid #749485;background:#f3f6ef;border-radius:0 7px 7px 0}
.slotbox.fixed{border-color:#a29580;background:#f6f2eb}
.slotbox strong{font-size:12px;display:block}
.slotbox small{font-size:11px;color:var(--muted)}
.progressline{height:5px;background:#e9ede5;border-radius:5px;margin:12px 0 8px;overflow:hidden}
.progressline>div{background:var(--green);height:100%;transition:width .2s}
.habit{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px;border-bottom:1px solid #edf0ea;padding:7px 0}
.habit:last-child{border:0}
.journalteaser{background:#f8f4ec;border-color:#e9e1d4}
.journalteaser p{font-size:13px;margin:9px 0 16px;color:#6a6255}
.area-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.areacard{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px;text-align:left;min-height:120px;display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.areacard:hover{border-color:#9aaa9b}
.areacard strong{font-size:13px}
.areacard small{color:var(--muted)}
.areaicon{border-radius:8px;padding:7px;background:#f0f2ec;display:grid;place-items:center}
.notegrid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.notecard{text-align:left;min-height:180px}
.notecard p{margin:12px 0;color:var(--muted);font-size:13px;white-space:pre-wrap;overflow-wrap:anywhere}
.notecard h3{margin-top:12px}
.connection{padding:17px 0;border-bottom:1px solid var(--line);display:flex;gap:16px;align-items:center}
.connection:last-child{border:0}
.connection p{font-size:13px;color:var(--muted);margin:3px 0}
.connection .pill{margin-left:auto}
.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:20px}
.metric strong{font-size:27px;display:block;margin:9px 0}
.metric p{font-size:12px;color:var(--muted)}
.barweek{display:flex;height:90px;align-items:flex-end;gap:12px;margin:18px 0}
.barcol{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--muted);font-size:11px}
.barcol i{width:100%;max-width:35px;background:#9db59c;border-radius:4px 4px 0 0}
.notehint{font-size:12px;padding:11px 14px;background:var(--sand);color:#735428;border-radius:8px;margin-bottom:18px}
.subtext{font-size:13px;color:var(--muted)}
.mobileareas{display:none}
.focushero{display:none}
.focuslayout .shell{grid-template-columns:1fr}
.focuslayout .sidebar{display:none}
.focuslayout .topbar{padding-left:max(30px,calc((100vw - 1100px)/2));padding-right:max(30px,calc((100vw - 1100px)/2))}
.focuslayout .content{max-width:1160px}
.focuslayout .mobileareas{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:24px}
.focuslayout .mobileareas .navbtn{width:auto;padding:8px 13px;margin:0}
.focuslayout h1{font-family:Georgia,serif;font-size:43px;font-weight:500;letter-spacing:-1px}
.focuslayout{--bg:#f8f5ef;--line:#e5e0d6;--green:#68533a;--soft:#f0e9dd}
.focuslayout .welcome{background:#efe9de;border-color:#e0d6c5}
.focuslayout .welcome .spark{color:#68533a}
.focuslayout .welcome p{color:#655c50}
.focuslayout .focushero{display:block;margin-bottom:22px;padding:22px 24px;background:#fffdf9;border:1px solid #e4dacb;border-radius:14px}
.focushero h2{font:26px Georgia,serif;margin:8px 0}
.focushero p{font-size:13px;color:var(--muted)}
.focuslayout .area-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.focuslayout .areacard{min-height:95px}
.focuslayout .columns{grid-template-columns:minmax(0,1fr) 310px}
.focuslayout .task{padding:15px 10px}
.focuslayout .brandmini{display:flex}
.brandmini{display:none;font-weight:750;font-size:20px;gap:8px;align-items:center}
.focuslayout .crumb{display:none}
.focuslayout .welcome .eyebrow{color:var(--green)}
.fullwidth{grid-column:1/-1}
dialog{border:1px solid var(--line);border-radius:18px;max-width:560px;width:calc(100% - 28px);padding:26px;color:var(--ink);box-shadow:0 20px 80px #14251d30;max-height:90vh;overflow:auto}
dialog::backdrop{background:#17251dc0}
.modalhead{margin-bottom:18px}
.field{display:flex;flex-direction:column;gap:6px;margin:14px 0}
.field label{font-size:12px;font-weight:650}
.field input,.field select,.field textarea{border:1px solid #bac5b9;border-radius:8px;padding:11px 12px;background:#fff;width:100%;min-width:0;color:var(--ink)}
.field textarea{min-height:115px;resize:vertical}
.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.modalfoot{display:flex;justify-content:flex-end;gap:8px;margin-top:22px;flex-wrap:wrap}
.planoption{display:flex;gap:12px;margin:10px 0;padding:14px;background:#f4f6f0;border-radius:10px;font-size:13px}
.planoption input{width:20px;height:20px;flex-shrink:0;accent-color:var(--green)}
.planoption label{cursor:pointer;flex:1}
.planoption small{display:block;color:var(--muted);margin-top:5px}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#253b2e;color:#fff;padding:12px 20px;border-radius:10px;box-shadow:0 8px 35px #0002;z-index:10;font-size:13px;max-width:calc(100vw - 30px);text-align:center}
.toast:empty{display:none}
.mobilebrand{display:none}
.statewarning{font-size:12px;color:#865a28;padding:0 32px}
.longtext{white-space:pre-wrap;overflow-wrap:anywhere}

@media(min-width:1550px){.content{padding:42px 46px}
.columns{grid-template-columns:minmax(0,1fr) 320px}
}

@media(max-width:1150px){.shell{grid-template-columns:190px minmax(0,1fr)}
.content{padding:24px}
.topbar{padding:15px 24px}
.columns,.focuslayout .columns{grid-template-columns:minmax(0,1fr) 255px;gap:18px}
.area-grid{grid-template-columns:1fr 1fr}
.sidebar{padding-left:10px;padding-right:10px}
.card{padding:16px}
.heading h1{font-size:32px}
}

@media(max-width:920px){.columns,.focuslayout .columns{grid-template-columns:1fr}
.rail{display:grid;grid-template-columns:1fr 1fr}
.rail>.card:first-child{grid-column:1/-1}
.timeline{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.slot{margin:0 0 8px}
.area-grid{grid-template-columns:repeat(3,1fr)}
.notegrid{grid-template-columns:1fr}
.heading{align-items:flex-start}
.heading .btn{white-space:nowrap}
}

@media(max-width:700px){.demo-bar{font-size:11px;padding:6px 14px;align-items:flex-start}
.demo-bar>span{max-width:75%}
.shell{display:block}
.sidebar{display:none}
.topbar,.focuslayout .topbar{padding:12px 16px;flex-wrap:wrap}
.crumb{display:none}
.brandmini,.mobilebrand{display:flex;font-size:19px;font-weight:750}
.layoutswitch button{font-size:11px;padding:5px 9px}
.content{padding:22px 16px 34px}
.mobileareas,.focuslayout .mobileareas{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:22px}
.mobileareas .navbtn{width:auto;margin:0;background:#ecefe7;padding:7px 12px;min-height:40px}
.mobileareas .navbtn.active{background:var(--green);color:#fff}
.heading{gap:15px}
.heading h1,.focuslayout .heading h1{font-size:30px}
.heading p{font-size:13px}
.heading{flex-wrap:wrap}
.welcome{padding:16px;gap:11px}
.welcome .spark{display:none}
.area-grid,.focuslayout .area-grid{grid-template-columns:1fr 1fr}
.rail{display:flex;flex-direction:column}
.timeline{display:block}
.slot{margin-bottom:14px}
.tasktime{display:none}
.taskmeta{font-size:11px}
.metric-grid{grid-template-columns:1fr}
.metric{display:grid;grid-template-columns:1fr auto}
.metric p{grid-column:1/-1}
.metric strong{font-size:23px;margin:0}
.connection{align-items:flex-start;flex-wrap:wrap}
.connection .pill{margin-left:0}
.formgrid{grid-template-columns:1fr}
.notegrid{grid-template-columns:1fr}
.seg button{padding-left:12px;padding-right:12px}
.statewarning{padding:0 16px}
.focuslayout .focushero{padding:18px}
.focushero h2{font-size:23px}
}

@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}
}


/* Appearance is independent of layout. Both views use exactly one state. */
body[data-theme]{--surface-alt:#fafbf8;--panel:#edf3e9;--panel-ink:#52624e;--on-accent:#fff;--control:#edf0e9;--field-border:#87978c;--hint:#f7f0e3;--hint-ink:#735428;--focus:#477555;--divider:#e0e6df;--subtle:#f1f4ee;--journal:#f8f4ec;--journal-ink:#6a6255;--done:#738c77;--bg:#f6f7f4;--paper:#fff;--ink:#202b28;--muted:#5c6861;--line:#dce3d9;--green:#286147;--soft:#eaf1e9;--sand:#f7f0e3;--orange:#885524}

body[data-theme="paper"]{--bg:#f8f5ef;--paper:#fffdf9;--ink:#342e27;--muted:#706456;--line:#e0d8ca;--green:#68533a;--soft:#f0e9dd;--sand:#f6ecda;--orange:#875425;--surface-alt:#f5f1e8;--panel:#efe9de;--panel-ink:#655c50;--control:#eae2d6;--field-border:#9e907d;--hint:#f1e6d3;--hint-ink:#6c512b;--focus:#80623c;--divider:#e7dfd1;--subtle:#f0e9dd;--journal:#f5eedf;--journal-ink:#695c48;--done:#907f67}

body[data-theme="midnight"]{--bg:#101722;--paper:#1b2533;--ink:#edf2f8;--muted:#b1bdcd;--line:#37475c;--green:#9ebfff;--soft:#27374e;--sand:#2d2c29;--orange:#f2c18e;--surface-alt:#151e2b;--panel:#20304a;--panel-ink:#c2d1e8;--on-accent:#142338;--control:#243145;--field-border:#71849e;--hint:#302d24;--hint-ink:#e2c998;--focus:#9ebfff;--divider:#334154;--subtle:#26354a;--journal:#292c37;--journal-ink:#d4cabc;--done:#9ebfff}

body[data-theme] .sidebar,body[data-theme] .topbar{background:var(--surface-alt)}

body[data-theme] .demo-bar{background:var(--control);color:var(--muted);border-color:var(--line)}

body[data-theme] .card,body[data-theme] .tasklist,body[data-theme] .areacard,body[data-theme] .search,body[data-theme] dialog{background:var(--paper);color:var(--ink)}

body[data-theme] .search input{color:var(--ink)}

body[data-theme] input::placeholder,body[data-theme] textarea::placeholder{color:var(--muted);opacity:1}

body[data-theme] .layoutswitch{background:var(--control)}

body[data-theme] .layoutswitch .active{background:var(--paper);color:var(--green)}

body[data-theme] .navbtn{color:var(--muted)}

body[data-theme] .navbtn.active{background:var(--soft);color:var(--green)}

body[data-theme] .navbtn:hover{background:var(--control)}

body[data-theme] .welcome{background:var(--panel);border-color:var(--line)}

body[data-theme] .welcome p{color:var(--panel-ink)}

body[data-theme] .welcome .eyebrow,body[data-theme] .welcome .spark{color:var(--green)}

body[data-theme] .spark{background:var(--paper)}

body[data-theme] .focushero{background:var(--paper);border-color:var(--line)}

body[data-theme] .btn.primary,body[data-theme] .brandmark{color:var(--on-accent);background:var(--green)}

body[data-theme] .check[aria-pressed=true] span{color:var(--on-accent)}

body[data-theme] .tasktime,body[data-theme] .slotbox,body[data-theme] .areaicon,body[data-theme] .avatar{background:var(--subtle)}

body[data-theme] .tasktime,body[data-theme] .avatar{color:var(--ink)}

body[data-theme] .slotbox{border-color:var(--green)}

body[data-theme] .slotbox.fixed{background:var(--journal);border-color:var(--done)}

body[data-theme] .journalteaser{background:var(--journal);border-color:var(--line)}

body[data-theme] .journalteaser p{color:var(--journal-ink)}

body[data-theme] .notehint{background:var(--hint);color:var(--hint-ink)}

body[data-theme] .planoption{background:var(--subtle)}

body[data-theme] .field input,body[data-theme] .field select,body[data-theme] .field textarea{background:var(--paper);color:var(--ink);border-color:var(--field-border)}

body[data-theme] .task,body[data-theme] .habit{border-color:var(--divider)}

body[data-theme] .pill.demo,body[data-theme] .progressline{background:var(--control);color:var(--muted)}

body[data-theme] .progressline>div{background:var(--green)}

body[data-theme="midnight"] .taskmeta .tag,body[data-theme="midnight"] .notecard>span,body[data-theme="midnight"] .areaicon{color:var(--ink)!important}

body[data-theme] .check span{border-color:var(--field-border)}

body[data-theme] .toast{background:var(--green);color:var(--on-accent)}

body[data-theme] button:focus-visible,body[data-theme] a:focus-visible,body[data-theme] input:focus-visible,body[data-theme] select:focus-visible,body[data-theme] textarea:focus-visible{outline-color:var(--focus)}

body[data-theme] .taskmeta,body[data-theme] .slotbox small{font-size:12px}

.appearance-controls{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.appearance-group{display:flex;gap:8px;align-items:center}
.control-label{font-size:12px;color:var(--muted);font-weight:600}
.appearance-group select{background:var(--paper);border:1px solid var(--line);color:var(--ink);border-radius:8px;min-height:44px;padding:7px 10px;font-size:12px;max-width:100%}
.layoutswitch button{min-height:44px}
.topbar{flex-wrap:wrap}
.desktop-focus-nav{display:flex;gap:6px;flex-wrap:wrap}
.mobile-nav-select{display:none}
.tasksection{min-width:0}

@media(max-width:700px){
.topbar,.focuslayout .topbar{padding:10px 16px;gap:8px}
.appearance-controls{width:100%;gap:8px;justify-content:space-between}
.appearance-group{gap:4px}
.control-label{font-size:11px}
.appearance-group select{font-size:12px;width:155px}
.layoutswitch button{padding:7px 9px;font-size:12px}
.brandmini{font-size:18px}
.content{padding-top:14px}
.mobileareas,.focuslayout .mobileareas{margin-bottom:14px;display:block}
.desktop-focus-nav{display:none}
.mobile-nav-select{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:12px}
.mobile-nav-select select{flex:1;min-width:0;background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:8px;min-height:44px;padding:8px}
.heading{gap:10px;margin-bottom:16px}
.heading .eyebrow{font-size:10px;margin-bottom:5px}
.heading h1,.focuslayout .heading h1{font-size:26px}
.heading p{display:none}
.heading .btn{width:100%}
.maincol{display:flex;flex-direction:column}
.tasksection{order:-3}
.focuslayout .focushero{order:-2;margin:14px 0;font-size:13px}
.welcome{order:-1;margin:15px 0 22px}
.tasksection .sectionhead{display:block;margin-bottom:6px}
.tasksection .sectionhead .muted{display:block;font-size:12px;margin-top:3px}
.search{margin:10px 0}
.toast{bottom:12px}
.tasktitle{min-height:44px}
.mobileareas .navbtn{min-height:44px}
}

@media(max-width:380px){.appearance-controls{gap:7px}
.appearance-group{gap:3px}
.appearance-group select{width:139px}
.control-label{font-size:10px}
.layoutswitch button{padding:7px 7px}
}



/* V3 orchestration: semantic theme tokens, never a live agent UI. */
.opsactions{margin-bottom:20px}
.opsgrid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px}
.opsgrid>*{min-width:0}
.opsrail{display:flex;flex-direction:column;gap:18px}
.opsrail h2{margin:10px 0}
.opsrail .connection{flex-wrap:wrap}
.opslimits{padding-left:19px;color:var(--muted);margin-bottom:0}
.opslimits li{margin:12px 0}
.jobstack,.decisionstack{display:grid;gap:16px}
.jobcard h2,.decisioncard h2{margin:16px 0 8px;font-size:22px;line-height:1.3}
.jobcard .btn,.decisioncard .btn{margin-top:18px}
.jobnext{margin-top:16px}
.decisioncard>p{max-width:70ch;margin:10px 0}
.opsintro{display:flex;gap:16px;flex-wrap:wrap;align-items:center;justify-content:space-between;margin:24px 0}
.opsintro h2{margin-top:5px}
.decisionstack{max-width:880px}
.pill.attention{background:var(--hint);color:var(--hint-ink)}
.jobdetail{display:grid;gap:18px}
.jobdetail h3{font-size:21px;line-height:1.35}
.jobdetail p,.jobcard h2,.decisioncard h2{overflow-wrap:anywhere}
.jobdetail .notehint{margin:0 0 15px}
.eventsection{border-top:1px solid var(--line);padding-top:20px}
.eventsection h3{font-size:15px}
.eventlist{padding:0;list-style:none;margin-bottom:0}
.eventlist li{border-left:2px solid var(--line);padding:0 0 18px 15px;overflow-wrap:anywhere}
.eventlist small{display:block;color:var(--muted);margin-top:5px}
.decisionoptions{border:0;padding:0;margin:0 0 18px;min-width:0}
.decisionoptions legend{font-weight:650;font-size:19px;margin-bottom:10px}
.decisionoptions>p{margin-bottom:15px}
.decisionoption{display:flex;align-items:flex-start;gap:12px;min-height:48px;padding:14px;border:1px solid var(--field-border);border-radius:10px;margin:10px 0;cursor:pointer}
.decisionoption input{width:18px;height:18px;flex:0 0 18px;margin:3px 0;accent-color:var(--green)}
.decisionoption:has(input:checked){background:var(--soft);border-color:var(--green)}
.decisionoption small{display:block;margin-top:5px;color:var(--muted)}
.resultdemo{background:var(--surface-alt);border:1px solid var(--line);border-radius:12px;padding:18px}
.resultdemo h3{font-size:18px;margin:10px 0}
.resultdemo p{margin:10px 0}
.ownerlink{display:flex;align-items:center;gap:6px;min-height:44px;text-align:left;font-size:12px;color:var(--green);padding:2px 0}
.ownerlink svg{width:15px;height:15px}
.ownerlabel{display:block;margin:3px 0}
.jobdetail .btn{white-space:normal}
.empty .btn{margin-top:16px}
.navbtn{min-height:44px}

@media(max-width:1050px){.opsgrid{grid-template-columns:minmax(0,1fr)}
.opsrail{display:grid;grid-template-columns:1fr 1fr}
}

@media(max-width:700px){.opsrail{display:flex}
.jobcard h2,.decisioncard h2{font-size:20px}
.opsactions .btn{flex:1}
.opsintro{margin-top:18px}
.jobdetail .row>.btn{flex:1}
.pill{white-space:normal}
.theme-field select{width:139px}
.jobdetail{gap:15px}
}



/* Production additions: preserve V3 geometry and semantic theme surfaces. */
[hidden] { display:none !important; }
.shell { min-height:100vh; }
.auth-wrap { max-width:520px; margin:6vh auto; padding:20px; display:grid; gap:24px; }
.auth-card h1 { font-size:30px; margin:12px 0; }
.auth-card .primary { width:100%; margin-top:18px; }
.auth-card p { margin:10px 0; }
.skip-link { position:fixed; top:-80px; left:16px; padding:12px; z-index:50; background:var(--paper); }
.skip-link:focus { top:10px; }
.global-message { position:fixed; bottom:16px; right:16px; z-index:20; max-width:460px; width:calc(100% - 32px); padding:18px; background:var(--hint); color:var(--hint-ink); border:1px solid var(--line); border-radius:12px; }
.global-message .btn { margin:12px 8px 0 0; }
.error { padding:12px; margin:12px 0; border:1px solid var(--hint-ink); border-radius:8px; background:var(--hint); color:var(--hint-ink); }
.danger { color:var(--hint-ink); border-color:var(--hint-ink); }
#conflictCurrent { margin-top:16px; }
#conflictCurrent pre { white-space:pre-wrap; overflow-wrap:anywhere; padding:12px; background:var(--soft); font-size:12px; }
.taskfilters .field { margin-top:0; }
.tasktitle { min-height:44px; }
.field input,.field select { min-height:44px; }
.card h2 + p { margin-top:8px; }
.auth-card,.connection,.notecard,.habit { overflow-wrap:anywhere; }
body[data-theme=midnight] { color-scheme:dark; }
body[data-theme=forest],body[data-theme=paper] { color-scheme:light; }
@media(max-width:700px) {
  .appearance-controls { justify-content:flex-start; }
  .topbar #logout { margin-left:auto; }
  .heading p { display:block; }
  .auth-wrap { margin-top:12px; }
  dialog { padding:20px; }
  .field input,.field select,.field textarea { font-size:16px; }
}
