/* Tabbaze V60 — targeted presentation changes, no layout redesign. */
/* A soft depth cue, not a solid separator. */
body[data-theme="dark"] #app > .hintbar{box-shadow:0 12px 23px -17px rgba(0,0,0,.77)!important}
body[data-theme="light"] #app > .hintbar{box-shadow:0 12px 23px -17px rgba(39,52,76,.24)!important}

/* Three views use the original segmented switch. */
#app .view-switch #view-icons svg{width:17px;height:17px;display:block;flex:none}
#app .view-switch .view-choice[aria-pressed="true"]{color:var(--text)}
#app .view-switch .view-choice.active[aria-pressed="true"]{color:white}
@media(max-width:650px){
 #app>.project-bar .tb-mobile-project-bulk .view-switch{gap:2px!important;padding:3px!important;flex:0 0 auto!important}
 #app>.project-bar .tb-mobile-project-bulk .view-choice{
  width:34px!important;min-width:34px!important;height:32px!important;min-height:32px!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  padding:0!important;gap:0!important;font-size:19px!important;line-height:1!important;
 }
 #app>.project-bar .tb-mobile-project-bulk .view-choice span{display:none!important}
 #app>.project-bar .tb-mobile-project-bulk #view-icons svg{width:19px;height:19px}
 #app>.project-bar .tb-mobile-project-bulk .tb-link-display-switches{width:40px!important;flex:0 0 40px!important}
}
@media(max-width:350px){
 #app>.project-bar .tb-mobile-project-bulk .view-choice{width:30px!important;min-width:30px!important}
 #app>.project-bar .tb-mobile-project-bulk .view-switch{gap:0!important;padding:2px!important}
}

/* Per-category visual modes. The board and category structure remain intact. */
#app .board .category[data-tb-view="icons"] .tiles{
 display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;
 align-items:start!important;justify-content:stretch!important;
 column-gap:6px!important;row-gap:7px!important;min-height:0!important;
 overflow:visible!important;scroll-snap-type:none!important;padding:2px 0!important;
}
#app .board .category[data-tb-view="icons"] .tile{
 min-width:0!important;max-width:none!important;width:100%!important;min-height:45px!important;
 padding:0!important;border:1px solid transparent!important;border-radius:9px!important;
 background:transparent!important;box-shadow:none!important;
 display:flex!important;align-items:center!important;justify-content:center!important;
 overflow:visible!important;transform:none!important;position:relative!important;
}
#app .board .category[data-tb-view="icons"] .tile > a{
 display:flex!important;flex:1 1 auto!important;flex-direction:column!important;
 align-items:center!important;justify-content:center!important;
 min-height:45px!important;height:45px!important;max-width:100%!important;
 padding:3px!important;gap:0!important;text-align:center!important;
 border-radius:9px!important;text-decoration:none!important;
}
#app .board .category[data-tb-view="icons"] .tile img,
#app .board .category[data-tb-view="icons"] .tile .fallback{
 width:29px!important;height:29px!important;max-width:100%!important;
 flex:0 0 29px!important;object-fit:contain!important;
}
#app .board .category[data-tb-view="icons"] .tile .tn{display:none!important}
#app .board .category[data-tb-view="icons"] .tile:is(:hover,:focus-within){
 background:color-mix(in srgb,var(--text) 7%,transparent)!important;
}
#app .board .category[data-tb-view="icons"] .tile .note{right:3px!important;left:auto!important;bottom:3px!important}
#app .board .category[data-tb-view="icons"] .tile .tile-more{
 z-index:2;right:-3px!important;top:-3px!important;transform:scale(.83);transform-origin:top right;
}
#app .board .category[data-tb-view="icons"] .tile:focus-visible{outline:2px solid var(--blue);outline-offset:1px}

