/* ==========================================================================
   Somipaper — Desk Without Menus (Proposal B)
   Running head (hashira) · Desk · Folio line · Details cards · Layout sheet
   ========================================================================== */

.room { position: fixed; inset: 0; z-index: 0; pointer-events: none; }

/* No system overlays: no tap flash, no blue selection on controls, no focus rings on press */
button, .w, .pick, .sec-w, .place-w, .crumb, .shelf-book, .shelf-book-open,
.drawer-tab, .hashira, .folioline, .objbar, img, svg {
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -webkit-user-drag: none;
}
input, textarea, [contenteditable] {
  -webkit-user-select: text;
  user-select: text;
}
::selection { background: rgba(40, 52, 63, 0.14); color: inherit; }
:focus, :focus-visible { outline: none; }
html[data-input="keyboard"] :focus-visible {
  outline: none;
  text-decoration: underline;
  text-underline-offset: 6px;
}

/* Outer frame shell: row 1 = hashira, row 2 = desk stage, row 3 = folioline */
.shell {
  position: fixed;
  inset: 0;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: 100%;
  height: 100%;
  height: 100dvh;
  overflow: hidden;
  font-family: var(--ui-sans);
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}

.desk-stage {
  position: relative;
  grid-row: 1 / -1;
  grid-column: 1;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.desk-stage > #library,
.desk-stage > #canvas-viewport {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

body.in-library #canvas-viewport {
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
}

/* Running head (Hashira) — fixed left origin */
.hashira-wrap,
.folioline {
  position: relative;
  grid-column: 1;
  z-index: 40;
  background: rgb(232 237 240 / 0.72);
}
.hashira-wrap { grid-row: 1; }
.hashira {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: calc(28px * var(--u));
  padding: env(safe-area-inset-top, 0px) calc(32px * var(--u)) 0;
  min-height: calc(56px * var(--u));
}
.hashira .left {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  white-space: nowrap;
}
.hashira .seal {
  font: 700 calc(10.5px * var(--u))/1 var(--ui-sans);
  background: var(--ink);
  color: var(--paper);
  padding: 3px 6px;
  border-radius: 3px;
}
.hashira .brand {
  font-family: var(--ui-sans);   /* the wordmark is sans (Lasker, 14-11) */
  letter-spacing: 0.22em;
  color: var(--ink);
  font-size: calc(12px * var(--u));
  text-transform: uppercase;
}
.hashira .where {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 10px;
  min-width: 0;
  overflow: hidden;
  font: 400 calc(15px * var(--u))/1 var(--ui-serif);
  white-space: nowrap;
}
.hashira .where .crumb { color: var(--ink-2); font: inherit; background: none; border: 0; padding: 0; cursor: pointer; min-height: calc(44px * var(--u)); display: inline-flex; align-items: center; }
.w {
  background: none;
  border: 0;
  padding: 0 2px;
  min-height: calc(44px * var(--u));
  display: inline-flex;
  align-items: center;
  font: 400 calc(13.5px * var(--u))/1 var(--ui-sans);
  white-space: nowrap;
  color: var(--ink);
  cursor: pointer;
}
.hashira .where .crumb:hover,
.hashira .sec-w:hover,
.hashira .place-w:hover,
.w.soft:hover,
.pick .w[aria-pressed="true"],
.preset[aria-pressed="true"] .pn { color: var(--ink); }
.hashira .where .sep { color: var(--ink-3); font-family: var(--ui-sans); }
.hashira .where .here { color: var(--ink); overflow: hidden; text-overflow: ellipsis; }
.hashira .where .secs {
  display: inline-flex;
  gap: calc(14px * var(--u));
  margin-left: calc(10px * var(--u));
  padding-left: calc(14px * var(--u));
  border-left: 1px solid var(--rule);
}
.hashira .sec-w,
.hashira .place-w {
  background: none;
  border: 0;
  border-bottom: 1.5px solid transparent;
  padding: 0;
  cursor: pointer;
  color: var(--ink-2);
  min-height: calc(44px * var(--u));
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}
.hashira .sec-w { font: 400 calc(13px * var(--u))/1 var(--ui-sans); }
.hashira .place-w { font: 400 calc(15px * var(--u))/1 var(--ui-serif); }
.hashira .sec-w[aria-current="page"],
.hashira .place-w[aria-current="page"] {
  color: var(--ink);
  border-bottom-color: var(--ink);
}
.hashira .place-w.hot,
.w.red,
.save-dot.error { color: var(--seal); }
.hashira .place-w.hot { border-bottom-color: var(--seal); }
.hashira .places {
  display: inline-flex;
  align-items: center;
  gap: calc(18px * var(--u));
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
  scrollbar-width: none;
  scroll-snap-type: x proximity;
}
.hashira .places::-webkit-scrollbar,
.objbar::-webkit-scrollbar { display: none; }
.hashira .places > * { flex: none; scroll-snap-align: start; }
.hashira .where .sub { font: 400 calc(12px * var(--u))/1 var(--ui-sans); flex: none; }
.hashira .right {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: calc(20px * var(--u));
}
.hashira .right .date { font-size: calc(11.5px * var(--u)); white-space: nowrap; }
.w.soft,
.pick .w,
.row .k,
.note,
.sec,
.hashira .where .sub,
.hashira .right .date,
.search-dialog .kick,
.search-status,
.search-result span:last-child,
.preset .pn { color: var(--ink-2); }
.hashira-rule {
  margin: 0 calc(32px * var(--u));
  height: 1px;
  background: var(--rule);
  opacity: 0.7;
}

