/* One Bit Team. Looks and behaves like Notion on purpose: the team already reads Notion fluently.
   Sidebar + breadcrumb bar, white page, centred column, property rows, pastel select pills, no cards or shadows. */
:root{
  color-scheme:light;
  --bg:#ffffff; --side:#f7f7f5; --hover:rgba(55,53,47,.06); --hover-2:rgba(55,53,47,.1);
  --line:rgba(55,53,47,.09); --line-2:rgba(55,53,47,.16);
  --ink:rgb(55,53,47); --ink-2:rgba(55,53,47,.78); --ink-3:rgba(55,53,47,.68);
  --accent:#2383e2; --accent-ink:#1f6fc0; --accent-soft:rgba(35,131,226,.12);
  --good:#448361; --warning:#cb912f; --critical:#d44c47;
  /* Notion select colours */
  --s-default:rgba(227,226,224,.6); --s-gray:#e3e2e0; --s-brown:#eee0da; --s-orange:#fadec9; --s-yellow:#fdecc8;
  --s-green:#dbeddb; --s-blue:#d3e5ef; --s-purple:#e8deee; --s-pink:#f5e0e9; --s-red:#ffe2dd; --s-ink:rgb(50,48,44);
  --card:#ffffff; --card-shadow:rgba(15,15,15,.06) 0 0 0 1px,rgba(15,15,15,.06) 0 2px 4px;
  --pop-shadow:rgba(15,15,15,.05) 0 0 0 1px,rgba(15,15,15,.1) 0 3px 6px,rgba(15,15,15,.2) 0 9px 24px;
  --sans:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI Variable Display","Segoe UI",Helvetica,"Apple Color Emoji",Arial,sans-serif,"Segoe UI Emoji","Segoe UI Symbol";
  --mono:"SFMono-Regular",Menlo,Consolas,"PT Mono","Liberation Mono",Courier,monospace;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  color-scheme:dark; --bg:#191919; --side:#202020; --hover:rgba(255,255,255,.055); --hover-2:rgba(255,255,255,.09);
  --line:rgba(255,255,255,.094); --line-2:rgba(255,255,255,.16);
  --ink:rgba(255,255,255,.81); --ink-2:rgba(255,255,255,.62); --ink-3:rgba(255,255,255,.52);
  --accent:#2383e2; --accent-ink:#529cca; --accent-soft:rgba(35,131,226,.2);
  --good:#4dab9a; --warning:#ffa344; --critical:#ff7369;
  --s-default:rgba(55,55,55,.9); --s-gray:#5a5a5a; --s-brown:#603b2c; --s-orange:#854c1d; --s-yellow:#89632a;
  --s-green:#2b593f; --s-blue:#28456c; --s-purple:#492f64; --s-pink:#69314c; --s-red:#6e3630; --s-ink:rgba(255,255,255,.88);
  --card:#202020; --card-shadow:rgba(255,255,255,.07) 0 0 0 1px; --pop-shadow:rgba(0,0,0,.4) 0 0 0 1px,rgba(0,0,0,.5) 0 6px 20px;
}}
:root[data-theme="dark"]{
  color-scheme:dark; --bg:#191919; --side:#202020; --hover:rgba(255,255,255,.055); --hover-2:rgba(255,255,255,.09);
  --line:rgba(255,255,255,.094); --line-2:rgba(255,255,255,.16);
  --ink:rgba(255,255,255,.81); --ink-2:rgba(255,255,255,.62); --ink-3:rgba(255,255,255,.52);
  --accent:#2383e2; --accent-ink:#529cca; --accent-soft:rgba(35,131,226,.2);
  --good:#4dab9a; --warning:#ffa344; --critical:#ff7369;
  --s-default:rgba(55,55,55,.9); --s-gray:#5a5a5a; --s-brown:#603b2c; --s-orange:#854c1d; --s-yellow:#89632a;
  --s-green:#2b593f; --s-blue:#28456c; --s-purple:#492f64; --s-pink:#69314c; --s-red:#6e3630; --s-ink:rgba(255,255,255,.88);
  --card:#202020; --card-shadow:rgba(255,255,255,.07) 0 0 0 1px; --pop-shadow:rgba(0,0,0,.4) 0 0 0 1px,rgba(0,0,0,.5) 0 6px 20px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.5 var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.prose a,a.link{color:var(--ink);text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:2px}
h1,h2,h3,h4{margin:0;font-weight:600;line-height:1.3}
h1{font-size:40px;font-weight:700;line-height:1.2;letter-spacing:-.01em}
h2{font-size:24px;letter-spacing:-.005em}h3{font-size:18px}
.muted{color:var(--ink-3)}.small{font-size:14px}.mono{font-family:var(--mono);font-size:.88em}
.spacer{flex:1}
button{font:inherit;color:inherit}
.ghost{border:0;background:transparent;color:var(--ink-3);padding:3px 7px;border-radius:5px;cursor:pointer;font-size:14px}
.ghost:hover{background:var(--hover);color:var(--ink)}

/* shell: sidebar + main */
.shell{display:flex;min-height:100vh}
.side{position:sticky;top:0;height:100vh;width:248px;flex:none;background:var(--side);display:flex;flex-direction:column;padding:6px 6px 8px;overflow-y:auto;border-right:1px solid var(--line);z-index:40}
.ws{display:flex;align-items:center;gap:8px;padding:8px 8px 10px;font-weight:600;font-size:14px;border-radius:6px}
.ws:hover{background:var(--hover)}
.ws-ic{width:22px;height:22px;border-radius:5px;display:grid;place-items:center;background:var(--accent);color:#fff;font-size:11px}
.side-search{display:flex;align-items:center;gap:8px;margin:0 2px 6px;padding:0 8px;border-radius:6px;font-size:13px;color:var(--ink-3)}
.side-search:focus-within{background:var(--hover)}
.side-search input{border:0;background:transparent;padding:5px 0;width:100%;font:inherit;font-size:14px;color:var(--ink);outline:none}
.side-nav{display:flex;flex-direction:column;gap:1px}
.side-nav a{display:flex;align-items:center;gap:8px;padding:4px 8px;border-radius:6px;color:var(--ink-2);font-size:14px;font-weight:500;min-height:30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.side-nav a i{font-style:normal;width:20px;text-align:center;font-size:15px;flex:none}
.side-nav a:hover{background:var(--hover)}
.side-nav a.on{background:var(--hover-2);color:var(--ink);font-weight:600}
.side-nav.sub a{font-weight:400;font-size:13.5px}
.side-label{font-size:12px;font-weight:600;color:var(--ink-3);padding:14px 8px 4px}
.badge{margin-left:auto;background:var(--critical);color:#fff;border-radius:999px;font-size:11px;padding:0 6px;line-height:17px;font-style:normal}
.side-foot{margin-top:auto;display:flex;align-items:center;gap:2px;padding:8px 4px 0;border-top:1px solid var(--line);font-size:13px}
.who-me{flex:1;color:var(--ink-2);padding:0 4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{position:sticky;top:0;z-index:30;height:45px;display:flex;align-items:center;gap:6px;padding:0 12px;background:var(--bg)}
.crumbs{display:flex;align-items:center;gap:2px;font-size:14px;color:var(--ink-2);min-width:0;overflow:hidden;white-space:nowrap}
.crumbs a,.crumbs span{padding:2px 6px;border-radius:5px;overflow:hidden;text-overflow:ellipsis}
.crumbs a:hover{background:var(--hover)}
.crumbs .sl{color:var(--ink-3);padding:0 1px}
.menu-btn{display:none;font-size:17px}
.scrim{display:none}
@media (max-width:860px){
  .side{position:fixed;left:0;top:0;transform:translateX(-105%);transition:transform .2s ease;width:270px}
  .nav-open .side{transform:none;box-shadow:var(--pop-shadow)}
  .nav-open .scrim{display:block;position:fixed;inset:0;background:rgba(15,15,15,.35);z-index:35}
  .menu-btn{display:inline-block}
}

/* page column */
.page{width:100%;max-width:900px;margin:0 auto;padding:36px 48px 120px}
.page.wide{max-width:1240px}
@media (max-width:640px){.page{padding:20px 16px 100px}h1{font-size:30px}h2{font-size:21px}}
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:22px}
.page-head .ic{font-size:56px;line-height:1;display:block;margin-bottom:10px}
.page-head p{margin:6px 0 0;color:var(--ink-3);max-width:62ch;font-size:15px}
/* "card" is now just a block of the page with a heading, like a Notion section */
.card{padding:0;margin:0}
.card+.card,.card.gap{margin-top:34px}
.card h2,.card>h3{margin-bottom:8px}
.card-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:8px;flex-wrap:wrap}
.card-head h2{margin:0}
.card-head a,.card-head .small{font-size:14px;color:var(--ink-3)}
.card-head a:hover{color:var(--ink)}
.grid{display:grid;gap:34px 40px}.grid>*{min-width:0}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:900px){.g2,.g3{grid-template-columns:1fr}}
.stack>*+*{margin-top:34px}
.empty{color:var(--ink-3);font-size:14px;padding:4px 2px}
hr.sep{border:0;border-top:1px solid var(--line);margin:18px 0}
details.more summary{cursor:pointer;color:var(--ink-3);font-size:14px;padding:4px 0}
details.more summary:hover{color:var(--ink)}

/* buttons + inputs: quiet, Notion-like */
.btn,.pill-btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line-2);background:transparent;color:var(--ink);border-radius:6px;padding:4px 10px;font:inherit;font-size:14px;cursor:pointer;white-space:nowrap;line-height:1.4}
.btn:hover,.pill-btn:hover{background:var(--hover)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:500}
.btn.primary:hover{background:#0077d4}
.btn.sm{padding:2px 8px;font-size:13px}
.btn.good{color:var(--good)}
input[type=text],input[type=email],input[type=password],input[type=date],input[type=url],input[type=search],input[type=number],select,textarea{
  border:1px solid var(--line-2);background:var(--bg);color:var(--ink);border-radius:6px;padding:5px 9px;font:inherit;font-size:14px;max-width:100%;
  box-shadow:none}
textarea{width:100%;min-height:70px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
label.f{display:block;font-size:13px;color:var(--ink-3);margin:0 0 4px}
.fields{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
.fields .wide{grid-column:1/-1}
.fields input,.fields select,.fields textarea{width:100%}
.inline-form{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.inline-form input[type=text]{flex:1;min-width:180px}
/* a "new row" line inside a list, like Notion's "+ New" */
.new-row{display:flex;gap:6px;align-items:center;flex-wrap:wrap;padding:4px 0;border-top:1px solid var(--line)}
.new-row input[type=text]{flex:1;min-width:160px;border-color:transparent;background:transparent;padding-left:4px}
.new-row input[type=text]::placeholder{color:var(--ink-3)}
.new-row input[type=text]:focus{border-color:var(--line-2);box-shadow:none}
.new-row select,.new-row input[type=date]{border-color:transparent;background:transparent;color:var(--ink-3);font-size:13px}
.new-row:focus-within select,.new-row:focus-within input[type=date]{border-color:var(--line-2);color:var(--ink)}

/* view tabs (Notion database tabs) */
.tabs,.seg{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--line);margin-bottom:14px;background:none;border-radius:0;padding:0}
.tabs::-webkit-scrollbar,.seg::-webkit-scrollbar{display:none}
.tabs a,.seg a{position:relative;padding:6px 8px 8px;color:var(--ink-3);white-space:nowrap;font-size:14px;font-weight:500;border-radius:0}
.tabs a:hover,.seg a:hover{color:var(--ink)}
.tabs a.on,.seg a.on{color:var(--ink);background:none}
.tabs a.on::after,.seg a.on::after{content:"";position:absolute;left:6px;right:6px;bottom:-1px;height:2px;background:var(--ink)}
.tabs a span{color:var(--ink-3);font-weight:400;margin-left:4px}
.seg.inline{border:0;margin:0}

/* select pills */
.pill{display:inline-flex;align-items:center;gap:5px;border-radius:4px;padding:0 6px;font-size:13px;line-height:20px;font-weight:400;background:var(--s-default);color:var(--s-ink);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.pill.good,.pill.green{background:var(--s-green)}.pill.warn,.pill.yellow{background:var(--s-yellow)}.pill.orange{background:var(--s-orange)}
.pill.bad,.pill.red{background:var(--s-red)}.pill.blue{background:var(--s-blue)}.pill.purple{background:var(--s-purple)}
.pill.pink{background:var(--s-pink)}.pill.brown{background:var(--s-brown)}.pill.gray{background:var(--s-gray)}
/* status pills carry a dot like Notion's status property */
.pill.st::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.55}
.who{display:inline-flex;align-items:center;gap:6px;font-size:14px;color:var(--ink)}
.av{width:20px;height:20px;border-radius:50%;display:inline-grid;place-items:center;font-size:10px;font-weight:600;color:#fff;background:#8a8984;flex:none}
.av.p1{background:#2f80c8}.av.p2{background:#9065b0}.av.p3{background:#448361}.av.p4{background:#d9730d}.av.p5{background:#c14c8a}.av.p6{background:#8a8984}
.due{font-size:14px;color:var(--ink-2);white-space:nowrap}
.due.overdue{color:var(--critical)}.due.soon{color:var(--warning)}

/* property rows (Notion page properties) */
.props{display:grid;grid-template-columns:minmax(120px,170px) minmax(0,1fr);row-gap:1px;margin:2px 0 16px;font-size:14px}
.props>.k{display:flex;align-items:center;gap:7px;color:var(--ink-3);padding:5px 6px;min-height:34px;border-radius:4px}
.props>.k i{font-style:normal;width:16px;text-align:center;opacity:.8}
.props>.v{display:flex;align-items:center;flex-wrap:wrap;gap:4px;min-height:34px;padding:2px 0;min-width:0}
.props>.v.top{align-items:flex-start;padding-top:5px}
.props input[type=text],.props input[type=date],.props input[type=number],.props input[type=url],.props select,.props textarea{
  border-color:transparent;background:transparent;padding:5px 6px;width:100%;font-size:14px;border-radius:4px}
.props input[type=date]{width:auto}
.props input:hover,.props select:hover,.props textarea:hover{background:var(--hover)}
.props input:focus,.props select:focus,.props textarea:focus{background:var(--bg);border-color:var(--line-2);box-shadow:var(--pop-shadow)}
.props textarea{min-height:34px;resize:none;field-sizing:content}
.props input::placeholder,.props textarea::placeholder{color:var(--ink-3);opacity:.7}
.props .group{grid-column:1/-1;font-size:12px;font-weight:600;color:var(--ink-3);padding:16px 6px 4px;letter-spacing:.02em}
.props .to{color:var(--ink-3);padding:0 2px}
.props .hint{font-size:12px;color:var(--ink-3);padding:0 6px}
@media (max-width:560px){.props{grid-template-columns:118px minmax(0,1fr)}}
.opt{position:relative;display:inline-flex;cursor:pointer}
.opt input{position:absolute;opacity:0;inset:0;cursor:pointer;margin:0}
.opt span{border-radius:4px;padding:0 6px;font-size:13px;line-height:22px;background:transparent;color:var(--ink-3);border:1px dashed var(--line-2)}
.opt.on span{background:var(--s-blue);color:var(--s-ink);border:1px solid transparent}
.opt:focus-within span{outline:2px solid var(--accent-soft)}
.save-state{font-size:13px;color:var(--ink-3)}
.missing{display:flex;flex-wrap:wrap;gap:4px}
input[type=text].title-in{width:100%;border:0;box-shadow:none;border-radius:0;background:transparent;color:var(--ink);font:inherit;font-size:40px;font-weight:700;line-height:1.2;padding:0;margin:0 0 10px;outline:none;letter-spacing:-.01em}
@media (max-width:640px){input[type=text].title-in{font-size:30px}}

/* lists / rows */
.rows{list-style:none;margin:0;padding:0}
.rows>li{display:flex;align-items:center;gap:10px;padding:6px 2px;border-top:1px solid var(--line);flex-wrap:wrap;font-size:15px}
.rows>li:first-child{border-top:0}
.rows>li:hover{background:linear-gradient(var(--hover),var(--hover))}
.rows .grow{flex:1;min-width:180px}
.rows .meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:1px}
.row-title{font-weight:500;color:var(--ink)}
a.row-title:hover{text-decoration:underline;text-decoration-color:var(--line-2)}
.age{font-size:13px;color:var(--ink-3)}
.age.stale{color:var(--critical)}
table.t{width:100%;border-collapse:collapse;font-size:14px}
table.t th{text-align:left;font-size:14px;color:var(--ink-3);font-weight:400;padding:7px 8px;border-bottom:1px solid var(--line);border-top:1px solid var(--line);white-space:nowrap}
table.t th+th,table.t td+td{border-left:1px solid var(--line)}
table.t td{padding:7px 8px;border-bottom:1px solid var(--line);vertical-align:top}
table.t tr:hover td{background:var(--hover)}
.tscroll{overflow-x:auto}
@media (max-width:640px){
  table.t.cards thead{display:none}
  table.t.cards tr{display:block;border-bottom:1px solid var(--line);padding:8px 0}
  table.t.cards td{display:flex;justify-content:space-between;gap:10px;border:0!important;padding:3px 0}
  table.t.cards td::before{content:attr(data-l);color:var(--ink-3);font-size:13px}
  table.t.cards td:first-child::before{content:none}
}

/* action items: a round checkbox to close, like a Notion to-do */
.act{position:relative}
.act select,.act input[type=date]{padding:2px 4px;font-size:13px;border-color:transparent;background:transparent;color:var(--ink-2);width:auto}
.act select:hover,.act input[type=date]:hover{background:var(--hover)}
.act input[type=date].overdue{color:var(--critical)}
.act form{display:inline}
.check{width:18px;height:18px;border-radius:50%;border:1.5px solid var(--ink-3);background:transparent;cursor:pointer;padding:0;display:grid;place-items:center;flex:none;font-size:11px;color:transparent}
.check:hover{border-color:var(--good);color:var(--good)}
.check.on{background:var(--good);border-color:var(--good);color:#fff}
.check.doing{border-color:var(--accent);border-style:dashed}
.act.closed .row-title{color:var(--ink-3);text-decoration:line-through}
.menu{position:relative}
.menu>summary{list-style:none;cursor:pointer;color:var(--ink-3);padding:0 6px;border-radius:4px;font-size:16px;line-height:24px}
.menu>summary::-webkit-details-marker{display:none}
.menu>summary:hover{background:var(--hover);color:var(--ink)}
.menu>div{position:absolute;right:0;top:26px;z-index:20;background:var(--card);box-shadow:var(--pop-shadow);border-radius:6px;padding:4px;min-width:150px;display:flex;flex-direction:column}
.menu>div button{border:0;background:transparent;text-align:left;padding:5px 9px;border-radius:4px;cursor:pointer;font-size:14px;width:100%}
.menu>div button:hover{background:var(--hover)}
.owner-group+.owner-group{margin-top:16px}
.owner-group h3{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:600;margin-bottom:2px}
.owner-group h3 .n{color:var(--ink-3);font-weight:400}

/* update page */
.update-nav{display:flex;gap:4px;align-items:center;flex-wrap:wrap}
.section{margin-top:30px}
.section-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:2px}
.section-head h2{margin:0}
.section-head .small{font-size:13px}
.toc{display:flex;flex-direction:column;gap:0;margin:0 0 6px;padding:0;font-size:14px}
.toc a{color:var(--ink-3);padding:2px 0;text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px;align-self:flex-start}
.toc a:hover{color:var(--ink)}
.callout{display:flex;gap:10px;background:var(--hover);border-radius:6px;padding:14px 16px;font-size:15px;margin:10px 0}
.callout>i{font-style:normal;font-size:18px;line-height:1.3}

/* timeline (Notion timeline view) */
.tl{position:relative;overflow-x:auto;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:6px 0 4px}
.tl-in{position:relative;min-width:760px;padding-bottom:6px}
.tl-head{position:relative;height:30px;border-bottom:1px solid var(--line);font-size:12px;color:var(--ink-3)}
.tl-head span{position:absolute;top:7px;transform:translateX(3px);white-space:nowrap}
.tl-grid{position:absolute;inset:30px 0 0 0;pointer-events:none}
.tl-grid i{position:absolute;top:0;bottom:0;border-left:1px solid var(--line)}
.tl-grid b{position:absolute;top:-30px;bottom:0;width:2px;background:var(--critical);opacity:.7}
.tl-grid b::before{content:"";position:absolute;top:0;left:-5px;width:8px;height:8px;border-radius:50%;background:var(--critical)}
.tl-row{position:relative;height:34px}
.tl-bar{position:absolute;top:5px;height:24px;border-radius:5px;background:var(--card);box-shadow:var(--card-shadow);display:flex;align-items:center;padding:0 8px;font-size:13px;font-weight:500;color:var(--ink);white-space:nowrap;overflow:visible}
.tl-bar:hover{background:var(--hover-2)}
.tl-bar .lbl{position:relative;z-index:1}
.tl-bar.t1{background:var(--s-red)}.tl-bar.t2{background:var(--s-orange)}.tl-bar.t3{background:var(--s-gray)}
.tl-bar.done{opacity:.55}
.tl-bar.cut-l{border-top-left-radius:0;border-bottom-left-radius:0}.tl-bar.cut-r{border-top-right-radius:0;border-bottom-right-radius:0}
.tl-ev{position:absolute;top:25px;width:9px;height:9px;transform:translateX(-4.5px) rotate(45deg);background:var(--ink);border:1.5px solid var(--bg);z-index:2}
.tl-row{height:38px}
.tl-legend{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;color:var(--ink-3);margin-top:6px}
.tl-legend span{display:inline-flex;align-items:center;gap:5px}
.tl-legend i{display:inline-block;width:14px;height:10px;border-radius:3px}

/* rich text */
.prose{font-size:16px;line-height:1.5;overflow-wrap:anywhere}
.prose>*:first-child{margin-top:0}.prose>*:last-child{margin-bottom:0}
.prose p{margin:2px 0;padding:3px 0;min-height:1.5em}
.prose h2{font-size:24px;margin:1.1em 0 2px}.prose h3{font-size:20px;margin:1em 0 1px}.prose h4{font-size:16px;margin:.8em 0 1px}
.prose ul,.prose ol{margin:2px 0;padding-left:1.6em}
.prose li{padding:2px 0}
.prose li>p{margin:0;padding:0}
.prose img{max-width:100%;height:auto;border-radius:4px;display:block;margin:6px 0}
.prose blockquote{margin:6px 0;padding:0 14px;border-left:3px solid currentColor}
.prose table{border-collapse:collapse;width:100%;margin:8px 0;font-size:14px;display:block;overflow-x:auto}
.prose th,.prose td{border:1px solid var(--line-2);padding:6px 8px;vertical-align:top;min-width:90px}
.prose th{background:var(--hover);text-align:left;font-weight:500}
.prose code{font-family:var(--mono);font-size:85%;background:var(--hover-2);color:#eb5757;padding:.2em .4em;border-radius:4px}
.prose pre{background:var(--side);padding:24px 18px;border-radius:4px;overflow-x:auto;font-size:14px}
.prose pre code{background:none;color:inherit;padding:0}
.prose hr{border:0;border-top:1px solid var(--line-2);margin:14px 0}
.prose .mention{color:var(--ink-2);font-weight:500}
.prose .mention::before{content:""}
.prose ul[data-type=taskList]{list-style:none;padding-left:.15em}
.prose ul[data-type=taskList] li{display:flex;gap:8px;align-items:flex-start}
.prose ul[data-type=taskList] li>label{margin-top:.2em}
.prose ul[data-type=taskList] li>div{flex:1}
.prose ul[data-type=taskList] input{width:16px;height:16px;accent-color:var(--accent)}
.prose li[data-checked=true]>p,.prose li[data-checked=true]>div{color:var(--ink-3);text-decoration:line-through}

/* editor: always on, no box. Formatting appears over a selection; "/" opens the block menu */
.ed{position:relative}
.ed-body .ProseMirror{outline:none;min-height:1.6em;padding:3px 0}
.ed-body .ProseMirror p.is-editor-empty:first-child::before{content:attr(data-placeholder);color:var(--ink-3);opacity:.75;float:left;height:0;pointer-events:none}
.ed-body .ProseMirror img.ProseMirror-selectednode{outline:3px solid var(--accent-soft)}
.ed-foot{display:flex;justify-content:flex-end;min-height:18px}
.ed-status{font-size:12px;color:var(--ink-3)}.ed-status.ok{color:var(--ink-3)}.ed-status.bad{color:var(--critical)}
.bubble{position:absolute;z-index:60;display:flex;gap:0;background:var(--card);box-shadow:var(--pop-shadow);border-radius:6px;padding:3px}
.bubble[hidden]{display:none}
.bubble button{border:0;background:transparent;color:var(--ink);font-size:14px;font-weight:600;min-width:30px;height:28px;padding:0 7px;border-radius:4px;cursor:pointer}
.bubble button:hover{background:var(--hover)}.bubble button.on{color:var(--accent)}
.mention-pop{position:absolute;z-index:60;background:var(--card);border-radius:6px;box-shadow:var(--pop-shadow);padding:4px;display:flex;flex-direction:column;min-width:220px;max-height:320px;overflow-y:auto}
.mention-pop .lbl{font-size:12px;color:var(--ink-3);padding:4px 10px 2px}
.mention-pop button{display:flex;align-items:center;gap:10px;text-align:left;border:0;background:transparent;color:var(--ink);font:inherit;font-size:14px;padding:5px 10px;border-radius:4px;cursor:pointer}
.mention-pop button i{font-style:normal;width:24px;height:24px;display:grid;place-items:center;border-radius:4px;box-shadow:var(--card-shadow);font-size:13px;flex:none}
.mention-pop button.on,.mention-pop button:hover{background:var(--hover)}

/* board (Notion board view) */
.board{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(250px,1fr);gap:14px;overflow-x:auto;padding-bottom:8px}
.col{min-width:250px}
.col h3{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:var(--ink-3);margin:0 0 8px}
.col h3>span:last-child{color:var(--ink-3);font-weight:400}
.tile{display:block;background:var(--card);box-shadow:var(--card-shadow);border-radius:6px;padding:9px 10px;color:var(--ink);margin-bottom:8px}
.tile:hover{background:var(--hover)}
.tile b{display:block;font-weight:500;font-size:14px;line-height:1.4}
.tile .meta{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:6px;font-size:13px;color:var(--ink-3)}
.next{font-size:14px;color:var(--ink-2);margin-top:4px}
.next b{display:inline;font-size:13px;color:var(--ink-3);font-weight:500}
.bar{height:4px;background:var(--line-2);border-radius:999px;overflow:hidden;margin-top:8px}
.bar i{display:block;height:100%;background:var(--good)}

/* calendar */
.cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}
.cal .dow{font-size:13px;color:var(--ink-3);padding:6px 8px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);text-align:right}
.cal .day{min-height:116px;padding:4px;display:flex;flex-direction:column;gap:3px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.cal .day.out{background:var(--side)}.cal .day.out .num{color:var(--ink-3)}
.cal .num{font-size:13px;align-self:flex-end;padding:0 4px;line-height:22px}
.cal .day.today .num{background:var(--critical);color:#fff;border-radius:999px;min-width:22px;text-align:center}
.cal .ev{display:block;font-size:12px;line-height:1.35;padding:3px 6px;border-radius:4px;color:var(--ink);background:var(--card);box-shadow:var(--card-shadow);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cal .ev:hover{background:var(--hover)}
.cal .ev.camp{background:var(--s-pink);box-shadow:none}
/* post status = a small dot before the title, like a Notion status property */
[class*="st-"]:not(.pill)::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:6px;vertical-align:1px;background:var(--dot,transparent)}
.st-idea{--dot:#9b9a97}.st-draft{--dot:var(--warning)}.st-pending_approval{--dot:var(--critical)}
.st-ready{--dot:var(--accent)}.st-scheduled{--dot:#9065b0}.st-posted{--dot:var(--good)}.st-canceled{--dot:var(--line-2);opacity:.6}
@media (max-width:760px){.cal-grid-wrap{display:none}.cal-list-mobile{display:block!important}}
.cal-list-mobile{display:none}

/* wiki */
.wiki{display:grid;grid-template-columns:240px minmax(0,1fr);gap:36px;align-items:start}
.wiki nav ul{list-style:none;margin:0;padding-left:12px}
.wiki nav>ul{padding-left:0}
.wiki nav li a{display:block;padding:3px 8px;border-radius:5px;color:var(--ink-2);font-size:14px}
.wiki nav li a.on{background:var(--hover-2);color:var(--ink);font-weight:500}
.wiki nav li a:hover{background:var(--hover)}
@media (max-width:860px){.wiki{grid-template-columns:minmax(0,1fr)}.wiki nav{order:2}}

/* comments */
.thread{list-style:none;margin:0;padding:0}
.thread li{padding:8px 0;border-top:1px solid var(--line);font-size:15px}
.thread li:first-child{border-top:0}
.thread .by{font-size:13px;color:var(--ink-3);margin-bottom:1px}

/* login + misc */
.login{max-width:360px;margin:14vh auto 0}
.login input{width:100%;margin-bottom:12px}
.brand{display:flex;align-items:center;gap:9px;font-weight:600;font-size:18px}
.brand .dot{width:12px;height:12px;border-radius:3px;background:var(--accent);transform:rotate(45deg)}
.err{background:var(--s-red);color:var(--s-ink);border-radius:6px;padding:8px 10px;font-size:14px;margin-bottom:12px}
.banner{background:var(--s-yellow);color:var(--s-ink);border-radius:6px;padding:8px 12px;font-size:14px;margin-bottom:14px}
.kpis{display:flex;gap:28px;flex-wrap:wrap}
.kpi{min-width:100px}
.kpi b{display:block;font-size:28px;font-weight:600;line-height:1.1}
.kpi span{font-size:13px;color:var(--ink-3)}

/* borderless selects/dates inside tables, like Notion cells */
.pill-select{border-color:transparent!important;background:transparent!important;padding:2px 4px!important;font-size:13px!important;color:var(--ink)}
.pill-select:hover{background:var(--hover)!important}
.pill-select.overdue{color:var(--critical)}
@media (max-width:640px){.so-long{display:none}}

/* board drag and drop */
.board .tile{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;cursor:grab;touch-action:pan-x pan-y}
.board .list{min-height:60px;border-radius:6px;padding:2px;transition:background .12s}
.board .list:empty::before{content:"No items";display:block;color:var(--ink-3);font-size:14px;padding:6px 4px}
.board .col.over .list{background:var(--accent-soft)}
.board.is-dragging,.board.is-dragging .tile{cursor:grabbing}
.tile.dragging{opacity:.35}
.tile.ghost{position:fixed;z-index:100;pointer-events:none;transform:rotate(2deg);box-shadow:var(--pop-shadow);opacity:.95;margin:0}
.tile.moved{animation:moved .9s ease}
@keyframes moved{0%{background:var(--accent-soft)}100%{background:var(--card)}}
.tl-bar.t-blue{background:var(--s-blue)}.tl-bar.t-green{background:var(--s-green)}

/* resizable columns */
table.t th{position:relative}
.col-resize{position:absolute;top:0;right:-3px;width:7px;height:100%;cursor:col-resize;z-index:2}
.col-resize:hover,.col-resizing .col-resize:active{background:var(--accent);opacity:.5}
body.col-resizing{cursor:col-resize;user-select:none}
table.t td{overflow-wrap:anywhere}
@media (max-width:640px){.col-resize{display:none}}
/* a table cell you can type in that wraps, like a Notion title cell */
textarea.cell-text{display:block;width:100%;min-height:0;border:1px solid transparent;background:transparent;padding:2px 4px;font:inherit;font-size:14px;font-weight:500;resize:none;overflow:hidden;line-height:1.4;color:var(--ink)}
textarea.cell-text:hover{background:var(--hover)}
textarea.cell-text:focus{background:var(--bg);border-color:var(--line-2);box-shadow:none}
/* empty dates read as blank, like Notion, until you click them */
input.nd:not(:focus):invalid::-webkit-datetime-edit{color:transparent}
input.nd:not(:focus):invalid{color:transparent}

/* page cover (Notion: full width, 30vh) + icon overlapping it */
.cover{height:30vh;max-height:280px;min-height:140px;background-size:cover;background-position:center 40%}
.cover+.page{padding-top:0}
.cover+.page .page-head .ic{margin-top:-42px;position:relative}
.wiki .page-head .ic{font-size:48px}

/* database blocks inside pages */
.dbblock{margin-top:26px}
.dbtitle{font-size:20px;margin:0 0 4px}
.dbtitle a:hover{text-decoration:underline;text-decoration-color:var(--line-2)}
.page-h3{margin:34px 0 0;font-size:20px}
.view-note{margin:0 0 10px}
.dblink a{display:inline-flex;gap:6px;align-items:center;padding:3px 2px;font-weight:500}
.dblink a span{text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px}
details.grp{margin:10px 0 16px}
details.grp>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:8px;padding:4px 0 6px;font-size:14px}
details.grp>summary::-webkit-details-marker{display:none}
details.grp>summary::before{content:"▾";color:var(--ink-3);font-size:11px;width:12px}
details.grp:not([open])>summary::before{content:"▸"}
select.cellsel{appearance:none;-webkit-appearance:none;border:0!important;padding:0 6px!important;font-size:13px!important;line-height:20px;cursor:pointer;max-width:100%}
select.cellsel.none{background:transparent!important;color:var(--ink-3)}
select.cellsel.none:hover{background:var(--hover)!important}
.saved{outline:2px solid color-mix(in srgb,var(--good) 45%,transparent);outline-offset:1px}
.unsaved{outline:2px solid var(--critical)}
.ppl{display:inline-flex;flex-wrap:wrap;gap:4px 10px}
.pct{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--ink-2)}
.pct .bar{width:70px;margin:0}
a.rel{display:inline-flex;gap:4px;font-size:13px;padding:0 4px;border-radius:4px;text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:2px}
a.rel:hover{background:var(--hover)}
textarea.cell-text.plain{font-weight:400}
.tile .meta .pill{font-size:12px}

/* database timeline: the page scrolls sideways; lanes = groups */
.dbtl .tl-head span.mo{color:var(--ink);font-weight:500}
.tl-lane{position:sticky;left:0;display:inline-flex;align-items:center;gap:8px;padding:10px 6px 4px;z-index:3}
.dbbar{background:var(--card);box-shadow:var(--card-shadow);gap:8px;min-width:0}
.dbbar .lbl-x{font-weight:400;display:inline-flex;gap:4px}
.dbbar .lbl-x .who{font-size:12px}

/* bar chart (Load per person): stacked counts, Notion option colours, value at the end */
.chart-legend{display:flex;gap:14px;flex-wrap:wrap;font-size:13px;color:var(--ink-2);margin-bottom:10px}
.chart-legend span{display:inline-flex;align-items:center;gap:6px}
.sw{display:inline-block;width:10px;height:10px;border-radius:3px}
.hbars{display:flex;flex-direction:column;gap:10px;max-width:720px}
.hbar{display:grid;grid-template-columns:140px minmax(0,1fr) 34px;align-items:center;gap:10px;font-size:14px}
.hbar .who-l{color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hbar .track{display:flex;gap:2px;height:20px}
.hbar .seg{display:block;height:100%;min-width:3px}
.hbar .seg:first-child{border-radius:4px 0 0 4px}.hbar .seg:last-child{border-radius:0 4px 4px 0}.hbar .seg:only-child{border-radius:4px}
.hbar .tot{color:var(--ink);font-variant-numeric:tabular-nums}
.sw.red,.seg.red{background:#e16259}.sw.yellow,.seg.yellow{background:#dfab01}.sw.green,.seg.green{background:#4d9a6a}
.sw.gray,.seg.gray,.sw.default,.seg.default{background:#9b9a97}
@media (max-width:640px){.hbar{grid-template-columns:90px minmax(0,1fr) 28px}}
textarea.title-in{display:block;width:100%;border:0;background:transparent;color:var(--ink);font:inherit;font-size:40px;font-weight:700;line-height:1.2;padding:0;margin:0 0 10px;outline:none;resize:none;overflow:hidden;box-shadow:none!important;letter-spacing:-.01em}
@media (max-width:640px){textarea.title-in{font-size:30px}}
.props select.cellsel{width:auto;min-width:0}
/* database tables keep Notion-like column widths and scroll sideways instead of crushing text */
.dbblock table.t th,#db-initiatives table.t th,.page.wide table.t[data-key^="initiatives"] th,.page.wide table.t[data-key^="projects"] th,.page.wide table.t[data-key^="tasks"] th{min-width:110px}
table.t[data-key^="initiatives"] th:first-child,table.t[data-key^="projects"] th:first-child,table.t[data-key^="tasks"] th:first-child{min-width:230px}
table.t .who{white-space:nowrap}
@media (max-width:640px){table.t th{min-width:0!important}}

/* update page: one quiet meta line, one-row contents, lighter section headers */
.upd-head{margin-bottom:10px}
.upd-head .ic{font-size:44px;margin-bottom:6px}
.meta-line{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin:10px 0 0!important;font-size:14px;color:var(--ink-3)}
.meta-line a{color:var(--ink-3);text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px}
.meta-line a:hover{color:var(--ink)}
.toc-row{display:flex;flex-wrap:wrap;gap:4px 18px;padding:10px 0 12px;border-bottom:1px solid var(--line);font-size:14px}
.toc-row a{display:inline-flex;align-items:center;gap:6px;color:var(--ink-3)}
.toc-row a:hover{color:var(--ink)}
.toc-row i{width:7px;height:7px;border-radius:50%;border:1.5px solid var(--ink-3);opacity:.6}
.toc-row i.on{background:var(--good);border-color:var(--good);opacity:1}
.section{margin-top:34px;scroll-margin-top:56px}
.section-head{gap:12px;margin-bottom:4px}
.section-head h2{font-size:22px}
.sec-meta{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--ink-3)}
.sec-meta .av{width:18px;height:18px;font-size:9px}
.prose .mention{color:var(--ink);font-weight:500;background:var(--hover);border-radius:4px;padding:0 3px}

/* Update page: drag blocks by their handle (blocks.js) */
.blocks > .blk { position: relative; }
.blk-handle { position: absolute; left: -30px; top: 6px; width: 22px; height: 26px; padding: 0; border: 0; border-radius: 4px;
  background: none; color: var(--muted); font-size: 14px; letter-spacing: -2px; line-height: 26px; cursor: grab;
  opacity: 0; transition: opacity .12s; touch-action: none; user-select: none; }
.blk:hover > .blk-handle, .blk-handle:focus-visible { opacity: 1; }
.blk-handle:hover { background: var(--hover, rgba(55,53,47,.08)); }
body.blk-moving, body.blk-moving * { cursor: grabbing !important; user-select: none; }
.blk.dragging { opacity: .4; }
.blk-drop { height: 3px; margin: -2px 0; border-radius: 2px; background: #2383e2; }
.blk.moved { animation: blkflash .9s; }
@keyframes blkflash { from { background: rgba(35,131,226,.12); } to { background: transparent; } }
@media (hover: none), (max-width: 760px) {
  .blk-handle { opacity: .55; left: auto; right: 0; top: 4px; }
  .blk > .card-head, .blk > .section-head { padding-right: 28px; }
}

/* People and access (/people) */
.callout.warn{background:var(--s-red,#fdebec)}
.callout.good{background:var(--s-green,#edf3ec)}
.callout code.pw{font-size:15px;font-weight:600;user-select:all}
.people-add .fields label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--ink-2)}
.access-pick{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:12px 0}
.people-list{display:grid;gap:10px;margin-top:14px}
.person{padding:14px 16px}
.person.off{opacity:.65}
.person-head{display:flex;align-items:center;gap:8px}
.person-head .grow{flex:1;min-width:0}
input[type=text].name-in{width:100%;border:0;background:transparent;font-size:16px;font-weight:600;padding:2px 4px;margin-left:-4px}
input[type=text].name-in:hover,input[type=text].name-in:focus{background:var(--hover,rgba(55,53,47,.06))}
.person-meta{margin:2px 0 0 32px}
.person .access-pick{margin:10px 0 6px}
.person-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:6px}
.person-actions form:first-child{margin-right:auto}
.btn.danger{color:var(--bad,#d44c47)}

/* comments, history, view-only, access levels */
.comments .thread{list-style:none;margin:6px 0 10px;padding:0}
.comments .thread li{padding:8px 0;border-bottom:1px solid var(--line)}
.comments .thread .by{font-size:13px;color:var(--ink-3);display:flex;align-items:center;gap:6px;margin-bottom:2px}
.comments .cm-body{white-space:pre-wrap}
.comments .n{font-size:14px;color:var(--ink-3);font-weight:400}
.cm-new{display:flex;gap:8px;align-items:flex-end;position:relative}
.cm-new textarea{flex:1;min-height:40px;resize:vertical}
.cm-pop{position:absolute;bottom:100%;left:0;z-index:20;background:var(--bg);border:1px solid var(--line-2);border-radius:6px;box-shadow:0 4px 14px rgba(0,0,0,.12);padding:4px;display:flex;flex-direction:column;min-width:180px}
.cm-pop[hidden]{display:none}
.cm-pop button{border:0;background:none;text-align:left;padding:6px 8px;border-radius:4px;font:inherit;color:var(--ink);cursor:pointer}
.cm-pop button:hover{background:var(--hover)}
.ed-foot{display:flex;align-items:center;gap:10px}
.ed-hist{margin-left:auto;font-size:12px;color:var(--ink-3)}
.ed-hist:hover{color:var(--ink)}
.hist .card-head h3{margin:0;font-size:15px}
.hist-prev{margin-top:8px;padding:10px 12px;border:1px solid var(--line);border-radius:6px;background:var(--hover)}
.ro-bar{margin:0 auto;max-width:1100px;padding:8px 16px;font-size:13px;background:var(--s-yellow,#fbf3db);color:var(--ink-2);border-radius:6px}
body.ro .new-row,body.ro .cm-new,body.ro .blk-handle{display:none}
.access-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:6px 14px;margin:10px 0 6px}
.access-grid .lvl{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:13px;padding:4px 8px;border-radius:6px;border:1px solid var(--line)}
.access-grid .lvl.none{opacity:.65}
.access-grid .lvl.view{background:var(--s-yellow,#fbf3db)}
.access-grid .lvl.edit{background:var(--s-blue)}
.access-grid select{font-size:13px;padding:2px 4px}
.tpl-bar{margin:4px 0 0}
.tpl-bar[hidden]{display:none}
.tpl-bar select{font-size:13px;color:var(--ink-3);border-style:dashed}
/* timeline drag */
.tl-bar.dragable{cursor:grab;touch-action:pan-x pan-y}
.tl-bar.dragable:not([data-single])::before,.tl-bar.dragable:not([data-single])::after{content:"";position:absolute;top:0;bottom:0;width:8px;cursor:ew-resize}
.tl-bar.dragable::before{left:0}.tl-bar.dragable::after{right:0}
.tl-bar.dragging{opacity:.85;box-shadow:0 4px 14px rgba(0,0,0,.18);z-index:5}
body.tl-moving,body.tl-moving *{cursor:grabbing!important;user-select:none}
.tl-bar.moved{animation:blkflash .9s}
.offline-bar{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);z-index:50;background:#37352f;color:#fff;padding:8px 14px;border-radius:8px;font-size:13px;max-width:calc(100% - 32px);box-shadow:0 4px 14px rgba(0,0,0,.2)}
.offline-bar[hidden]{display:none}
.overdue:not(.pill-select):not(.due){color:var(--critical)}
.prose .img-rs{position:relative;display:inline-block;max-width:100%;line-height:0}
.prose .img-rs img{margin:6px 0}
.prose .img-rs .img-h{position:absolute;right:-5px;top:50%;width:10px;height:44px;margin-top:-22px;border-radius:6px;background:var(--blue,#2383e2);border:2px solid var(--bg,#fff);cursor:ew-resize;touch-action:none;opacity:0;transition:opacity .15s}
.prose .img-rs:hover .img-h,.prose .img-rs.sel .img-h{opacity:1}
.prose .img-rs.sel img{outline:2px solid var(--blue,#2383e2);outline-offset:1px}
@media (hover:none){.prose .img-rs .img-h{opacity:.85;width:14px;right:-7px}}
/* filter bar on table and board views (filters.js) */
.fbar{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:-4px 0 10px}
.fbar .fsearch{width:150px;font-size:13px;padding:4px 8px;border:1px solid var(--line);border-radius:6px;background:var(--bg);color:inherit}
.fdd{position:relative}
.fdd>summary{list-style:none;cursor:pointer;font-size:13px;color:var(--ink-3);padding:3px 9px;border:1px solid var(--line);border-radius:14px;white-space:nowrap;user-select:none}
.fdd>summary::-webkit-details-marker{display:none}
.fdd>summary::after{content:" ▾";font-size:10px}
.fdd.on>summary{color:#2383e2;border-color:#2383e2;background:rgba(35,131,226,.07)}
.fdd .fn{font-weight:500}
.fmenu{position:absolute;z-index:30;top:calc(100% + 4px);left:0;min-width:190px;max-height:320px;overflow:auto;background:var(--bg);border:1px solid var(--line);border-radius:8px;box-shadow:0 6px 20px rgba(0,0,0,.12);padding:4px}
.fmenu label{display:flex;align-items:center;gap:8px;padding:5px 8px;border-radius:5px;font-size:14px;cursor:pointer}
.fmenu label:hover{background:var(--hover)}
.fcount{margin-left:2px}
th.sortable{cursor:pointer;user-select:none}
th.sortable:hover{background:var(--hover)}
th.asc::after{content:" ↑";color:#2383e2}
th.desc::after{content:" ↓";color:#2383e2}
@media (max-width:640px){.fbar .fsearch{width:100%}}
.dbv [hidden]{display:none!important}
@media (min-width:641px){table.t th[data-k=title]{min-width:240px}}