/* A list is also available when just one category overrides the global mode. */
#app .board:not(.links-list) .category[data-tb-view="list"] .tiles{
 display:flex!important;flex-direction:column!important;align-items:stretch!important;
 gap:6px!important;overflow:visible!important;min-height:0!important;padding:0!important;
 scroll-snap-type:none!important;
}
#app .board:not(.links-list) .category[data-tb-view="list"] .tile{
 flex:0 0 auto!important;width:100%!important;max-width:none!important;
 min-height:44px!important;transform:none!important;
}
#app .board:not(.links-list) .category[data-tb-view="list"] .tile > a{
 display:flex!important;flex-direction:row!important;align-items:center!important;
 justify-content:flex-start!important;gap:11px!important;min-height:44px!important;
 padding:7px 36px 7px 10px!important;text-align:left!important;
}
#app .board:not(.links-list) .category[data-tb-view="list"] .tile img,
#app .board:not(.links-list) .category[data-tb-view="list"] .tile .fallback{
 width:24px!important;height:24px!important;flex:0 0 24px!important;
}
#app .board:not(.links-list) .category[data-tb-view="list"] .tile .tn{
 display:block!important;flex:1!important;min-width:0!important;max-width:100%!important;
 text-align:left!important;font-size:calc(11px * var(--tb-font-scale))!important;line-height:1.35!important;
}
#app .board:not(.links-list) .category[data-tb-view="list"] .tile .note{left:auto!important;right:8px!important;bottom:6px!important}
#app .board:not(.links-list) .category[data-tb-view="list"] .tile .editlink{left:auto!important;right:5px!important}
#app .board:not(.links-list) .category[data-tb-view="list"] .tile .copylink{left:auto!important;right:33px!important}

/* Restore original three-column tiles for category overrides of the global list. */
#app .board.links-list .category[data-tb-view="grid"] .tiles{
 display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;
 gap:7px!important;min-height:72px!important;overflow:visible!important;padding:0!important;
}
#app .board.links-list .category[data-tb-view="grid"] .tile{
 width:auto!important;max-width:none!important;min-height:0!important;
 flex:initial!important;transform:none;
}
#app .board.links-list .category[data-tb-view="grid"] .tile > a{
 display:flex!important;flex-direction:column!important;align-items:center!important;
 justify-content:center!important;gap:7px!important;min-height:86px!important;
 padding:12px 5px 8px!important;text-align:center!important;
}
#app .board.links-list .category[data-tb-view="grid"] .tile img,
#app .board.links-list .category[data-tb-view="grid"] .tile .fallback{
 width:28px!important;height:28px!important;flex:initial!important;
}
#app .board.links-list .category[data-tb-view="grid"] .tile .tn{
 display:block!important;flex:initial!important;text-align:center!important;
 font-size:calc(10px * var(--tb-font-scale))!important;
}

/* Stream move handle: deliberately separate from existing category drag handles. */
#app .tb-stream-heading .tb-stream-move{
 order:-1;display:grid;place-items:center;flex:0 0 23px;
 width:23px;height:29px;padding:0;margin:0 1px 0 0;
 border:0;border-radius:7px;background:transparent;
 color:var(--muted);cursor:grab;touch-action:none;opacity:.72;
}
#app .tb-stream-heading .tb-stream-move:hover,
#app .tb-stream-heading .tb-stream-move:focus-visible{
 opacity:1;color:var(--text);background:color-mix(in srgb,var(--text) 8%,transparent);
}
#app .tb-stream-heading .tb-stream-move svg{width:15px;height:15px;pointer-events:none}
#app .tb-stream-heading .tb-stream-move:active{cursor:grabbing}
#app .tb-stream-heading.tb-stream-moving{background:color-mix(in srgb,var(--blue) 9%,transparent);border-radius:9px}
#app .tb-stream-heading.tb-stream-drop-target{outline:1px dashed var(--blue);outline-offset:0;border-radius:9px}
@media(max-width:650px){
 #app .tb-stream-heading .tb-stream-move{flex-basis:24px;width:24px;height:30px}
}

