/* The Desk — shared editorial stock, type and ink. All assets are local. */
@font-face{font-family:"Desk Display";src:url("./fonts/bricolage-grotesque.woff2") format("woff2");font-weight:400 800;font-style:normal;font-display:swap}
@font-face{font-family:"Desk Sans";src:url("./fonts/manrope.woff2") format("woff2");font-weight:400 800;font-style:normal;font-display:swap}
@font-face{font-family:"Desk Mono";src:url("./fonts/ibm-plex-mono-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Desk Mono";src:url("./fonts/ibm-plex-mono-500.woff2") format("woff2");font-weight:500 800;font-style:normal;font-display:swap}
:root:root{
  color-scheme:light dark;
  --desk-header-height:54px;
  --desk-sidebar-width:200px;
  --desk-tabbar-height:56px;
  --desk-gutter:24px;
  --desk-title-size:48px;
  --desk-figure-size:clamp(32px,3.5vw,44px);
  --desk-ground:light-dark(#e9dfc8,#25251f);
  --desk-paper:light-dark(#f8f0dc,#303129);
  --desk-raised:light-dark(#fff8e8,#393b32);
  --desk-ink:light-dark(#252a25,#f3eedc);
  --desk-muted:light-dark(#67624f,#bbbba8);
  --desk-rule:light-dark(#bdb69e,#5c6150);
  --desk-blue:light-dark(#304b9c,#abbaff);
  --desk-clay:light-dark(#b44e30,#eca085);
  --desk-yellow:light-dark(#efd64a,#736326);
  --desk-soft:light-dark(#e2e5cc,#414934);
  --desk-green:light-dark(#415c40,#b2c996);
  --desk-selection:light-dark(#eee1a2,#4b4c2e);
  --desk-shadow:light-dark(#24291b20,#00000040);
  --desk-font:"Desk Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --desk-display:"Desk Display","Arial Black",sans-serif;
  --desk-mono:"Desk Mono",ui-monospace,SFMono-Regular,monospace;
  /* Existing controls share the same tokens during the app-by-app refactor. */
  --bg:var(--desk-ground);--surface:var(--desk-paper);--paper:var(--desk-paper);--card:var(--desk-paper);
  --ink:var(--desk-ink);--mut:var(--desk-muted);--faint:var(--desk-muted);
  --bd:var(--desk-rule);--bd-strong:var(--desk-ink);
  --accent:var(--desk-blue);--accent-ink:var(--desk-paper);
  --over:var(--desk-clay);--warn:var(--desk-clay);--neg:var(--desk-clay);
  --ok:var(--desk-green);--pos:var(--desk-green);--amber:light-dark(#845c19,#e3c475);
  --hover:color-mix(in srgb,var(--desk-ink) 6%,transparent);--sel:var(--desk-selection);
  --shadow-ink:var(--desk-shadow);--shadow:3px 3px 0 var(--desk-shadow);--shadow-sm:0 2px 0 var(--desk-shadow);--shadow-lg:5px 6px 0 var(--desk-shadow);
  --chip-bg:var(--desk-soft);--code-bg:var(--desk-raised);
  --font:var(--desk-font);--display:var(--desk-display);--mono:var(--desk-mono);--radius:2px;--radius-sm:1px;
}
:root:root[data-theme="light"]{color-scheme:light}
:root:root[data-theme="dark"]{color-scheme:dark}
body{font-family:var(--desk-font);background-color:var(--desk-ground);background-image:url("./paper-grain.png");color:var(--desk-ink)}
body.desk-connected::after{display:none}
body.desk-connected{display:flex;flex-direction:column;height:100%;min-height:0}
body.desk-connected>#app{flex:1;min-height:0;height:auto}
/* Shared primitives own geometry, type and materials at every app route.
   Apps retain domain layouts (charts, task lists, the writing surface). */
body.desk-connected{font:400 14px/1.55 var(--desk-font);-webkit-font-smoothing:antialiased}
body.desk-connected *,body.desk-connected *::before,body.desk-connected *::after{box-sizing:border-box}
body.desk-connected [hidden]{display:none!important}
body.desk-connected #main{min-height:0;min-width:0}
body.desk-connected #view{padding:24px var(--desk-gutter) 48px;background:transparent;min-width:0;container-type:inline-size}
body.desk-connected .view-title{font:800 var(--desk-title-size)/1.05 var(--desk-display);letter-spacing:-1.8px;text-transform:none;margin:8px 0 24px;overflow-wrap:anywhere}
body.desk-connected .view-title :is(.count,.project-count){font:400 11px/1.5 var(--desk-mono);letter-spacing:0;color:var(--desk-muted)}
body.desk-connected .section-title{font:700 24px/1.2 var(--desk-display);letter-spacing:-.5px;text-transform:none;margin:24px 0 14px}
body.desk-connected :is(.ov-money,.report-statline strong,.investment-stats strong){font:800 var(--desk-figure-size)/1.2 var(--desk-display);letter-spacing:-1.3px;font-variant-numeric:tabular-nums}
body.desk-connected :is(.report-average b,.investment-stats b,.cashflow-month-stats dd){font:700 24px/1.2 var(--desk-display);letter-spacing:-.5px;font-variant-numeric:tabular-nums}
body.desk-connected .view-head{display:flex;align-items:center;justify-content:space-between;flex-direction:row;gap:28px;margin:8px 0 24px}
body.desk-connected .view-heading{flex:1;min-width:0}
body.desk-connected .view-head .view-title{margin:0}
body.desk-connected .view-actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:14px}
body.desk-connected .view-date{font:400 11px/1.6 var(--desk-mono);color:var(--desk-muted);margin:9px 0 0}
/* Journal's epigraph is the single quote treatment for the whole Desk. */
body.desk-connected .daily-quote{flex:0 1 490px;max-width:min(48%,490px);min-width:0;margin:0;padding:0 14px 0 0;border:0;border-right:4px solid var(--desk-blue);text-align:right}
body.desk-connected .daily-quote blockquote{margin:0;font:italic 400 17.5px/1.5 Georgia,serif;letter-spacing:-.005em;color:var(--desk-ink)}
body.desk-connected .daily-quote.long blockquote{font-size:14px}
body.desk-connected .daily-quote .dq-attr{font:700 11px/1.5 var(--desk-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--desk-muted);margin-top:7px}
body.desk-connected .daily-quote .dq-src{font-weight:400;letter-spacing:.06em;text-transform:none;color:var(--desk-muted)}
body.desk-connected :is(.btn,.ov-button){display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;padding:7px 10px;border:1px solid var(--desk-rule);border-radius:2px;background:var(--desk-paper);color:var(--desk-ink);font:600 12px/20px var(--desk-font);letter-spacing:0;text-transform:none;text-decoration:none;box-shadow:0 2px 0 var(--desk-shadow);transform:none}
body.desk-connected .btn.small{min-height:32px;padding:5px 8px;font-size:11px}
body.desk-connected :is(.btn,.ov-button):hover{background:var(--hover);transform:none;box-shadow:0 2px 0 var(--desk-shadow)}
body.desk-connected :is(.btn.primary,.btn.accent){background:var(--desk-blue);color:var(--desk-paper);border-color:var(--desk-blue)}
body.desk-connected :is(.btn.primary,.btn.accent):hover{background:var(--desk-ink);color:var(--desk-paper)}
body.desk-connected :is(.btn.danger,.btn.warn){color:var(--desk-clay);border-color:var(--desk-clay)}
body.desk-connected .btn.ghost{background:transparent;box-shadow:none}
body.desk-connected :is(.btn,.ov-button):disabled{opacity:.5;cursor:not-allowed}
body.desk-connected .iconbtn{display:inline-flex;align-items:center;justify-content:center;min-width:36px;min-height:36px;border-radius:2px}
body.desk-connected :is(.input,.tags-input,.search-input,.text-input,.date-input,.login-field input,.setting-row input[type="number"],.setting-row select,#view select,#view textarea:not(.editor)){min-height:36px;max-width:100%;border:1px solid var(--desk-rule);border-radius:2px;padding:8px 10px;background:var(--desk-raised);color:var(--desk-ink);font:400 13px/1.5 var(--desk-font);box-shadow:none}
body.desk-connected :is(.field>span,.f-label,.field-label){font:600 11px/1.5 var(--desk-font);letter-spacing:0;text-transform:none;color:var(--desk-muted)}
body.desk-connected :is(.btn,.input,.iconbtn,a,button,summary,select,input,textarea):focus-visible{outline:2px solid var(--desk-blue);outline-offset:3px}
body.desk-connected :is(.panel,.modal,.bottom-sheet,.login-card){border-color:var(--desk-rule);border-radius:2px;background:var(--desk-paper);color:var(--desk-ink)}
body.desk-connected :is(.panel-h h3,.modal>h3){font:700 24px/1.2 var(--desk-display);letter-spacing:-.5px;text-transform:none}
body.desk-connected .desk-status{flex-shrink:0;display:flex;align-items:center;gap:10px;padding:10px var(--desk-gutter);border-bottom:1px solid var(--desk-rule);background:var(--desk-soft);color:var(--desk-ink);font:500 12px/1.5 var(--desk-font);flex-wrap:wrap}
body.desk-connected .desk-status button{font:600 12px/1.5 var(--desk-font);min-height:36px;padding:6px 10px;border:1px solid var(--desk-rule);border-radius:2px;background:var(--desk-paper);color:var(--desk-ink);cursor:pointer}
body.desk-connected :is(.login-wrap){max-width:100%;padding:24px 0}
body.desk-connected>.login-wrap{flex:1;min-height:0;overflow-y:auto;padding:24px var(--desk-gutter)}
body.desk-connected .login-card{width:min(420px,100%);padding:28px;border:1px solid var(--desk-rule);border-top:4px solid var(--desk-blue);box-shadow:var(--shadow)}
body.desk-connected .login-card :is(h1,h2,.nav-brand,.masthead){font:800 32px/1.1 var(--desk-display);letter-spacing:-1px;text-transform:none}
body.desk-connected .login-card :is(.masthead,.login-heading){margin:0 0 20px;padding:0 0 18px;border:0;border-bottom:1px solid var(--desk-rule)}
body.desk-connected .login-heading h1{margin:0}
body.desk-connected .login-card :is(.masthead small,.login-heading p){display:block;margin:8px 0 0;font:400 11px/1.5 var(--desk-mono);letter-spacing:0;text-transform:none;color:var(--desk-muted)}
body.desk-connected .login-card button[type="submit"]{width:100%}
body.desk-connected :is(.login-field>span,.login-field>label){font:600 12px/1.5 var(--desk-font);letter-spacing:0;text-transform:none;color:var(--desk-muted)}
body.desk-connected #view :is(.heat-title,.otd-year,.period-nav .month-label){font:700 20px/1.3 var(--desk-display);letter-spacing:-.4px;text-transform:none}
body.desk-connected #view :is(.hist-stats .stat b,.review-stats .stat b,.feature-stat b){font-family:var(--desk-display);font-weight:800;letter-spacing:-.5px}
body.desk-connected #view :is(.chart-card-head h3,.chart-card-head h4){font:600 14px/1.4 var(--desk-font);letter-spacing:0;text-transform:none}
/* One desktop navigation design for all five publications. */
@media(min-width:901px){
  body.desk-connected>#app{grid-template-columns:var(--desk-sidebar-width) minmax(0,1fr)}
  body.desk-connected #sidebar{
    display:flex;flex-direction:column;min-width:0;min-height:0;overflow-y:auto;
    padding:24px 12px 18px;background:var(--desk-paper);border:0;border-right:1px solid var(--desk-rule);
  }
  body.desk-connected #sidebar :is(.nav-brand,.masthead){
    display:block;flex-shrink:0;min-height:90px;margin:0 0 18px;padding:0 8px 18px;
    border:0;border-bottom:1px solid var(--desk-rule);color:var(--desk-ink);
    font:800 26px/1.1 var(--desk-display);letter-spacing:-.8px;text-transform:none;
  }
  body.desk-connected #sidebar :is(.brand-sub,.masthead small){
    display:block;min-height:32px;margin:8px 0 0;padding:0;color:var(--desk-muted);
    font:400 10px/16px var(--desk-mono);letter-spacing:0;text-transform:none;
  }
  body.desk-connected #sidebar .nav-item{
    display:flex;align-items:center;justify-content:flex-start;gap:10px;flex-shrink:0;
    width:100%;height:44px;min-height:44px;margin:2px 0;padding:10px;
    border:0;border-radius:2px;background:transparent;color:var(--desk-ink);
    font:600 14px/20px var(--desk-font);letter-spacing:0;text-align:left;text-transform:none;
    text-decoration:none;box-shadow:none;transform:none;cursor:pointer;transition:none;
  }
  body.desk-connected #sidebar .nav-item:hover{background:var(--hover)}
  body.desk-connected #sidebar .nav-item.active{
    background:var(--desk-soft);color:var(--desk-blue);box-shadow:inset 3px 0 var(--desk-blue);
  }
  body.desk-connected #sidebar :is(.nav-item,button,a):focus-visible{
    outline:2px solid var(--desk-blue);outline-offset:2px;
  }
  body.desk-connected #sidebar .nav-item svg{width:18px;height:18px;flex:0 0 18px}
  body.desk-connected #sidebar .nav-item .badge{
    display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
    min-width:18px;height:18px;margin-left:auto;padding:0 4px;border:0;border-radius:2px;
    background:var(--desk-ink);color:var(--desk-paper);font:500 10px/18px var(--desk-mono);
  }
  body.desk-connected #sidebar .nav-item.active .badge{background:var(--desk-blue);color:var(--desk-paper)}
  body.desk-connected #sidebar>.nav-foot,body.desk-connected #sidebar>.nav-user{
    flex-shrink:0;margin-top:auto;padding:18px 8px 0;border-top:1px solid var(--desk-rule);
  }
  body.desk-connected #sidebar .nav-foot{display:flex;flex-direction:column;gap:10px}
  body.desk-connected #sidebar .nav-user{
    color:var(--desk-muted);font:400 11px/1.6 var(--desk-mono);letter-spacing:0;text-transform:none;
  }
  body.desk-connected #sidebar .nav-user b{font:500 12px/1.6 var(--desk-font);color:var(--desk-ink)}
  body.desk-connected #sidebar .nav-foot .btn{
    min-height:36px;padding:7px 10px;border:1px solid var(--desk-rule);border-radius:2px;
    background:transparent;color:var(--desk-ink);font:600 12px/20px var(--desk-font);
    letter-spacing:0;text-transform:none;box-shadow:none;transform:none;
  }
  body.desk-connected #sidebar .nav-user button{
    min-height:36px;font:600 12px/20px var(--desk-font);letter-spacing:0;text-transform:none;
  }
}
@media(max-width:900px){
  :root:root{--desk-gutter:16px;--desk-title-size:40px}
  body.desk-connected>#app{grid-template-columns:minmax(0,1fr)}
  body.desk-connected #sidebar{display:none}
  body.desk-connected #view{padding:22px var(--desk-gutter) calc(var(--desk-tabbar-height) + 33px + env(safe-area-inset-bottom,0px) + var(--selbar-h,0px))}
  body.desk-connected .view-head{flex-direction:column;align-items:stretch;gap:18px}
  body.desk-connected .daily-quote{flex:auto;max-width:none;text-align:left;padding:0 0 0 12px;border-right:0;border-left:4px solid var(--desk-blue)}
  body.desk-connected .daily-quote blockquote{font-size:15px}
  body.desk-connected .daily-quote.long blockquote{font-size:13px}
  body.desk-connected #tabbar{display:flex;position:fixed;inset:auto 0 0;z-index:40;width:100%;padding:0 0 env(safe-area-inset-bottom,0px);border:0;border-top:1px solid var(--desk-ink);background:var(--desk-paper);overflow:visible}
  body.desk-connected #tabbar:empty{display:none}
  body.desk-connected #tabbar>.mobile-more{flex:1;min-width:0}
  body.desk-connected #tabbar .tab{display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;gap:3px;height:var(--desk-tabbar-height);min-height:var(--desk-tabbar-height);min-width:0;margin:0;padding:6px 3px;border:0;border-radius:0;background:transparent;color:var(--desk-muted);font:600 11px/16px var(--desk-font);letter-spacing:0;text-transform:none;text-decoration:none;white-space:nowrap;box-shadow:none;cursor:pointer}
  body.desk-connected #tabbar .tab.active{color:var(--desk-blue);box-shadow:inset 0 3px var(--desk-blue)}
  body.desk-connected #tabbar .tab svg{width:18px;height:18px;flex:none}
  body.desk-connected #tabbar .more-icon{display:block;width:18px;height:18px;line-height:18px;text-align:center;font-size:14px}
  body.desk-connected #tabbar .tab .badge{min-width:16px;height:16px;padding:0 4px;font:500 9px/16px var(--desk-mono);border-radius:2px;background:var(--desk-blue);color:var(--desk-paper)}
  body.desk-connected :is(.more-panel,.bottom-sheet){border:1px solid var(--desk-rule);box-shadow:var(--shadow-lg)}
  body.desk-connected :is(.more-panel .nav-item,.sheet-item){min-height:44px;padding:10px 14px;font:600 14px/20px var(--desk-font);text-transform:none;letter-spacing:0}
  body.desk-connected :is(.btn,.btn.small,.ov-button,.iconbtn,.desk-status button){min-height:44px}
  body.desk-connected .iconbtn{min-width:44px}
  body.desk-connected :is(.input,.tags-input,.search-input,.text-input,.date-input,.login-field input,.setting-row input[type="number"],.setting-row select,#view select,#view textarea:not(.editor)){font-size:16px;min-height:44px}
}
/* The Board can share a desktop window with its inspector. Treat a narrow
   content column like a phone heading, without shrinking the quote's type. */
@container(max-width:580px){
  body.desk-connected .view-head{flex-direction:column;align-items:stretch;gap:18px}
  body.desk-connected .daily-quote{flex:auto;max-width:none;text-align:left;padding:0 0 0 12px;border-right:0;border-left:4px solid var(--desk-blue)}
}
@media(pointer:coarse){
  body.desk-connected :is(.btn,.btn.small,.ov-button,.iconbtn,.desk-status button){min-width:44px;min-height:44px}
  body.desk-connected :is(.input,.tags-input,.search-input,.text-input,.date-input,.login-field input,.setting-row input[type="number"],.setting-row select,#view select,#view textarea:not(.editor)){min-height:44px}
}
.desk-emblem{display:inline-block;position:relative;flex:none;width:27px;height:27px;border-radius:50%;background:repeating-linear-gradient(0deg,var(--desk-blue) 0 1.5px,transparent 1.5px 3px)}
.desk-emblem::after{content:"";position:absolute;inset:3px -3px -3px 3px;border:1px solid var(--desk-clay);border-radius:50%}
.desk-date{position:relative;isolation:isolate;background:var(--desk-yellow);color:var(--desk-ink);border:1px solid var(--desk-ink);padding:9px 16px;min-width:76px;text-align:center;transform:rotate(3deg);box-shadow:3px 4px 0 var(--desk-shadow);margin-left:65px;font:500 11px/1.3 var(--desk-mono)}
.desk-date strong{display:block;font:800 38px/1.1 var(--desk-display)}
.desk-date::before{content:"";position:absolute;width:78px;height:78px;right:calc(100% - 7px);top:-2px;z-index:-1;border-radius:50%;background:radial-gradient(circle,var(--desk-blue) 1px,transparent 1.2px);background-size:3px 3px;opacity:.65}
.desk-date::after{content:"";position:absolute;inset:-4px -4px 3px 5px;z-index:-2;border:1px solid var(--desk-clay);transform:rotate(-7deg)}
@media(max-width:600px){.desk-date{min-width:60px;padding:8px 11px;margin-left:38px}.desk-date strong{font-size:30px}.desk-date::before{width:60px;height:60px;top:2px}}
@media(prefers-reduced-motion:reduce){.desk-date{transform:none}}

body.desk-connected #view :is(.setting-row label,.toggle-row .zine-label){font:600 14px/1.5 var(--desk-font);letter-spacing:0;text-transform:none}
body.desk-connected.desk-message-page{height:auto;min-height:100dvh}
.desk-message{width:100%;max-width:520px;margin:auto;padding:24px 16px}
.desk-message-card{padding:28px;background:var(--desk-paper);border:1px solid var(--desk-rule);border-top:4px solid var(--desk-blue);border-radius:2px;box-shadow:var(--shadow)}
.desk-message h1{margin:0 0 12px;font:800 32px/1.1 var(--desk-display);letter-spacing:-1px}
.desk-message p{font:400 14px/1.6 var(--desk-font);margin:0 0 16px}
.desk-message-label,.desk-message footer{font:400 11px/1.6 var(--desk-mono);color:var(--desk-muted);margin:0 0 16px}
.desk-message footer{margin:18px 0 0}
