/* My Space uses the existing site tokens and the existing four components. */
#myspace{display:flex;flex-direction:column;gap:14px;min-width:0}
.space-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.space-heading h1{font-size:22px;line-height:1.2;letter-spacing:-.025em;margin:0;font-weight:var(--fw-sb)}
.space-heading p{margin:5px 0 0;color:var(--fg-3);font-size:var(--fs-13)}
.space-settings{position:relative;flex:none;z-index:8}
.space-settings summary{display:flex;align-items:center;gap:8px;list-style:none;cursor:pointer}
.space-settings summary::-webkit-details-marker{display:none}
.space-settings summary::before{content:'☷';font-size:18px}
.space-settings summary::after{content:none!important}
.space-settings.space-in-top{margin-left:auto}
body[data-tab=space] .top-r1>.status{margin-left:8px}
.space-settings-body{position:absolute;right:0;top:calc(100% + 8px);width:min(290px,calc(100vw - 32px));padding:16px;display:flex;flex-direction:column;gap:12px;background:var(--raised);border:1px solid var(--line-strong);border-radius:var(--r-lg);box-shadow:var(--sh-2)}
.space-settings-body p{margin:0;color:var(--fg-3);font-size:var(--fs-12)}
.space-settings-body label{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:var(--fs-13)}
.space-settings-body input[type=checkbox]{width:16px;height:16px;accent-color:var(--accent);margin:0}
.space-settings-body input[type=range]{width:100%;accent-color:var(--accent);margin:0}
.space-settings-body .space-width-label{justify-content:space-between;border-top:1px solid var(--line);padding-top:12px}
.space-settings-body small{font-size:var(--fs-11);color:var(--fg-3);line-height:1.5}
.space-clock{margin:0;padding:9px 12px;border:1px solid var(--line);background:var(--surface-2);border-radius:var(--r-md);color:var(--fg-2);font-size:var(--fs-12);line-height:1.6}
.space-clock[data-state=stale],.space-clock[data-state=delayed]{background:var(--warn-soft);border-color:transparent;color:var(--warn-text)}
.space-clock[data-state=error]{color:var(--dn-text)}
.space-grid{display:flex;flex-direction:column;min-width:0}
.space-column{display:flex;flex-direction:column;gap:18px;min-width:0}
#space-left{margin-bottom:18px}
.space-panel{display:flex;flex-direction:column;gap:0;min-width:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-1);overflow:hidden;--plot-bg:var(--surface)}
.space-panel-head{display:flex;align-items:center;justify-content:space-between;gap:8px;flex:none;min-height:46px;padding:9px 12px;border-bottom:1px solid var(--line)}
.space-panel-head h2{font-size:var(--fs-14)}
.space-panel-head .seg button{padding:0 9px;font-size:var(--fs-12)}
.space-asof{font-size:var(--fs-11);color:var(--fg-3);white-space:nowrap}
.space-slot{flex:1;min-height:0;min-width:0;overflow:auto;overscroll-behavior:auto;padding:12px}
#space-slot-candles{display:flex;flex-direction:column;padding:0;overflow:hidden}
#myspace #ch-index{height:100%;flex:1;min-height:0;margin:0;border:0;border-radius:0;box-shadow:none}
#myspace #ch-plot{flex:1;height:auto;min-height:100px}
#myspace #flowread{padding:0;border:0;border-radius:0;box-shadow:none}
#myspace #flowread .flow-tag{display:none}
#myspace #flowread .flow-now,#myspace #flowread .flow-arch{font-size:var(--fs-13);line-height:1.45}
#myspace #flow,#myspace #ladder{padding:0;background:transparent;border:0;border-radius:0;box-shadow:none;gap:10px}
#myspace #flow>h2,#myspace #ladder>.sec-h>h2{display:none}
#myspace #flow .note{font-size:var(--fs-12)}
#myspace .note{max-width:none}
#myspace #ladder .sec-h{justify-content:flex-start}
#myspace #ladder .tools{gap:6px}
#myspace #ladder .seg button{font-size:var(--fs-12);padding:0 8px}
#myspace #ladder-note{font-size:var(--fs-12)}
#myspace #detail{padding:9px 10px}
.space-ladder-info{border-top:1px solid var(--line);padding-top:10px;font-size:var(--fs-12)}
.space-ladder-info summary{cursor:pointer;color:var(--fg-2)}
.space-ladder-info>div{display:flex;flex-direction:column;gap:10px;padding-top:10px}
.space-resize{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;flex:none;height:22px;background:var(--surface-2);border-top:1px solid var(--line);cursor:ns-resize;touch-action:none;color:var(--fg-3);user-select:none}
.space-resize>span{width:32px;height:3px;border-top:1px solid currentColor;border-bottom:1px solid currentColor}
.space-resize output{position:absolute;right:9px;font-size:10px}
.space-resize:hover,.space-resize:focus-visible{color:var(--accent-text);background:var(--accent-soft)}
#space-divider{display:none;touch-action:none;cursor:col-resize;user-select:none}
body.space-dragging,body.space-dragging *{user-select:none!important}
@media(min-width:1024px){
  .space-grid{display:grid;grid-template-columns:minmax(0,60fr) 20px minmax(0,40fr);align-items:start}
  #space-left{margin-bottom:0}
  #space-divider{display:flex;align-self:stretch;align-items:flex-start;justify-content:center;position:relative;min-height:120px;padding-top:180px}
  #space-divider::before{content:'';position:absolute;width:1px;left:50%;top:0;bottom:0;background:var(--line)}
  #space-divider>span{position:sticky;top:calc(var(--header-h) + 30px);height:40px;width:7px;border:1px solid var(--line-strong);background:var(--surface-3);border-radius:5px;z-index:1}
  #space-divider:hover>span,#space-divider:focus-visible>span{background:var(--accent);border-color:var(--accent)}
  .space-grid[data-single=left],.space-grid[data-single=right]{display:block!important}
  .space-grid[data-single] #space-divider{display:none}
}
@media(max-width:1023px){.space-grid{grid-template-columns:none!important}.space-width-label,#space-width{display:none!important}}
@media(max-width:767px){
  .top-r1{flex-wrap:wrap;height:auto;min-height:var(--ctl-h)}
  body:not([data-tab=space]) .top-r1>.status{flex-basis:100%;margin-left:0;justify-content:center}
  body[data-tab=space] .space-settings.space-in-top{margin-left:0}
  body[data-tab=space] .top-r1>.status{margin-left:auto;flex-basis:auto}
  .top-r1 .tabs{margin-right:auto}
  body[data-tab=space] .spot{font-size:var(--fs-24)}
  body[data-tab=space] #spot-sub{display:none}
  .space-heading h1{font-size:20px}
  .space-heading p{max-width:24ch;font-size:var(--fs-12)}
  .space-panel-head{padding:8px 10px;min-height:42px}
  .space-panel-head .seg button{padding:0 7px}
  .space-clock{font-size:var(--fs-11)}
  .space-resize{height:28px}
}