/* Existing category sheet, softened backdrop, iOS safe area and smooth entrance. */
@media(max-width:840px),(pointer:coarse){
 .tb-cat-actions-overlay{padding:12px 10px max(12px,env(safe-area-inset-bottom))}
 .tb-cat-actions-backdrop{background:rgba(5,9,17,.37)!important;backdrop-filter:blur(1.5px)!important}
 .tb-cat-actions-menu{
  width:min(430px,100%)!important;max-height:calc(100dvh - 34px);
  overflow-y:auto;overscroll-behavior:contain;
  margin-bottom:0!important;padding:13px 14px 16px!important;
  box-shadow:0 17px 48px rgba(0,0,0,.35)!important;
  animation:tb-v60-slide-up .20s cubic-bezier(.18,.79,.31,1) both;
 }
 .tb-cat-actions-option{min-height:46px}
 .tb-cat-actions-header{min-height:42px}
 .tb-cat-actions-option.tb-cat-actions-danger{margin-top:10px}
}
@keyframes tb-v60-slide-up{from{opacity:.75;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.tb-cat-actions-menu{animation:none!important}}
.tb-cat-actions-option.tb-cat-actions-view{border-top:1px solid var(--line);border-radius:8px;margin-top:7px;padding-top:13px}
.tb-cat-actions-option.tb-cat-actions-selected{background:color-mix(in srgb,var(--blue) 19%,var(--surface));color:var(--text);font-weight:700}
.tb-cat-actions-option .tb-v60-check{margin-left:auto;color:var(--blue);font-size:18px}
.tb-cat-actions-back{border:0;background:transparent;color:var(--muted);padding:7px 10px;font:inherit;font-size:13px;cursor:pointer}

/* Only the category editor uses the same bottom-up mobile interaction. */
@media(max-width:650px){
 body.tb-category-editor-open #overlay.scrim.open{align-items:flex-end!important;padding:10px 10px max(10px,env(safe-area-inset-bottom))!important;background:rgba(5,9,17,.39)!important;backdrop-filter:blur(1.5px)!important}
 body.tb-category-editor-open #overlay.scrim.open .dialog{
  width:100%!important;max-width:430px!important;max-height:88dvh!important;
  margin:0 auto!important;border-radius:20px!important;padding:18px!important;
  box-shadow:0 20px 55px rgba(0,0,0,.35)!important;
  animation:tb-v60-slide-up .20s cubic-bezier(.18,.79,.31,1) both;
 }
}


/* V61: each icon is a compact, genuine tile (same materials as Kacheln). */
#app .board .category[data-tb-view="icons"] .tile{
 background:var(--tile-bg,var(--tile))!important;
 border:1px solid color-mix(in srgb,var(--text) 5%,transparent)!important;
 border-radius:10px!important;
 box-shadow:none!important;
 transition:background .16s ease,border-color .16s ease,box-shadow .16s ease!important;
}
#app .board .category[data-tb-view="icons"] .tile:is(:hover,:focus-within){
 background:var(--tile-bg,var(--tile))!important;
 border-color:color-mix(in srgb,var(--text) 18%,transparent)!important;
 box-shadow:0 5px 12px color-mix(in srgb,#000 18%,transparent)!important;
}
/* Explicitly take precedence over icon/list/grid display rules. */
#app .board .category.is-grid-collapsed .tiles,
#app .board .category.privacy-locked .tiles{display:none!important}

/* All three modes use a single independent logo size; font size remains separate. */
body[data-tb-icon-size="small"]{--tb-v61-logo-size:30px}
body[data-tb-icon-size="medium"],body:not([data-tb-icon-size]){--tb-v61-logo-size:38px}
body[data-tb-icon-size="large"]{--tb-v61-logo-size:42px}
#app .board .category[data-tb-view] .tile img,
#app .board .category[data-tb-view] .tile .fallback{
 width:var(--tb-v61-logo-size)!important;
 height:var(--tb-v61-logo-size)!important;
 flex:0 0 var(--tb-v61-logo-size)!important;
 object-fit:contain!important;
}
#app .board .category[data-tb-view="icons"] .tile > a{
 min-height:max(48px,calc(var(--tb-v61-logo-size) + 10px))!important;
 height:max(48px,calc(var(--tb-v61-logo-size) + 10px))!important;
}
#app .board .category[data-tb-view="icons"] .tile{
 min-height:max(48px,calc(var(--tb-v61-logo-size) + 10px))!important;
}
/* A pinned grid category must not shrink when changing the project mode. */
#app .board .category[data-tb-view="grid"] .tile > a{
 min-height:86px!important;
}
#app .board .category[data-tb-view="list"] .tile > a{
 min-height:44px!important;
}