/* Folio line (Bottom edge) */
.folioline {
  grid-row: 3;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  padding: 0 calc(32px * var(--u)) calc(6px * var(--u) + env(safe-area-inset-bottom, 0px));
  min-height: calc(64px * var(--u));
}
.folioline::before {
  content: "";
  position: absolute;
  left: calc(32px * var(--u));
  right: calc(32px * var(--u));
  top: 0;
  height: 1px;
  background: var(--rule);
  opacity: 0.7;
}
.folioline .l,
.folioline .r {
  display: flex;
  align-items: center;
  gap: calc(16px * var(--u));
  min-width: 0;
  white-space: nowrap;
}
.folioline .r { justify-content: flex-end; }
.folioline .c { display: flex; align-items: center; gap: 6px; }
.folioline .pick { flex-wrap: nowrap; }

.folio {
  min-width: calc(76px * var(--u));
  text-align: center;
  font: 400 calc(14px * var(--u))/1 var(--ui-serif);
}
.folio.wide {
  min-width: calc(160px * var(--u));
  display: inline-flex;
  justify-content: center;
  align-items: baseline;
  gap: 10px;
}
.folio .fn,
.save-dot {
  font: 400 calc(11.5px * var(--u))/1 var(--ui-sans);
  color: var(--ink-2);
}

/* Dynamic Throw away drop zone (hidden unless dragging a notebook or object) */
.throw-zone {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 8px;
  bottom: calc(10px + env(safe-area-inset-bottom, 0px));
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 18px;
  white-space: nowrap;
  border-radius: 4px;
  background: rgb(236 240 243 / 0.80);
  border: 1px dashed var(--seal);
  color: var(--seal);
  font-size: calc(13px * var(--u));
  opacity: 0;
  pointer-events: none;
  z-index: 5;
  transition: opacity 0.16s ease, background 0.16s ease, color 0.16s ease;
}
.throw-zone svg { width: 15px; height: 15px; flex: none; }
body.is-carrying .throw-zone.is-visible,
body.is-dragging-book .throw-zone.is-visible {
  opacity: 1;
  pointer-events: auto;
}
body.is-carrying .folioline :is(.l, .c, .r),
body.is-dragging-book .folioline:has(.throw-zone.is-visible) :is(.l, .c, .r),
body.looking .folioline { visibility: hidden; }
.throw-zone.is-over,
.throw-zone.hot {
  background: var(--seal);
  color: var(--card);
  border-style: solid;
}

