/* Right rail. Same dark side as Study Hall. Desk Top, then the other rooms. */
#right-rail:has(.desk-rail){background:#071820;color:#d7e4e8}
.desk-rail{position:relative;z-index:1;min-height:100%;padding:28px 16px 24px}
.desk-rail h2{margin:0 0 10px;padding:0 8px 14px;border-bottom:1px solid #24505c;font:400 27px/1 Georgia,"Times New Roman",serif;color:#fff}
.desk-rule{height:0;margin:14px 8px;border-top:1px solid #24505c}
.desk-rail h3{margin:26px 0 8px;font:12px/1.2 Georgia,"Times New Roman",serif;letter-spacing:.08em;text-transform:uppercase;color:#9eb4bc}
.desk-rail .desk-project{margin:0 0 14px;font:12px/1.35 Georgia,"Times New Roman",serif;letter-spacing:.04em;text-transform:uppercase;color:#c5d4d8}
/* The Desk Top side bar uses the Study Hall side's typeface; the feature names (AI Record, LaTeX) are in Georgia. */
.desk-rail .desk-link{display:flex;align-items:center;gap:8px;width:100%;margin:0;padding:8px 8px;border:0;background:transparent;color:#d7e4e8;text-align:left;font:14px/1.3 Arial,Helvetica,sans-serif;cursor:pointer}
.desk-rail .desk-link.is-on{color:#fff}
.desk-rail .desk-folder{margin:28px 8px 0;padding-top:16px;border-top:1px solid #24505c;color:#9eb4bc;font:12px/1.5 Arial,Helvetica,sans-serif}
/* Feature names and their squares, on both side bars */
.feature-name{font:15px/1.3 Georgia,"Times New Roman",serif;letter-spacing:0}
.feature-light{display:inline-block;flex:none;width:12px;height:12px;margin-left:8px;border:1px solid #6f8894;background:transparent}
html[data-record-on] .feature-light[data-feature-light="record"],html[data-latex-on] .feature-light[data-feature-light="latex"]{border-color:#c4161c;background:#c4161c}
.desk-title-btn{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;margin:0 0 14px;padding:0 8px;border:0;background:transparent;color:#fff;text-align:left;font:400 26px/1 Georgia,"Times New Roman",serif;white-space:nowrap;cursor:pointer}
.desk-title-btn .chevron{color:#9eb4bc;font:28px/1 Georgia,"Times New Roman",serif}
.desk-cascade{flex-direction:row-reverse;width:max-content}
.desk-cascade .fly-column{width:112px;max-width:112px;min-width:0;flex:0 0 112px;padding:6px 4px;border-right:0;border-left:1px solid #35505d;overflow:hidden}
.desk-cascade .fly-column h3{margin:4px 6px 6px;font-size:10px;white-space:normal;overflow-wrap:anywhere}
.desk-cascade .fly-row{padding:6px;font-size:12px;gap:4px;white-space:normal}
.desk-cascade .fly-row span{min-width:0;white-space:normal;overflow-wrap:anywhere}
.desk-cascade .fly-add{margin:6px 4px 0}
.desk-cascade .fly-add input{width:100%;padding:6px;border:1px solid #c4a36a;background:#0c2633;color:#e4edef;font:12px Arial,Helvetica,sans-serif}
.desk-branch > .desk-link{width:auto;flex:1}
.desk-chevron{width:28px;border:0;background:transparent;color:#9eb4bc;font:18px/1 Georgia,"Times New Roman",serif;cursor:pointer}
.desk-chevron[aria-expanded="true"]{transform:rotate(90deg)}
.desk-children{flex:1 0 100%;padding:0 0 8px 18px}
.desk-children .desk-link{padding:4px 8px;font-size:14px;color:#c5d4d8}
.desk-empty{margin:0;padding:4px 8px;color:#7f97a0;font:13px/1.3 Georgia,"Times New Roman",serif}

.desk-say{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);z-index:600;padding:12px 18px;background:#143342;color:#eff5f6;border:1px solid #547784;border-radius:4px;font:14px/1.4 Arial,sans-serif;max-width:min(620px,calc(100vw - 32px))}
/* THE HOURGLASS (Mark, 3 November 2026): his painting, small, in the bottom half of the Desk Top side bar, with the
   minutes to its right and a line above. The painting's dark is the side bar's blue and its edges fade, so it sits on it. */
/* It is laid ON the side bar's empty bottom (position:absolute) and changes nothing else on the page (Mark, 3 Nov 2026,
   6:01 pm: "put the rest of the page back like this... exactly"). If it would touch the rows above, it gets smaller,
   and on a screen too short for it, it is not shown (hourglass.js fit()). */
.desk-rail .hourglass{position:absolute;left:16px;right:16px;bottom:22px}
.desk-rail .hourglass .desk-rule{margin:0 0 14px}
.desk-rail .hourglass.is-tucked .hg-say{display:none}
.desk-rail .hourglass.is-tucked .hg-glass{width:58px}
.desk-rail .hourglass.is-hidden{visibility:hidden}
.hourglass .hg-title{margin:0 4px 12px;font:600 16px/1.2 Georgia,"Times New Roman",serif;letter-spacing:.12em;text-transform:uppercase;color:#b9c9cf}
.hourglass .hg-say{margin:0 4px 10px;color:#7f979f;font:11px/1.45 Arial,Helvetica,sans-serif}
.hourglass .hg-row{display:flex;align-items:center;gap:8px}
.hourglass .hg-flip{flex:none;display:block;padding:0;border:0;background:transparent;cursor:pointer;line-height:0}
.hourglass .hg-flip:focus-visible{outline:2px solid #d8b47b;outline-offset:3px;border-radius:6px}
.hourglass .hg-glass{position:relative;display:block;width:76px;aspect-ratio:290/645;opacity:.86;transition:opacity .4s,filter .4s}
.hourglass.is-running .hg-glass,.hourglass .hg-flip:hover .hg-glass{opacity:1;filter:drop-shadow(0 0 8px rgba(216,180,123,.25))}
.hourglass .hg-layer{position:absolute;inset:0;background:url('/assets/hourglass-full.webp?build=93f77f53a969') center/100% 100% no-repeat}
.hourglass .hg-empty{background-image:url('/assets/hourglass-empty.webp?build=c5c6ea96e658')}
.hourglass .hg-sand{clip-path:inset(100% 0 0 0)}
.hourglass.is-running .hg-stream{animation:hg-trickle 1.2s steps(3) infinite}
@keyframes hg-trickle{0%{opacity:1}50%{opacity:.75}100%{opacity:1}}
@keyframes hg-flip{from{transform:rotate(0)}to{transform:rotate(180deg)}}
.hourglass .hg-glass.is-flipping{animation:hg-flip .9s cubic-bezier(.5,0,.3,1)}
.hourglass .hg-set{flex:1;min-width:0}
.hourglass .hg-time{margin:0 0 8px;font:400 24px/1 Georgia,"Times New Roman",serif;color:#f4efe4;letter-spacing:.02em}
.hourglass.is-done .hg-time{color:#d8b47b}
.hourglass .hg-mins{display:grid;grid-template-columns:1fr 1fr;gap:4px}
.hourglass .hg-mins button{padding:4px 2px;border:1px solid #24505c;border-radius:3px;background:transparent;color:#9eb4bc;font:11px/1.2 Georgia,"Times New Roman",serif;cursor:pointer;white-space:nowrap}
.hourglass .hg-mins button:hover{color:#f4efe4}
.hourglass .hg-mins button[aria-pressed="true"]{border-color:#d8b47b;color:#f4efe4}
@media (prefers-reduced-motion:reduce){.hourglass .hg-glass.is-flipping,.hourglass.is-running .hg-stream{animation:none}}
.hourglass .hg-canvas{display:block;width:100%;height:100%}
/* A short window: the hourglass sits under the last link instead of hiding; the side bar scrolls to it, with no scroll bar showing. */
.desk-rail .hourglass.is-flow{position:static;margin:22px 0 22px}
#right-rail{overflow-y:auto;scrollbar-width:none}
#right-rail::-webkit-scrollbar{display:none;width:0}