/* Small standalone settings controls, consistent with existing segmented options. */
.tb-v61-settings,.tb-v61-demo{
 margin:15px 0 0;padding:14px 0 0;
 border-top:1px solid var(--line);display:grid;gap:8px;
}
.tb-v61-heading{font-size:13px;font-weight:700;color:var(--text)}
.tb-v61-settings .tb-settings-note,.tb-v61-demo .tb-settings-note{margin:0}
.tb-v61-size-options{display:flex;gap:5px;border:1px solid var(--line);background:var(--surface);border-radius:12px;padding:4px}
.tb-v61-size-option{flex:1 1 0;min-height:38px;border:0;border-radius:8px;background:transparent;color:var(--muted);font:inherit;font-size:12px;font-weight:650;cursor:pointer}
.tb-v61-size-option.active{background:var(--blue);color:white}
.tb-v61-size-option:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.tb-v61-demo-row{display:flex;align-items:center;gap:8px}
.tb-v61-demo-row .input{flex:1 1 auto;min-width:0}
.tb-v61-demo-row .btn{flex:0 0 auto;min-height:44px}


/* V62: Icon mode always uses the same compact ⋯ action on desktop, tablet and mobile. */
#app .board .category[data-tb-view="icons"] .tile .editlink,
#app .board .category[data-tb-view="icons"] .tile .copylink,
#app .board .category[data-tb-view="icons"] .tile:is(:hover,:focus-within) .editlink,
#app .board .category[data-tb-view="icons"] .tile:is(:hover,:focus-within) .copylink{
 display:none!important;visibility:hidden!important;
}
#app .board .category[data-tb-view="icons"] .tile .tile-more{
 display:grid!important;place-items:center!important;
 position:absolute!important;z-index:8!important;
 top:0!important;right:0!important;left:auto!important;
 width:24px!important;height:24px!important;
 min-width:24px!important;min-height:24px!important;
 max-width:24px!important;
 padding:0!important;margin:0!important;
 background:color-mix(in srgb,var(--tile-bg,var(--tile)) 86%,var(--surface))!important;
 border:1px solid color-mix(in srgb,var(--text) 9%,transparent)!important;
 color:var(--tile-fg,var(--text))!important;
 border-radius:8px!important;font:700 17px/1 system-ui,sans-serif!important;
 letter-spacing:0!important;opacity:.8!important;
 transform:none!important;touch-action:manipulation!important;
}
#app .board .category[data-tb-view="icons"] .tile .tile-more:is(:hover,:focus-visible,[aria-expanded="true"]){
 opacity:1!important;background:var(--surface)!important;
 border-color:color-mix(in srgb,var(--text) 23%,transparent)!important;
 outline-offset:1px;
}
#app .board .category[data-tb-view="icons"] .tile > a{
 padding-top:9px!important;padding-right:6px!important;
}
#app .board .category[data-tb-view="icons"] .tile .tile-more + *{pointer-events:auto}

/* Moving a long category never exposes the entire category as an oversized ghost. */
#app .category.premium-drag-ghost,
body>.category.premium-drag-ghost{
 max-height:112px!important;overflow:hidden!important;
 pointer-events:none!important;box-sizing:border-box;
}
#app .cat-slot.premium-drop-slot{min-height:54px!important;height:54px!important}
body.drag-on{cursor:grabbing}

/* Visible, compact Pro preview entry in the existing profile dropdown. */
#profilemenu .tb-v62-pro-panel{
 margin-top:9px;padding:11px 6px 5px;
 border-top:1px solid var(--line);display:grid;gap:7px;
}
#profilemenu .tb-v62-pro-title{font-size:12px;font-weight:750;color:var(--text)}
#profilemenu .tb-v62-pro-row{display:flex;gap:6px;align-items:center}
#profilemenu .tb-v62-pro-row input{
 flex:1 1 auto;min-width:0;width:100%;height:38px;
 border:1px solid var(--line);border-radius:9px;
 background:var(--surface);color:var(--text);
 padding:8px 9px;font:inherit;font-size:13px;
}
#profilemenu .tb-v62-pro-row button{
 flex:0 0 auto;min-height:38px;border:1px solid var(--line);
 border-radius:9px;padding:7px 10px;
 background:color-mix(in srgb,var(--blue) 20%,var(--surface));
 color:var(--text);font:inherit;font-size:12px;font-weight:700;cursor:pointer;
}
#profilemenu .tb-v62-pro-panel small{font-size:11px;color:var(--muted);line-height:1.35}