/* Object selection bar replaces .folioline content when an object is lifted/selected */
.folioline.is-object-bar { grid-template-columns: minmax(0, 1fr); }
.folioline.is-object-bar #folioline-center,
.folioline.is-object-bar #folioline-right { display: none; }
.objbar {
  position: relative;
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: calc(18px * var(--u));
  white-space: nowrap;
  overflow-x: auto;
  scrollbar-width: none;
}
.objbar .name { font: 400 calc(15px * var(--u))/1 var(--ui-serif); flex: none; min-width: calc(86px * var(--u)); }
.wk-head .grow, .card .foot .grow, .objbar .grow { flex: 1; }

/* Word controls, choices, steppers */
.w.big { font-size: calc(15.5px * var(--u)); }
.w[aria-disabled="true"],
.w:disabled {
  color: var(--ink-3);
  pointer-events: none;
  cursor: default;
}
.w[aria-pressed="true"] {
  text-decoration: underline;
  text-underline-offset: 7px;
  text-decoration-thickness: 1.5px;
}
.w.arrow {
  min-width: calc(36px * var(--u));
  justify-content: center;
  font-size: calc(18px * var(--u));
  color: var(--ink-2);
}
.vr { width: 1px; height: calc(16px * var(--u)); background: var(--rule); flex: none; }
.pick { display: inline-flex; flex-wrap: wrap; gap: 0 calc(16px * var(--u)); }
.fixedw { display: inline-grid; }
.fixedw > * { grid-area: 1 / 1; }
.fixedw > .ghost { visibility: hidden; pointer-events: none; }

/* Modals, cards & veil */
#ui-overlay-root { position: fixed; inset: 0; z-index: 260; pointer-events: none; }

.veil {
  position: fixed;
  inset: 0;
  z-index: 260;
  background: rgba(40, 52, 63, 0.16);
  pointer-events: auto;
}
/* Only the running head and the folio line are see-through. Everything that opens in the
   middle of the screen is solid paper: nothing behind it reads through (Lasker, 14-11). */
:is(.card, .sheet-full, .install-dialog, .search-dialog) {
  background: #ECF0F3;
}
.card {
  position: fixed;
  z-index: 265;
  border-radius: 6px;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.04), 0 30px 60px -24px rgba(40, 52, 63, 0.45);
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  pointer-events: auto;
}
.card .in {
  margin: 14px;
  border: 1px solid var(--rule);
  border-radius: 3px;
  padding: calc(20px * var(--u)) calc(24px * var(--u)) calc(14px * var(--u));
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  min-height: 0;
}
.card .kick {
  display: block;
  font-size: calc(10.5px * var(--u));
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--ink-2);
}
.card .ttl { font: 400 calc(26px * var(--u))/1.2 var(--ui-serif); margin-top: 8px; }
.card .ttl input {
  border: 0;
  border-bottom: 1px solid transparent;
  background: none;
  padding: 0 0 2px;
  width: 100%;
  font: inherit;
  color: var(--ink);
}
.card .ttl input:focus { border-bottom-color: var(--ink); }
.card .sub { font-size: calc(12.5px * var(--u)); color: var(--ink-2); margin-top: 6px; }
.card .body {
  overflow-y: auto;
  scrollbar-gutter: stable;
  min-height: 0;
  padding-right: 4px;
  margin-top: calc(14px * var(--u));
}
.card .foot {
  display: flex;
  align-items: center;
  gap: calc(18px * var(--u));
  border-top: 1px solid var(--rule);
  margin-top: 8px;
}

.row {
  display: grid;
  grid-template-columns: calc(118px * var(--u)) minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  min-height: calc(50px * var(--u));
  border-bottom: 1px solid var(--hair);
}
.row .k,
.search-result span:last-child { font-size: calc(12px * var(--u)); }
.row .v { display: flex; flex-wrap: wrap; align-items: center; gap: 10px calc(18px * var(--u)); min-width: 0; }
.tz-find { display: grid; gap: 8px; flex-basis: 100%; }
.tz-find input { font: 400 calc(14px * var(--u))/1.4 var(--ui-sans); color: var(--ink); background: transparent; border: 0; border-bottom: 1px solid var(--rule); padding: 4px 0; outline: none; max-width: 260px; }
.tz-results { display: flex; flex-wrap: wrap; gap: 6px calc(16px * var(--u)); }
.tz-results:empty { display: none; }
.row.top { align-items: start; padding-top: 14px; padding-bottom: 12px; }
.row.top .k { padding-top: 4px; }
.row.stack { grid-template-columns: 1fr; gap: 8px; }
.row.stack .k { padding-top: 0; }