/* The original mobile-only actions sheet must also open on desktop in Icons mode. */
#tile-actions-overlay{display:flex!important}
@media(min-width:841px) and (hover:hover) and (pointer:fine){
 #tile-actions-overlay{align-items:center!important;padding:20px!important}
 #tile-actions-overlay .tile-actions-sheet{max-width:390px}
}


/* Prevent browser scroll anchoring from cancelling deliberate auto-scroll
   when drag placeholders are repositioned above the visible area. */
body.drag-on #board,
body.drag-on #board .lane,
body.drag-on #board .category,
body.drag-on #board .cat-slot{
 overflow-anchor:none!important;
}


/* V63: mobile-only final header alignment; no changes to controls or data. */
@media(max-width:650px){
 /* Shrink the logo just a touch; let the existing search use the freed space. */
 #app>.nav .tabbaze-brand-logo img{
  width:clamp(120px,37vw,160px)!important;
 }

 /* Keep the three view options flush right while the project list gets more room. */
 #app>.project-bar{
  position:relative;
  z-index:20;
 }
 #app>.project-bar .tb-mobile-project-bulk .view-switch{
  margin-left:auto!important;
 }
 /* Position the eye on the next (workspace status) row without taking up
    horizontal room in the project/view row. The button stays the same element. */
 #app>.project-bar .tb-mobile-project-bulk .tb-link-display-switches{
  position:absolute!important;
  top:calc(100% + 7px)!important;
  right:0!important;
  margin:0!important;
 }
 #app>.hintbar{
  min-height:40px!important;
  padding-right:49px!important;
  display:flex!important;
  align-items:center!important;
 }

 /* Optical centring for the category +, preserving its touch target and click. */
 #app>.board .tb-stream-heading .tb-stream-category-add{
  display:grid!important;
  place-items:center!important;
  padding:0!important;
  font-size:0!important;
  line-height:1!important;
  align-self:center;
 }
 #app>.board .tb-stream-heading .tb-stream-category-add::before{
  content:"+";
  display:block;
  font:500 21px/1 system-ui,sans-serif;
  transform:translateY(-1px);
 }
}
@media(max-width:380px){
 #app>.nav .tabbaze-brand-logo img{
  width:clamp(110px,36vw,138px)!important;
 }
}

/* V66: keep every stream title distinct in the shared tablet scroll column. */
#app>.board.lanes-view .lane.tb-merged-stream-lane > .tb-stream-heading{
 position:relative!important;top:auto!important;z-index:1!important;
}
#app>.board.lanes-view[data-columns="1"] .lane > .tb-stream-heading{display:flex!important}
@media(max-width:650px){
 #app>.project-bar #new-project::before{transform:translateY(-1px)!important}
}

/* V67: paint a geometrically centred plus, independent of font metrics. */
@media(max-width:650px){
 #app>.project-bar #new-project{font-size:0!important;display:grid!important;place-items:center!important;padding:0!important}
 #app>.project-bar #new-project::before{
  content:""!important;width:20px!important;height:20px!important;display:block!important;
  background:linear-gradient(currentColor,currentColor) center / 19px 2px no-repeat,
   linear-gradient(currentColor,currentColor) center / 2px 19px no-repeat!important;
  transform:none!important;margin:0!important;line-height:normal!important;
 }
}
#app>.board .lane.tb-stream-lane-drop-target{
 background:color-mix(in srgb,var(--blue) 5%,transparent)!important;
 outline:1px dashed color-mix(in srgb,var(--blue) 42%,transparent);
 outline-offset:-2px;
}
#app>.board .tb-visual-column-empty{min-height:86px;display:grid;gap:8px;place-content:center;
 padding:10px;border:1px dashed var(--line);border-radius:10px;color:var(--muted);
 text-align:center;font-size:12px}
#app>.board :is(.tb-visual-column-close,.tb-visual-column-restore){
 min-height:36px;cursor:pointer;border:1px solid var(--line);border-radius:8px;
 color:var(--text);background:var(--surface);padding:7px 10px;font-size:12px}
#app>.board .tb-visual-column-restore{width:100%;margin-top:9px}

/* V68 exact insertion preview, no board reflow while pointer moves. */
.tb-stream-v68-ghost{
 position:fixed;z-index:2500;pointer-events:none;max-width:210px;
 padding:8px 14px;border:1px solid var(--blue);border-radius:10px;
 background:var(--surface);color:var(--text);
 box-shadow:0 12px 28px rgba(0,0,0,.22);
 opacity:.94;font-weight:750;font-size:13px;white-space:nowrap;
}
.tb-stream-v68-line{
 position:fixed;z-index:2499;pointer-events:none;height:4px;display:none;
 border-radius:7px;background:var(--blue);
 box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 16%,transparent);
}
.tb-stream-v68-line::before,.tb-stream-v68-line::after{
 content:"";position:absolute;top:-4px;width:12px;height:12px;
 border-radius:50%;background:var(--blue);
}
.tb-stream-v68-line::before{left:-5px}.tb-stream-v68-line::after{right:-5px}
.tb-stream-heading.tb-stream-moving .tb-stream-move{opacity:.45}
#app>.board .lane.tb-merged-stream-lane>.tb-stream-heading{
 position:relative!important;top:auto!important;z-index:1!important;
}

/* V70 reduced: no fifth column, no nested streams, no extra controls.
   Keep all original stream headings, category tiles, header and typography. */
@media(min-width:651px){
 #app>.board.tb-v70-board{
  display:grid!important;
  grid-template-columns:repeat(var(--tb-v70-columns,4),minmax(0,1fr))!important;
  grid-template-rows:minmax(0,1fr)!important;
  gap:0!important;align-items:stretch!important;
  overflow-x:hidden!important;overflow-y:hidden!important;
  min-width:0!important;
 }
 #app>.board.tb-v70-board>.lane.tb-v70-lane{
  min-width:0!important;width:auto!important;max-width:none!important;
  min-height:0!important;height:100%!important;max-height:none!important;
  display:flex!important;flex-direction:column!important;
  overflow-x:hidden!important;overflow-y:auto!important;
  box-sizing:border-box!important;
 }
 #app>.board.tb-v70-board>.lane.tb-v70-lane:first-child{padding-left:0}
 #app>.board.tb-v70-board>.lane.tb-v70-lane:last-child{padding-right:0}
}
/* Tablet displays the same columns in two-column rows, never side-by-side
   beyond two and never as two stream headings inside one physical lane. */
@media(min-width:651px) and (max-width:1024px){
 #app>.board.tb-v70-board{
  grid-template-columns:repeat(min(2,var(--tb-v70-columns,4)),minmax(0,1fr))!important;
  grid-template-rows:none!important;
  grid-auto-rows:minmax(260px,calc((100dvh - 205px) / 1.65))!important;
  align-content:start!important;overflow-y:auto!important;
  gap:0!important;scrollbar-width:thin;
 }
 #app>.board.tb-v70-board>.lane.tb-v70-lane{height:100%!important}
 #app>.board.tb-v70-board>.lane.tb-v70-lane:nth-child(odd){border-left:0!important;padding-left:0}
 #app>.board.tb-v70-board>.lane.tb-v70-lane:nth-child(even){border-left:1px solid color-mix(in srgb,var(--line) 65%,transparent)}
 #app>.board.tb-v70-board>.lane.tb-v70-lane:nth-child(n+3){border-top:1px solid color-mix(in srgb,var(--line) 65%,transparent)}
}
/* Phone: one column, original stream header followed by its categories.
   The board scrolls vertically; no horizontal navigation or extra buttons. */
@media(max-width:650px){
 #app>.board:not(.tb-v70-board){
  display:flex!important;flex-direction:column!important;
  overflow-x:hidden!important;overflow-y:auto!important;
  gap:12px!important;align-items:stretch!important;
 }
 #app>.board:not(.tb-v70-board)>.tb-stream-heading{flex:0 0 auto;width:100%!important}
 #app>.board:not(.tb-v70-board)>.category{flex:0 0 auto;width:100%!important}
}
/* Reuse the V69 drag handle. Desktop shows a vertical boundary for
   left/right movement; mobile keeps the original horizontal indication. */