.swatches { display: grid; grid-template-columns: repeat(8, auto); gap: 6px; justify-content: start; }
.sw {
  width: calc(34px * var(--u));
  height: calc(34px * var(--u));
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: none;
  border: 0;
  cursor: pointer;
}
.sw i {
  width: calc(18px * var(--u));
  height: calc(18px * var(--u));
  border-radius: 50%;
  display: block;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.12);
}
.sw[aria-pressed="true"] { box-shadow: inset 0 0 0 1.5px var(--ink); }

.note { font-size: calc(12.5px * var(--u)); line-height: 1.55; }
.sec {
  font-size: calc(10.5px * var(--u));
  letter-spacing: 0.18em;
  text-transform: uppercase;
  margin: calc(20px * var(--u)) 0 2px;
}
.stepper { display: inline-flex; align-items: center; }
.stepper .val {
  display: inline-block;
  text-align: center;
  font: 400 calc(15px * var(--u))/1 var(--ui-serif);
}

/* Warituke (Day Layout Sheet) */
.sheet-full {
  position: fixed;
  inset: calc(24px * var(--u)) calc(28px * var(--u));
  z-index: 265;
  border-radius: 6px;
  box-shadow: 0 30px 70px -24px rgba(40, 52, 63, 0.5);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  padding: calc(24px * var(--u)) calc(32px * var(--u)) calc(14px * var(--u));
  pointer-events: auto;
}
.wk-head { display: flex; align-items: flex-end; gap: 24px; }
.wk-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) calc(220px * var(--u));
  gap: calc(36px * var(--u));
  min-height: 0;
  padding: calc(20px * var(--u)) 0 calc(14px * var(--u));
}
/* The paper is the largest 4:3 sheet the space allows, so it never runs under the presets. */
.wk-sheet { position: relative; min-height: 0; min-width: 0; display: grid; place-items: center; container-type: size; }
.wk-paper {
  box-sizing: border-box;
  width: min(100cqw, 100cqh * 4 / 3, 820px);
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--paper);
  border: 1px solid var(--rule);
  border-radius: 3px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding: 20px;
  gap: 20px;
  background-image: linear-gradient(#E5EAED 1px, transparent 1px), linear-gradient(90deg, #E5EAED 1px, transparent 1px);
  background-size: 16px 16px;
}
.wk-page { display: grid; gap: 10px; min-height: 0; }
.wk-left { grid-template-columns: var(--schedCol, 1fr) 1fr; }
.wk-col { display: grid; gap: 10px; min-height: 0; align-content: stretch; }
.blk {
  position: relative;
  border: 1.5px solid var(--ink-2);
  border-radius: 3px;
  background: rgba(251, 251, 248, 0.92);
  display: grid;
  align-content: start;
  gap: 4px;
  padding: 10px 12px;
  text-align: left;
  min-height: 0;
  cursor: pointer;
}
.blk .bn { font: 400 calc(15px * var(--u))/1.2 var(--ui-serif); color: var(--ink); }
.blk .bm { font-size: calc(11.5px * var(--u)); color: var(--ink-2); }
.blk.off { border: 1.5px dashed var(--ink-3); background: transparent; }
.blk.off .bn { color: var(--ink-3); }
.blk.off .bm::before { content: "Hidden · tap to show"; }
.blk.on .bm:empty::before { content: "Tap to hide"; }
.blk .hours { display: grid; justify-items: start; gap: 0; margin-top: 8px; font-size: calc(12.5px * var(--u)); color: var(--ink); }
.blk .hours .hr { display: flex; align-items: center; white-space: nowrap; }
.blk .hours .to { color: var(--ink-3); font-size: calc(11px * var(--u)); padding-left: 36px; }
.presets { display: grid; gap: 14px; align-content: start; min-height: 0; }
.presets .sec { grid-column: 1 / -1; }
.preset { display: grid; grid-template-columns: minmax(0, 1fr); min-width: 0; gap: 6px; justify-items: start; text-align: left; background: none; border: 0; padding: 0; cursor: pointer; }
.preset .mini {
  width: calc(150px * var(--u));
  aspect-ratio: 4 / 3;
  border: 1px solid var(--rule);
  border-radius: 2px;
  background: var(--paper);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  padding: 6px;
}
.preset .mini .mp { display: grid; gap: 3px; min-height: 0; }
.preset .mini i { display: block; border: 1px solid var(--ink-3); border-radius: 1px; min-height: 0; }
.preset[aria-pressed="true"] .mini { box-shadow: 0 0 0 1.5px var(--ink); }
.preset .pn { font-size: calc(13px * var(--u)); }
/* Short screens (iPad landscape): the four presets sit two by two beside the paper. */
@media (max-height: 820px) {
  .presets { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .preset .mini { width: 100%; }
}

/* Single 7s Take back toast */
.toast {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: calc(82px * var(--u) + env(safe-area-inset-bottom, 0px));
  z-index: 340;
  background: var(--ink);
  color: var(--paper);
  border-radius: 999px;
  min-height: calc(44px * var(--u));
  padding: 0 10px 0 20px;
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: calc(13px * var(--u));
  box-shadow: 0 8px 26px rgba(40, 52, 63, 0.28);
  pointer-events: auto;
}
.toast .w { color: var(--paper); text-decoration: underline; text-underline-offset: 4px; padding: 0 8px; }

/* Event modal preserved ink swatches */
.event-modal .event-swatch-btn { position: relative; width: 44px; height: 44px; padding: 0; border: 0; background: transparent; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.event-modal .event-swatch-btn::before { content: ""; width: 20px; height: 20px; border-radius: 50%; background: var(--ink-swatch); }
.event-modal .event-swatch-btn.is-selected::before { outline: 1.5px solid var(--ink); outline-offset: 4px; }
.event-modal .event-palette-container { flex-wrap: wrap; gap: 8px; }
.event-swatch-other { position: relative; display: inline-flex; align-items: center; justify-content: center; min-width: 64px; height: 44px; }

/* Portrait & coarse pointer adjustments */
@media (max-width: 899px), (orientation: portrait) {
  .hashira {
    gap: 14px;
    padding: env(safe-area-inset-top, 0px) 16px 0;
  }
  .hashira .brand,
  .hashira .right .date { display: none; }
  .hashira-rule { margin: 0 16px; }
  .folioline {
    padding: 0 16px calc(6px + env(safe-area-inset-bottom, 0px));
    gap: 10px;
  }
  .folioline::before { left: 16px; right: 16px; }
  .wk-body { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) auto; }
  .presets { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
  .preset .mini { width: 100%; }
  .library-shelf { --shelf-gap: 32px; padding: 16px 24px 24px; }
  .library-shelf[data-layout="grid"] { padding: 24px; gap: calc(28px * var(--grid-zoom, 1)) calc(24px * var(--grid-zoom, 1)); }
}
@media (prefers-reduced-motion: reduce) {
  .folder-item-img.is-developing { animation-duration: 0.2s !important; }
  .library, .library.is-placing, .shelf-book-open, .drawer, .drawer-front, .drawer-stack-top, .hand-carried > .is-in-hand, .thing-veil, .thing-words { transition: none !important; }
}
@keyframes somi-develop {
  from { filter: brightness(1.8) saturate(0) blur(2px); opacity: 0.55; }
  to { filter: none; opacity: 1; }
}
.folder-item-img.is-developing {
  animation: somi-develop 1.6s ease-out both;
}

/* No floating buttons on page/spread objects: actions live in .objbar at bottom */
body:not(.in-library):not(.shelf-placing) #library { display: none !important; }
.drawer-stock-sample {
  display: block;
  margin-top: 10px;
  font: 400 18px/1.3 var(--font-hand, "Gaegu", "GaeguFallback", "Gowun Dodum", cursive);
  color: var(--ink-2);
}

/* Kept Album Viewer & Install dialog basics */
.album-head .album-caption { flex: 1; min-width: 0; font: 400 17px/24px var(--ui-serif); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.album-viewer.is-editing .album-head .album-caption { white-space: normal; }
.album-nav { display: flex; align-items: center; justify-content: center; gap: 0; min-height: 44px; }
.album-nav .album-step { flex: 0 0 44px; width: 44px; height: 44px; font: 400 22px/1 var(--ui-serif); }
.album-folio { min-width: 72px; text-align: center; font: 400 13px/1 var(--ui-sans); color: var(--ink); }
.install-dialog { width: min(440px, calc(100vw - 48px)); max-height: calc(100dvh - 48px); margin: auto; padding: 28px; border: 1px solid var(--hairline); color: var(--ink); overflow-y: auto; font: 400 14px/1.7 var(--ui-sans); }
.install-dialog::backdrop, .search-dialog::backdrop { background: rgba(40, 52, 63, 0.18); }
.install-dialog h2 { margin: 0 0 18px; font: 400 23px/1.5 var(--ui-serif); }
.install-dialog p + p { margin-top: 14px; }
.offline-status { color: var(--ink-2); font: 400 12px/1.5 var(--ui-sans); }

/* Proposal B Search Dialog & Desk Object Back Sides & Utility UI */
.search-dialog {
  width: min(560px, calc(100vw - 32px));
  max-height: min(480px, calc(100dvh - 80px));
  margin: calc(76px * var(--u)) auto auto;
  padding: 0;
  border: 0;
  border-radius: 6px;
  color: var(--ink);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.04), 0 30px 60px -24px rgba(40, 52, 63, 0.45);
}
.search-dialog .card-inner {
  margin: 14px;
  border: 1px solid var(--rule);
  border-radius: 3px;
  padding: calc(18px * var(--u)) calc(22px * var(--u)) calc(14px * var(--u));
  display: grid;
  grid-template-rows: auto auto auto minmax(0, 1fr);
  max-height: calc(min(480px, 100dvh - 80px) - 28px);
}
.search-heading-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.search-dialog .kick { font-size: calc(10.5px * var(--u)); letter-spacing: 0.2em; text-transform: uppercase; }
.search-dialog #notebook-query {
  width: 100%;
  border: 0;
  border-bottom: 1.5px solid var(--ink);
  background: none;
  padding: 8px 0 6px;
  font: 400 calc(22px * var(--u))/1.3 var(--ui-serif);
  color: var(--ink);
  -webkit-appearance: none;
  appearance: none;
  border-radius: 0;
  outline: none;
}
/* No system ✕: Esc or Close leave, and the words are erased like any other text. */
.search-dialog #notebook-query::-webkit-search-cancel-button,
.search-dialog #notebook-query::-webkit-search-decoration { -webkit-appearance: none; appearance: none; display: none; }
.search-status { font-size: calc(12px * var(--u)); margin: 10px 0 4px; }
.search-results { list-style: none; margin: 0; padding: 0; overflow-y: auto; }
.search-result {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  padding: 10px 2px;
  background: none;
  border: 0;
  border-bottom: 1px solid var(--hair);
  text-align: left;
  cursor: pointer;
}
.search-result-heading { font: 400 calc(14px * var(--u))/1.3 var(--ui-serif); color: var(--ink); }
.search-result:hover .search-result-heading { text-decoration: underline; text-underline-offset: 4px; }

/* Settings confirmation input */
.reset-confirm-line {
  width: 100%;
  border: 0;
  border-bottom: 1.5px solid var(--seal);
  background: transparent;
  padding: 6px 0;
  font: 400 calc(16px * var(--u))/1.3 var(--ui-sans);
  color: var(--ink);
  margin-top: 10px;
}

/* Loose object backs on page/desk (match .thing-viewer back faces) */
.desk-thing .thing-face--back {
  position: relative;
  width: 100%;
  height: 100%;
  background: #FAFBF9;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  box-shadow: inset 0 0 0 1px rgba(40, 52, 63, 0.14);
}
.desk-thing .thing-back-hand { font: 400 18px/1.35 var(--font-hand, "Gaegu", "GaeguFallback", "Gowun Dodum", cursive); color: #36414C; white-space: pre-wrap; word-break: break-word; }