@media(min-width:651px){
 body:has(#board.tb-v70-board)>.tb-stream-v68-line{
  height:var(--tb-v70-reorder-height,180px)!important;
  min-height:40px!important;
  border-radius:7px!important;
 }
 body:has(#board.tb-v70-board)>.tb-stream-v68-line::before,
 body:has(#board.tb-v70-board)>.tb-stream-v68-line::after{display:none!important}
}

/* V71: Stream controls only. Keep V70 tracks, lane widths and header geometry. */
#app>.board .tb-stream-heading{cursor:grab;touch-action:none}
#app>.board .tb-stream-heading.tb-stream-moving{cursor:grabbing}
#app>.board .tb-stream-heading .tb-stream-title{min-width:0;flex:0 1 auto;touch-action:none}
#app>.board .tb-stream-heading :is(.tb-stream-category-add,.tb-v71-stream-add,.tb-v71-stream-menu-trigger){
 touch-action:manipulation;
}
#app>.board .tb-stream-heading :is(.tb-v71-stream-add,.tb-v71-stream-menu-trigger){
 display:grid;place-items:center;flex:0 0 27px;
 width:27px;height:29px;min-width:27px;min-height:29px;
 padding:0;border:1px solid transparent;border-radius:8px;
 background:transparent;color:var(--muted);opacity:.72;
 font:500 20px/1 system-ui,sans-serif;cursor:pointer;
}
#app>.board .tb-stream-heading .tb-v71-stream-menu-trigger{
 margin-left:auto;font-size:23px;line-height:1;
}
#app>.board .tb-stream-heading .tb-v71-stream-add{
 margin-left:auto;font-size:21px;
}
#app>.board .tb-stream-heading .tb-v71-stream-menu-trigger + .tb-v71-stream-add{
 margin-left:1px;
}
#app>.board .tb-stream-heading :is(.tb-v71-stream-add,.tb-v71-stream-menu-trigger):is(:hover,:focus-visible){
 background:color-mix(in srgb,var(--blue) 9%,var(--surface));
 border-color:var(--line);color:var(--text);opacity:1;
}
.tb-v71-stream-popover{position:fixed;inset:0;z-index:850}
.tb-v71-stream-backdrop{position:absolute;inset:0;background:transparent}
.tb-v71-stream-menu{
 position:fixed;z-index:1;width:236px;max-width:calc(100vw - 20px);
 background:var(--surface);color:var(--text);
 border:1px solid var(--line);border-radius:12px;
 padding:6px;box-shadow:0 12px 35px #0005;display:grid;gap:2px;
}
.tb-v71-stream-menu-item{
 display:block;width:100%;min-height:42px;padding:9px 12px;
 border:0;border-radius:8px;background:transparent;color:inherit;
 font:inherit;font-size:13px;text-align:left;cursor:pointer;
}
.tb-v71-stream-menu-item:is(:hover,:focus-visible){background:color-mix(in srgb,var(--text) 8%,transparent)}
.tb-v71-stream-menu-item:disabled{opacity:.38;cursor:not-allowed}
.tb-v71-stream-menu-item.danger{border-top:1px solid var(--line);margin-top:3px;color:#d76868}

/* V72: local backup comparison modal. Scoped; never changes stream layout. */
.tb-backup-review-overlay{z-index:950}
.tb-backup-review{width:min(100%,540px);max-height:calc(100dvh - 28px);overflow:auto}
.tb-backup-review .confirm-body{max-width:none;margin-bottom:15px}
.tb-backup-review-grid{
 border:1px solid var(--line);border-radius:12px;overflow:hidden;
 margin:0 0 13px;font-size:13px;color:var(--text);
}
.tb-backup-review-row{
 display:grid;grid-template-columns:minmax(0,1.5fr) repeat(2,minmax(0,.75fr));
 align-items:center;min-height:37px;gap:7px;padding:7px 11px;
 border-bottom:1px solid color-mix(in srgb,var(--line) 70%,transparent);
}
.tb-backup-review-row:last-child{border-bottom:0}
.tb-backup-review-row:not(.tb-backup-review-head) span:not(:first-child){
 text-align:right;font-variant-numeric:tabular-nums;font-weight:680;
}
.tb-backup-review-head{font-size:11px;font-weight:700;color:var(--muted);
 background:color-mix(in srgb,var(--tile) 65%,var(--surface) 35%)}
.tb-backup-review-head span:not(:first-child){text-align:right}
.tb-backup-review-warning{
 font-size:12.5px;line-height:1.55;color:var(--text);
 border:1px solid color-mix(in srgb,var(--line) 82%,transparent);
 background:color-mix(in srgb,var(--tile) 44%,transparent);
 border-radius:10px;padding:10px 12px;margin:0 0 17px;
}
.tb-backup-review-actions{justify-content:flex-start}
.tb-backup-review-actions .btn:first-child{margin-right:auto}
.tb-backup-review-actions .btn{min-width:0;padding:10px 13px}
@media(max-width:560px){
 .tb-backup-review{padding:18px;border-radius:17px}
 .tb-backup-review-actions{display:grid;grid-template-columns:1fr 1fr}
 .tb-backup-review-actions .btn:first-child{grid-column:1 / -1;margin:0}
 .tb-backup-review-actions .btn{width:100%;padding:10px 8px}
}


/* V75: local workspace's profile-menu account controls. */
#profilemenu .tb-v75-auth-panel{
 display:grid;gap:8px;margin-top:10px;padding:12px 6px 5px;
 border-top:1px solid var(--line);
}
#profilemenu .tb-v75-auth-caption{
 margin:0;color:var(--muted);font-size:12px;line-height:1.4;
 overflow-wrap:anywhere;
}
#profilemenu .tb-v75-auth-button{
 width:100%;min-height:41px;padding:9px 12px;border:1px solid var(--line);
 border-radius:9px;background:color-mix(in srgb,var(--blue) 18%,var(--surface));
 color:var(--text);font:inherit;font-size:13px;font-weight:700;text-align:left;
 cursor:pointer;
}
#profilemenu .tb-v75-auth-button:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
#profilemenu .tb-v75-auth-button:disabled{opacity:.6;cursor:wait}

/* V76: Free uses a neutral, unisex user silhouette; authenticated Google account uses its profile photo. */
#profile.tb-v76-profile{
 position:relative;
 display:grid;place-items:center;overflow:visible;
 background:color-mix(in srgb,var(--surface) 85%,var(--tile) 15%)!important;
 border:1px solid var(--line)!important;
 color:transparent!important;font-size:0!important;
 isolation:isolate;
 transition:border-color .16s,background .16s;
}
#profile.tb-v76-profile:is(:hover,:focus-visible){
 border-color:var(--blue)!important;
 background:color-mix(in srgb,var(--blue) 10%,var(--surface))!important;
}
#profile.tb-v76-profile img{
 display:block;width:100%;height:100%;
 border-radius:50%;object-fit:cover;
}
#profile.tb-v76-profile[data-login-status="in"]::after{
 content:"";position:absolute;bottom:-2px;right:-2px;
 width:9px;height:9px;border-radius:50%;
 background:#1eaf67;border:2px solid var(--surface);
 box-sizing:content-box;z-index:1;pointer-events:none;
}
#profilemenu #logout[hidden],
#profilemenu .tb-v75-auth-button[hidden]{display:none!important}
#profilemenu :is(strong,.help,.tb-v75-auth-caption){overflow-wrap:anywhere}

#profile.tb-v76-profile .tb-v76-user-icon{
 width:25px;height:25px;display:block;
 stroke:var(--muted);stroke-width:1.75;
 fill:none;stroke-linecap:round;stroke-linejoin:round;
 pointer-events:none;
}
#profile.tb-v76-profile .tb-v76-user-icon circle{fill:color-mix(in srgb,var(--muted) 26%,transparent);stroke:var(--muted)}
#profile.tb-v76-profile[data-login-status="out"]{color:var(--muted)!important}
#profilemenu #edit-profile[hidden]{display:none!important}