/* Orangey Text: arapey-regular.woff

Copyright (c) 2011, Eduardo Tunni (http://www.tipo.net.ar),
with Reserved Font Name "Arapey"

This Font Software is licensed under the SIL Open Font License, Version 1.1.
This license is copied below, and is also available with a FAQ at:
https://openfontlicense.org


-----------------------------------------------------------
SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
-----------------------------------------------------------

PREAMBLE
The goals of the Open Font License (OFL) are to stimulate worldwide
development of collaborative font projects, to support the font creation
efforts of academic and linguistic communities, and to provide a free and
open framework in which fonts may be shared and improved in partnership
with others.

The OFL allows the licensed fonts to be used, studied, modified and
redistributed freely as long as they are not sold by themselves. The
fonts, including any derivative works, can be bundled, embedded, 
redistributed and/or sold with any software provided that any reserved
names are not used by derivative works. The fonts and derivatives,
however, cannot be released under any other type of license. The
requirement for fonts to remain under this license does not apply
to any document created using the fonts or their derivatives.

DEFINITIONS
"Font Software" refers to the set of files released by the Copyright
Holder(s) under this license and clearly marked as such. This may
include source files, build scripts and documentation.

"Reserved Font Name" refers to any names specified as such after the
copyright statement(s).

"Original Version" refers to the collection of Font Software components as
distributed by the Copyright Holder(s).

"Modified Version" refers to any derivative made by adding to, deleting,
or substituting -- in part or in whole -- any of the components of the
Original Version, by changing formats or by porting the Font Software to a
new environment.

"Author" refers to any designer, engineer, programmer, technical
writer or other person who contributed to the Font Software.

PERMISSION & CONDITIONS
Permission is hereby granted, free of charge, to any person obtaining
a copy of the Font Software, to use, study, copy, merge, embed, modify,
redistribute, and sell modified and unmodified copies of the Font
Software, subject to the following conditions:

1) Neither the Font Software nor any of its individual components,
in Original or Modified Versions, may be sold by itself.

2) Original or Modified Versions of the Font Software may be bundled,
redistributed and/or sold with any software, provided that each copy
contains the above copyright notice and this license. These can be
included either as stand-alone text files, human-readable headers or
in the appropriate machine-readable metadata fields within text or
binary files as long as those fields can be easily viewed by the user.

3) No Modified Version of the Font Software may use the Reserved Font
Name(s) unless explicit written permission is granted by the corresponding
Copyright Holder. This restriction only applies to the primary font name as
presented to the users.

4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
Software shall not be used to promote, endorse or advertise any
Modified Version, except to acknowledge the contribution(s) of the
Copyright Holder(s) and the Author(s) or with their explicit written
permission.

5) The Font Software, modified or unmodified, in part or in whole,
must be distributed entirely under this license, and must not be
distributed under any other license. The requirement for fonts to
remain under this license does not apply to any document created
using the Font Software.

TERMINATION
This license becomes null and void if any of the above conditions are
not met.

DISCLAIMER
THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
OTHER DEALINGS IN THE FONT SOFTWARE.
*/
@font-face { font-family: "Orangey Text"; src: url(data:font/woff;base64,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) format("woff"); font-display: block; }
/* Orangey Dice: youngserif-digits.woff

Copyright 2023 The Young Serif Project Authors (https://github.com/noirblancrouge/YoungSerif)

This Font Software is licensed under the SIL Open Font License, Version 1.1.
This license is copied below, and is also available with a FAQ at:
https://openfontlicense.org


-----------------------------------------------------------
SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
-----------------------------------------------------------

PREAMBLE
The goals of the Open Font License (OFL) are to stimulate worldwide
development of collaborative font projects, to support the font creation
efforts of academic and linguistic communities, and to provide a free and
open framework in which fonts may be shared and improved in partnership
with others.

The OFL allows the licensed fonts to be used, studied, modified and
redistributed freely as long as they are not sold by themselves. The
fonts, including any derivative works, can be bundled, embedded, 
redistributed and/or sold with any software provided that any reserved
names are not used by derivative works. The fonts and derivatives,
however, cannot be released under any other type of license. The
requirement for fonts to remain under this license does not apply
to any document created using the fonts or their derivatives.

DEFINITIONS
"Font Software" refers to the set of files released by the Copyright
Holder(s) under this license and clearly marked as such. This may
include source files, build scripts and documentation.

"Reserved Font Name" refers to any names specified as such after the
copyright statement(s).

"Original Version" refers to the collection of Font Software components as
distributed by the Copyright Holder(s).

"Modified Version" refers to any derivative made by adding to, deleting,
or substituting -- in part or in whole -- any of the components of the
Original Version, by changing formats or by porting the Font Software to a
new environment.

"Author" refers to any designer, engineer, programmer, technical
writer or other person who contributed to the Font Software.

PERMISSION & CONDITIONS
Permission is hereby granted, free of charge, to any person obtaining
a copy of the Font Software, to use, study, copy, merge, embed, modify,
redistribute, and sell modified and unmodified copies of the Font
Software, subject to the following conditions:

1) Neither the Font Software nor any of its individual components,
in Original or Modified Versions, may be sold by itself.

2) Original or Modified Versions of the Font Software may be bundled,
redistributed and/or sold with any software, provided that each copy
contains the above copyright notice and this license. These can be
included either as stand-alone text files, human-readable headers or
in the appropriate machine-readable metadata fields within text or
binary files as long as those fields can be easily viewed by the user.

3) No Modified Version of the Font Software may use the Reserved Font
Name(s) unless explicit written permission is granted by the corresponding
Copyright Holder. This restriction only applies to the primary font name as
presented to the users.

4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
Software shall not be used to promote, endorse or advertise any
Modified Version, except to acknowledge the contribution(s) of the
Copyright Holder(s) and the Author(s) or with their explicit written
permission.

5) The Font Software, modified or unmodified, in part or in whole,
must be distributed entirely under this license, and must not be
distributed under any other license. The requirement for fonts to
remain under this license does not apply to any document created
using the Font Software.

TERMINATION
This license becomes null and void if any of the above conditions are
not met.

DISCLAIMER
THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
OTHER DEALINGS IN THE FONT SOFTWARE.
*/
@font-face { font-family: "Orangey Dice"; src: url(data:font/woff;base64,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) format("woff"); font-display: block; unicode-range: U+0030-0039, U+002B, U+2212, U+0021; }
/* Colour, spacing and type tokens.
 *
 * Every scheme defines the same names; components only ever use var(--…).
 * No attribute means "follow the system": Orangey by day, Night in the dark.
 * data-scheme on <html> picks one explicitly.
 *
 * Brand: orange #f3a257, black #253122. Bright, never neon.
 */

:root {
  color-scheme: light dark;

  --brand-orange: #f3a257;
  --brand-black: #253122;

  --accent: #f3a257;
  --accent-ink: #253122;
  --accent-soft: #fde5cc;
  --accent-strong: #e0862f;

  --bg: #fff8ef;
  --bg-raised: #ffffff;
  --bg-sunken: #fbeedc;
  --border: #f0dcc3;
  --border-strong: #d9b98e;
  --ink: #253122;
  --ink-soft: #55604e;
  --ink-faint: #8a927f;

  --ok: #3f9c5a;
  --warn: #d38b1f;
  --error: #d64545;
  /* Text on an error-coloured fill. Your own theme derives it; built-ins use white. */
  --error-ink: #ffffff;

  --radius: 14px;
  --radius-sm: 9px;
  --shadow: 0 1px 2px rgba(37, 49, 34, 0.08), 0 6px 18px rgba(37, 49, 34, 0.07);

  --gap: 12px;
  --pad: 16px;

  /* Arapey for everything that is read, the system font for the labels on
     wheel slices — small, dense and on strong colour — and Young Serif for the
     numbers on dice (digits and signs only). The two embedded fonts come from
     the build; see assets/fonts. */
  --font: "Orangey Text", Georgia, "Times New Roman", serif;
  --font-ui: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  --font-dice: "Orangey Dice", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  --mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
}

/* Night: the brand black as the ground. */
:root[data-scheme="night"],
:root:not([data-scheme]) {
  @media (prefers-color-scheme: dark) {
    --bg: #253122;
    --bg-raised: #2f3d2c;
    --bg-sunken: #1b2419;
    --border: #3f4e3b;
    --border-strong: #5d6e58;
    --ink: #fff3e3;
    --ink-soft: #c9cfbf;
    --ink-faint: #8f9a88;
    --accent-soft: #4c3a26;
    --shadow: 0 1px 2px rgba(0, 0, 0, 0.45), 0 6px 18px rgba(0, 0, 0, 0.35);
  }
}

:root[data-scheme="night"] {
  --bg: #253122;
  --bg-raised: #2f3d2c;
  --bg-sunken: #1b2419;
  --border: #3f4e3b;
  --border-strong: #5d6e58;
  --ink: #fff3e3;
  --ink-soft: #c9cfbf;
  --ink-faint: #8f9a88;
  --accent-soft: #4c3a26;
  --shadow: 0 1px 2px rgba(0, 0, 0, 0.45), 0 6px 18px rgba(0, 0, 0, 0.35);
}

:root[data-scheme="orangey"] {
  /* Forces the light brand scheme even when the system is dark. Values are
     the :root defaults; the block exists so the attribute wins. */
  --bg: #fff8ef;
  --bg-raised: #ffffff;
  --bg-sunken: #fbeedc;
  --border: #f0dcc3;
  --border-strong: #d9b98e;
  --ink: #253122;
  --ink-soft: #55604e;
  --ink-faint: #8a927f;
  --accent-soft: #fde5cc;
  --shadow: 0 1px 2px rgba(37, 49, 34, 0.08), 0 6px 18px rgba(37, 49, 34, 0.07);
}

/* Meadow: a fresh green accent on a pale mint ground. */
:root[data-scheme="meadow"] {
  --accent: #5cc46a;
  --accent-ink: #163019;
  --accent-soft: #d8f3dc;
  --accent-strong: #3ea84e;
  --bg: #f4fbf3;
  --bg-raised: #ffffff;
  --bg-sunken: #e6f4e5;
  --border: #cfe6cf;
  --border-strong: #a3cba6;
  --ink: #1d2b1f;
  --ink-soft: #4d5e4f;
  --ink-faint: #849386;
  --shadow: 0 1px 2px rgba(29, 43, 31, 0.08), 0 6px 18px rgba(29, 43, 31, 0.07);
}

/* Ocean: a clear blue accent on a pale sky ground. */
:root[data-scheme="ocean"] {
  --accent: #3fa7e0;
  --accent-ink: #0f2a3a;
  --accent-soft: #d6eefb;
  --accent-strong: #2589c1;
  --bg: #f3f9fd;
  --bg-raised: #ffffff;
  --bg-sunken: #e4f1f9;
  --border: #cfe3f0;
  --border-strong: #9fc4da;
  --ink: #17262f;
  --ink-soft: #4b5d68;
  --ink-faint: #85959f;
  --shadow: 0 1px 2px rgba(23, 38, 47, 0.08), 0 6px 18px rgba(23, 38, 47, 0.07);
}

/* Berry: a warm pink accent on a blush ground. */
:root[data-scheme="berry"] {
  --accent: #e8679a;
  --accent-ink: #3a1224;
  --accent-soft: #fbdde8;
  --accent-strong: #cf477d;
  --bg: #fff5f8;
  --bg-raised: #ffffff;
  --bg-sunken: #fbe6ee;
  --border: #f1d2de;
  --border-strong: #dba7bd;
  --ink: #2c1b23;
  --ink-soft: #5e4a53;
  --ink-faint: #97858d;
  --shadow: 0 1px 2px rgba(44, 27, 35, 0.08), 0 6px 18px rgba(44, 27, 35, 0.07);
}

* { box-sizing: border-box; }

html, body { height: 100%; }

body {
  margin: 0;
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.45;
  color: var(--ink);
  background: var(--bg);
  -webkit-text-size-adjust: 100%;
}

/* Exactly the window's height: the library and the main pane scroll inside it. */
#app { display: flex; flex-direction: column; height: 100vh; height: 100dvh; }

/* ---- shell ---------------------------------------------------------------- */

.topbar {
  display: flex;
  align-items: center;
  gap: var(--gap);
  padding: 10px var(--pad);
  border-bottom: 1px solid var(--border);
  background: var(--bg-raised);
  position: sticky;
  top: 0;
  z-index: 20;
}

.brand {
  font-weight: 650;
  letter-spacing: -0.01em;
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--ink);
  text-decoration: none;
}
.brand .mark {
  display: block; width: 26px; height: 23px; flex: none;
}

.panes { display: flex; flex: 1; min-height: 0; }
.side {
  width: 300px;
  flex: none;
  border-right: 1px solid var(--border);
  background: var(--bg-raised);
  overflow: auto;
  padding: var(--pad);
}
.main { flex: 1; min-width: 0; overflow: auto; padding: var(--pad); }
.main-inner { max-width: 1100px; margin: 0 auto; }

.tabbar { display: none; }

@media (max-width: 1023px) {
  /* The tab bar covers this navigation on a small screen; Back stays. */
  .topbar button:not(.back) { display: none; }
  .side { display: none; }
  .side.is-active { display: block; width: 100%; border-right: 0; }
  .main.is-hidden { display: none; }
  .tabbar {
    display: flex;
    position: sticky;
    bottom: 0;
    border-top: 1px solid var(--border);
    background: var(--bg-raised);
    z-index: 20;
  }
  .tabbar button {
    flex: 1;
    border: 0;
    background: none;
    padding: 10px 4px 12px;
    color: var(--ink-soft);
    font: inherit;
    font-size: 13px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    min-height: 52px;
  }
  .tabbar button[aria-current="page"] { color: var(--accent); }
  .tabbar .glyph { font-size: 18px; line-height: 1; }
}

/* ---- controls ------------------------------------------------------------- */

button, input, select, textarea { font: inherit; color: inherit; }

button {
  background: var(--bg-raised);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  padding: 7px 12px;
  cursor: pointer;
  min-height: 36px;
}
button:hover { background: var(--bg-sunken); }
button:disabled { opacity: 0.5; cursor: not-allowed; }
button.primary { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); font-weight: 650; }
button.primary:hover { background: var(--accent-strong); border-color: var(--accent-strong); }
button.danger-primary { background: var(--error); border-color: var(--error); color: var(--error-ink); }
button.ghost { border-color: transparent; background: none; }
button.ghost:hover { background: var(--bg-sunken); }
button.danger { color: var(--error); }

.icon-button {
  min-height: 32px;
  min-width: 32px;
  padding: 4px 6px;
  border-color: transparent;
  background: none;
  line-height: 1;
}
.icon-button:hover { background: var(--bg-sunken); }

:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 3px; }

input[type="text"], input[type="number"], input[type="search"], select, textarea {
  background: var(--bg-raised);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  padding: 7px 9px;
  min-height: 36px;
  width: 100%;
}
input[type="range"] { width: 100%; accent-color: var(--accent); }
textarea { min-height: 120px; resize: vertical; font-family: var(--mono); font-size: 13px; }

.field { display: flex; flex-direction: column; gap: 4px; margin-bottom: var(--gap); }
.field-label { font-size: 14px; color: var(--ink-soft); font-weight: 550; }
.field-hint { font-size: 13px; color: var(--ink-faint); }
.feel-toggle { flex-direction: row; align-items: center; cursor: pointer; }
.feel-toggle input { cursor: pointer; }

.row { display: flex; gap: var(--gap); align-items: center; flex-wrap: wrap; }
.row.tight { gap: 6px; }
/* Top-margin utilities, so views need no inline style for spacing. */
.gap-s { margin-top: 8px; }
.gap-m { margin-top: 12px; }
.gap-l { margin-top: 14px; }
.bag-line { justify-content: flex-end; margin: 4px 0 2px; min-height: 28px; }
.bag-line[hidden] { display: none; }
.home-shortcuts[hidden] { display: none; }
.home-shortcuts h2 { font-size: 16px; margin: 0 0 6px; }
.shortcut-group + .shortcut-group { margin-top: 12px; }
/* input.roll-count, not .roll-count: the number-input rule's width: 100% wins. */
input.roll-count { width: 56px; }
.roll-count-field[hidden] { display: none; }
.slices-field[hidden] { display: none; }
.spacer { flex: 1; }
.muted { color: var(--ink-soft); }
.faint { color: var(--ink-faint); font-size: 14px; }
.card {
  background: var(--bg-raised);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: var(--pad);
  box-shadow: var(--shadow);
  margin-bottom: var(--gap);
}
h1 { font-size: 21px; margin: 0 0 4px; letter-spacing: -0.01em; }
h2 { font-size: 16px; margin: 0 0 var(--gap); }
h3 { font-size: 14px; margin: var(--pad) 0 6px; color: var(--ink-soft); }

.segmented { display: inline-flex; align-self: flex-start; width: max-content; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); overflow: hidden; }
.segmented button { border: 0; border-radius: 0; background: var(--bg-raised); }
.segmented button + button { border-left: 1px solid var(--border); }
.segmented button[aria-pressed="true"] { background: var(--accent); color: var(--accent-ink); font-weight: 600; }

/* ---- result --------------------------------------------------------------- */

.result-panel {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: var(--pad);
  text-align: center;
  min-height: 128px;
  justify-content: center;
}
/* Set per randomizer from its longest outcome, so a roll never changes the height. */
.result-slot {
  font-size: clamp(38px, 11vw, 76px);
  /* The last line's descenders sit in the padding below .result-value, so
     the slot makes room for it too. */
  height: calc(var(--result-lines, 1) * 1.05em + 0.16em);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}
.result-slot.small { font-size: clamp(24px, 6vw, 40px); }
.result-value {
  font-size: inherit;
  font-weight: 680;
  line-height: 1.05;
  letter-spacing: -0.02em;
  word-break: break-word;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: var(--result-lines, 1);
  line-clamp: var(--result-lines, 1);
  overflow: hidden;
  /* Descenders (old-style dice digits, Arapey's g, p, y) reach about 0.2 em below
     the baseline; this padding is inside the clip, so they are not cut off. More
     than 0.1 em because Windows puts the baseline about 1.6 px lower than Linux. */
  padding-bottom: 0.16em;
  max-width: 100%;
}
/* Room for the detail line is kept from the start, so the first roll moves nothing. */
.result-detail { font-family: var(--mono); font-size: 13px; color: var(--ink-soft); min-height: 1.35em; }
.result-meta { font-size: 14px; color: var(--ink-faint); }
.result-panel.seeded .result-meta { min-height: 1.35em; }
.result-value.is-max { color: var(--ok); }
.result-value.is-min { color: var(--error); }

/* Offer cards: equal height; invisible stand-ins hold the row until they arrive. */
.offer-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(104px, 1fr));
  gap: 6px;
  width: 100%;
  margin: 4px 0 2px;
}
.offer-cards[hidden] { display: none; }
.offer-card {
  position: relative;
  height: calc(2 * 1.2em + 18px);
  padding: 9px 8px 9px 22px;
  font-size: 15px;
  line-height: 1.2;
  text-align: left;
  display: flex;
  align-items: center;
  min-width: 0;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  background: var(--bg-raised);
}
.offer-card.placeholder { visibility: hidden; }
.offer-text {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  word-break: break-word;
}
.offer-key { position: absolute; left: 7px; top: 6px; font-size: 11px; color: var(--ink-faint); font-variant-numeric: tabular-nums; }
button.offer-card:not([aria-disabled="true"]):hover { border-color: var(--accent); background: var(--accent-soft); }
.offer-card.face-down {
  background: repeating-linear-gradient(135deg, var(--accent-soft) 0 6px, var(--bg-raised) 6px 12px);
  opacity: 1;
}
.offer-card.chosen { border-color: var(--accent); box-shadow: inset 0 0 0 2px var(--accent); font-weight: 650; }
.offer-card.not-chosen { opacity: 0.35; }
.offer-cards.flipping .offer-card:not(.placeholder) {
  /* The duration comes from feel.ts (OFFER_FLIP_MS), scaled by the motion
     setting; instant leaves this class off altogether. */
  animation: offer-in var(--offer-flip, 260ms) cubic-bezier(0.2, 0.8, 0.3, 1) both;
  animation-delay: calc(var(--i, 0) * var(--offer-flip, 260ms) / 3);
}
@keyframes offer-in {
  from { transform: rotateY(90deg); opacity: 0; }
  to { transform: none; opacity: 1; }
}
.cell .offer-card { font-size: 13px; }
.cell .offer-cards { grid-template-columns: repeat(auto-fit, minmax(84px, 1fr)); }

.quick-wheel[hidden] { display: none; }
/* 16px, or iOS zooms on focus. */
.quick-options { width: 100%; min-height: 6.5em; box-sizing: border-box; font-family: inherit; font-size: 16px; }
.quick-wheel-foot { margin-top: 6px; }
input.quick-offer, input.offer-input { width: 56px; }
.quick-too-long[hidden] { display: none; }
.quick-wheel-toggle[aria-expanded="true"] { background: var(--accent-soft); border-color: var(--accent); }

.quickbar { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: var(--gap); }
.quickbar button { min-width: 54px; font-variant-numeric: tabular-nums; }
/* The home bar reuses the preset row, so opening a randomizer shifts nothing. */
.home-bar .home-button { min-width: 0; }

/* ---- wheel ---------------------------------------------------------------- */

.wheel-wrap { position: relative; display: grid; place-items: center; padding: 8px 0 4px; }
.wheel-holder { width: 100%; max-width: min(72vw, 380px); }
.wheel-small .wheel-holder { max-width: 200px; }
/* No transform-origin: the group's rotate(angle cx cy) already carries one. */
.wheel-svg { display: block; width: 100%; height: auto; }
/* Only the hub rolls; `manipulation` stops a double-tap on a slice zooming the page. */
.wheel-svg { touch-action: manipulation; -webkit-user-select: none; user-select: none; }
.wheel-hub.rolls { cursor: pointer; }
.wheel-hub.rolls:hover circle { fill: var(--accent-soft); }
.wheel-hub.rolls:hover .wheel-roll-mark { stroke: var(--ink); }

/* Quick edit: one outcome's weight, in a small box on the wheel. */
.weight-editor {
  position: absolute;
  z-index: 5;
  width: 220px;
  padding: 10px 12px 12px;
  background: var(--bg-raised);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  display: grid;
  gap: 6px;
  text-align: left;
}
.weight-head { display: flex; align-items: center; gap: 6px; }
.weight-label { flex: 1; min-width: 0; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.weight-close { padding: 2px 8px; line-height: 1.2; }
.weight-input { width: 100px; }
.weight-note:empty { display: none; }
.weight-note { color: var(--error); margin: 0; font-size: 13px; }
.weight-hint { margin: 0; font-size: 12px; }
.wheel-pointer { filter: drop-shadow(0 1px 2px rgba(0,0,0,0.3)); }
/* No font-size here: each label carries its own, sized to its slice, and a
   CSS font-size would override the attribute. The weight matches
   WHEEL_LABEL_WEIGHT in wheel.ts, which measures labels to fit them. */
.wheel-label { font-weight: 600; pointer-events: none; }
.ticker {
  height: 92px; overflow: hidden; position: relative; border: 1px solid var(--border);
  border-radius: var(--radius); background: var(--bg-sunken);
}
.ticker-strip { position: absolute; left: 0; right: 0; will-change: transform; }
.ticker-row { height: 46px; display: flex; align-items: center; padding: 0 14px; font-weight: 600; }
.ticker-marker {
  position: absolute; left: 0; right: 0; top: 23px; height: 46px;
  border-top: 2px solid var(--accent); border-bottom: 2px solid var(--accent); pointer-events: none;
}

/* ---- dice and coin -------------------------------------------------------- */

/* Outcome list: scrolls inside itself, so a long list keeps Roll on screen. */
.outcome-list {
  position: relative;
  list-style: none;
  margin: 0;
  padding: 0;
  width: 100%;
  max-height: min(45vh, 480px);
  overflow-y: auto;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg-raised);
}
.outcome-list li + li { border-top: 1px solid var(--border); }
.outcome-pick {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  width: 100%;
  text-align: left;
  border: 0;
  border-radius: 0;
  background: none;
  padding: 7px 12px;
  cursor: pointer;
}
.outcome-pick:hover:not(:disabled) { background: var(--bg-sunken); }
.outcome-pick[aria-current="true"] { background: var(--accent-soft); font-weight: 600; }
.outcome-pick:disabled { cursor: default; color: var(--ink-faint); text-decoration: line-through; }
.outcome-label { min-width: 0; overflow-wrap: anywhere; }
.outcome-odds { flex: none; color: var(--ink-faint); font-size: 13px; font-variant-numeric: tabular-nums; }

.dice-tray { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; min-height: 56px; align-items: flex-end; }
.die {
  width: 46px; height: 46px; border-radius: 9px;
  display: grid; place-items: center;
  font-weight: 700; font-size: 18px;
  background: var(--bg-raised); border: 2px solid var(--border-strong);
  font-variant-numeric: tabular-nums;
}
/* Faded and dashed, not struck through: a line through a small old-style 2 reads as a Z. */
.die.dropped { opacity: 0.45; border-style: dashed; }
.die.max { border-color: var(--ok); color: var(--ok); }
.die.min { border-color: var(--error); color: var(--error); }
.die.rolling {
  /* animation-duration is set from the Feel settings when the roll starts. */
  animation: tumble 340ms linear infinite;
  color: var(--ink-faint);
  border-style: dashed;
}
@keyframes tumble {
  0% { transform: translateY(0) rotate(0deg); }
  25% { transform: translateY(-11px) rotate(90deg) scale(1.04); }
  50% { transform: translateY(0) rotate(180deg); }
  75% { transform: translateY(-7px) rotate(270deg) scale(0.98); }
  100% { transform: translateY(0) rotate(360deg); }
}

/* Wireframe dice: one canvas per die; only transform and opacity animate. */
.die-slot { display: flex; flex-direction: column; align-items: center; gap: 1px; }
.die-stage { position: relative; width: 92px; height: 92px; display: grid; place-items: center; }
.die-canvas { display: block; }
.die-value {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-weight: 650;
  /* Set from the geometry when the die lands: half the length of a side of
     the face it is showing. */
  font-size: 18px;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  opacity: 0;
  transition: opacity 180ms cubic-bezier(0.16, 1, 0.3, 1);
  pointer-events: none;
}
.die-slot:not(.rolling) .die-value { opacity: 1; }
.die-caption {
  font-size: 13px;
  color: var(--ink-soft);
  font-variant-numeric: tabular-nums;
  min-height: 1.2em;
}
.die-slot.dropped { opacity: 0.55; }
.die-slot.dropped .die-value,
.die-slot.max .die-value { color: var(--ok); }
.die-slot.min .die-value { color: var(--error); }

.die.landing { animation: land var(--bounce, 440ms) cubic-bezier(0.28, 0.9, 0.35, 1) both; }
.die-stage.landing { animation: land var(--bounce, 440ms) cubic-bezier(0.28, 0.9, 0.35, 1) both; }
@keyframes land {
  0% { transform: translateY(-18px) scaleY(1.08) scaleX(0.94); }
  35% { transform: translateY(0) scaleY(0.86) scaleX(1.12); }
  55% { transform: translateY(-8px) scaleY(1.05) scaleX(0.97); }
  75% { transform: translateY(0) scaleY(0.94) scaleX(1.05); }
  90% { transform: translateY(-2px) scaleY(1.01) scaleX(0.99); }
  100% { transform: none; }
}

.coin-wrap { display: grid; place-items: center; min-height: 120px; padding-top: 60px; }
.coin-flight { will-change: transform; }
.coin {
  width: 96px; height: 96px; border-radius: 50%; display: grid; place-items: center;
  font-weight: 700; border: 3px solid var(--accent-strong); background: var(--accent);
  color: var(--accent-ink); transform-style: preserve-3d; margin: 0 auto;
}
.coin.flipping { animation: flip var(--coin-duration, 1100ms) cubic-bezier(0.3, 0, 0.2, 1); }
@keyframes flip {
  from { transform: rotateX(0); }
  to { transform: rotateX(calc(360deg * var(--coin-flips, 5))); }
}
/* The toss: a parabola sampled at eighths, so linear keyframes follow the curve. */
.coin-flight.tossing { animation: toss var(--coin-duration, 1100ms) linear both; }
@keyframes toss {
  0%    { transform: translate(calc(var(--travel, 0px) * -1), 0) scale(1); }
  12.5% { transform: translate(calc(var(--travel, 0px) * -0.875), calc(var(--arc-h, 0px) * -0.4375)) scale(calc(1 - (1 - var(--shrink, 1)) * 0.383)); }
  25%   { transform: translate(calc(var(--travel, 0px) * -0.75), calc(var(--arc-h, 0px) * -0.75)) scale(calc(1 - (1 - var(--shrink, 1)) * 0.707)); }
  37.5% { transform: translate(calc(var(--travel, 0px) * -0.625), calc(var(--arc-h, 0px) * -0.9375)) scale(calc(1 - (1 - var(--shrink, 1)) * 0.924)); }
  50%   { transform: translate(calc(var(--travel, 0px) * -0.5), calc(var(--arc-h, 0px) * -1)) scale(var(--shrink, 1)); }
  62.5% { transform: translate(calc(var(--travel, 0px) * -0.375), calc(var(--arc-h, 0px) * -0.9375)) scale(calc(1 - (1 - var(--shrink, 1)) * 0.924)); }
  75%   { transform: translate(calc(var(--travel, 0px) * -0.25), calc(var(--arc-h, 0px) * -0.75)) scale(calc(1 - (1 - var(--shrink, 1)) * 0.707)); }
  87.5% { transform: translate(calc(var(--travel, 0px) * -0.125), calc(var(--arc-h, 0px) * -0.4375)) scale(calc(1 - (1 - var(--shrink, 1)) * 0.383)); }
  100%  { transform: translate(0, 0) scale(1); }
}
.coin-flight.landing { animation: land var(--bounce, 440ms) cubic-bezier(0.28, 0.9, 0.35, 1) both; }

.die-flight { will-change: transform; }
.die-flight.flying { animation: throw var(--flight, 900ms) cubic-bezier(0.45, 0, 0.25, 1) both; }
/* Dice added later (explosions, rerolls) keep their place, unseen, until thrown. */
.die-flight.waiting { visibility: hidden; }
@keyframes throw {
  0%   { transform: translate(var(--sx, 0px), var(--sy, 0px)) scale(0.8); }
  45%  { transform: translate(var(--mx, 0px), var(--my, 0px)) scale(1.06); }
  100% { transform: translate(0, 0) scale(1); }
}

/* Until the landing the slot shows a muted placeholder, not the answer. */
.result-panel.is-pending .result-value { color: var(--ink-faint); font-weight: 550; opacity: 0.8; }

/* ---- library -------------------------------------------------------------- */

.tree { list-style: none; margin: 0; padding: 0; }
.tree li { list-style: none; }
.tree-row {
  display: flex; align-items: center; gap: 6px; width: 100%;
  padding: 5px 6px; border-radius: var(--radius-sm); border: 0; background: none;
  text-align: left; cursor: pointer; min-height: 34px;
}
.tree-row:hover { background: var(--bg-sunken); }
.tree-row[aria-current="true"] { background: var(--accent-soft); font-weight: 600; }
.tree-row.drop-target, .tree-holder.drop-target { outline: 2px dashed var(--accent); outline-offset: -2px; background: var(--accent-soft); }
.tree-row.dragging { opacity: 0.4; }
.tree-row.selected { background: var(--accent-soft); box-shadow: inset 3px 0 0 var(--accent); }
.tree-row.selected:hover { background: var(--accent-soft); }
.library-selection {
  font-size: 13px; padding: 4px 6px 4px 10px; margin: 6px 0; border-radius: var(--radius-sm);
  background: var(--accent-soft); color: var(--accent-ink);
}
.library-selection[hidden] { display: none; }
.library-selection .grow { flex: 1; min-width: 0; }
.library-selection .clear-selection { min-height: 28px; padding: 2px 10px; }
.library-head { margin-bottom: 8px; }
.library-title { margin: 0; font-size: 16px; }
.library-foot { margin-top: 12px; }
.storage-badge {
  font-size: 13px; padding: 3px 9px; min-height: 26px; border-radius: 999px;
  border-color: var(--border); color: var(--ink-soft); background: var(--bg-sunken);
}
.storage-badge.memory { color: var(--error-ink); background: var(--error); border-color: var(--error); }
.storage-badge.fsa { color: var(--accent-ink); background: var(--accent-soft); border-color: var(--accent); }
.notice {
  background: var(--accent-soft); border-left: 3px solid var(--accent); padding: 8px 10px;
  border-radius: var(--radius-sm); font-size: 14px; margin: 8px 0; line-height: 1.5;
}
.notice.danger { background: #fde4e4; border-left-color: var(--error); color: #6b1f1f; }
.menu {
  position: absolute; z-index: 60; min-width: 200px; padding: 6px;
  background: var(--bg-raised); border: 1px solid var(--border); border-radius: var(--radius-sm);
  box-shadow: var(--shadow); display: flex; flex-direction: column;
}
.menu-item { border: 0; background: none; text-align: left; padding: 8px 10px; border-radius: 6px; min-height: 34px; }
.menu-item:hover, .menu-item:focus-visible { background: var(--bg-sunken); outline: none; }
.menu-item.danger { color: var(--error); }
.menu-rule { height: 1px; background: var(--border); margin: 4px 2px; }
.folder-pick { max-height: 50vh; overflow: auto; border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 4px; }
.tree-row .glyph { width: 18px; text-align: center; flex: none; }
.tree-row .name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tree-row .count { margin-left: auto; color: var(--ink-faint); font-size: 13px; }
.tree ul { margin: 0; padding-left: 14px; border-left: 1px solid var(--border); }
.tree-file { display: flex; align-items: center; gap: 2px; flex-wrap: nowrap; }
.tree-file .tree-row { flex: 1; min-width: 0; }

.search-hit .why { color: var(--ink-faint); font-size: 13px; }

/* ---- outcome table -------------------------------------------------------- */

/* Narrower than this and the selects become unreadable; the wrapper scrolls instead. */
.outcomes { width: 100%; min-width: 900px; border-collapse: collapse; }
.outcomes th {
  text-align: left; font-size: 13px; color: var(--ink-soft); font-weight: 600;
  padding: 4px 6px; border-bottom: 1px solid var(--border); position: sticky; top: 0; background: var(--bg-raised);
}
.outcomes td { padding: 2px 6px; border-bottom: 1px solid var(--border); vertical-align: middle; }
.outcomes tr.disabled .label-cell input,
.outcomes tr.disabled .weight-cell input { opacity: 0.5; }
.outcomes tr.disabled .pct { text-decoration: line-through; }
.outcomes tr.dragging { opacity: 0.4; }
.outcomes tr.drop-target td { border-top: 2px solid var(--accent); }
.outcomes .handle { cursor: grab; color: var(--ink-faint); user-select: none; width: 22px; text-align: center; }
.outcomes .pct { font-variant-numeric: tabular-nums; color: var(--ink-soft); font-size: 14px; width: 58px; text-align: right; }
.outcomes input[type="text"], .outcomes input[type="number"] { min-height: 32px; padding: 4px 7px; }
.outcomes .weight-cell input { width: 68px; text-align: right; font-variant-numeric: tabular-nums; }
.outcomes .label-cell { min-width: 150px; }
.outcomes .label-cell input, .outcomes .desc-cell input { width: 100%; box-sizing: border-box; }
.outcomes .desc-cell { min-width: 130px; width: 30%; }
.outcomes .reaction-cell { width: 1%; white-space: nowrap; }

/* ---- the Orangey tag on an outcome ---------------------------------------- */

.reaction-control {
  min-height: 30px; min-width: 56px; padding: 2px 8px; font-size: 14px;
  border-radius: 999px; border: 1px solid var(--border); background: transparent; color: var(--ink-faint);
}
.reaction-control.reaction-cheer { color: var(--ink); background: color-mix(in oklab, var(--accent) 22%, transparent); border-color: transparent; }
.reaction-control.reaction-wince { color: var(--ink); background: color-mix(in oklab, var(--ink) 12%, transparent); border-color: transparent; }
.reaction-control:hover { border-color: var(--ink-soft); }
.face-row { flex-wrap: nowrap; }
.face-row input { flex: 1; min-width: 0; }
.face-row .faint { white-space: nowrap; }

/* ---- my colours ------------------------------------------------------------- */

.my-colours { display: flex; flex-direction: column; gap: 4px; }
.my-colour { display: flex; align-items: center; gap: 10px; padding: 2px 0; }
.my-colour-swatch { width: 26px; height: 26px; border-radius: 7px; border: 1px solid rgba(0,0,0,0.12); flex: none; }
.my-colour-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.my-colour-hex { font-variant-numeric: tabular-nums; }
.colours-card input[type="color"], .swatch-add input[type="color"] { width: 44px; height: 36px; padding: 2px; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); background: var(--bg-raised); }
.add-colour-row, .swatch-add .row, .swatch-dialog .hex-row { flex-wrap: nowrap; }
.swatch-dialog .hex-row input[type="text"] { flex: 1; width: auto; min-width: 100px; }
.add-colour-row input[type="text"], .swatch-add input[type="text"] { flex: 1; width: auto; min-width: 120px; }
.swatch-grid-custom button { outline: 1px dashed var(--ink-faint); outline-offset: -3px; }
.swatch-grid-custom button[aria-pressed="true"] { outline: 2px solid var(--ink); outline-offset: 1px; }
/* The row actions stay reachable when a narrow screen scrolls the table. */
.outcomes .actions,
.outcomes th:last-child {
  white-space: nowrap;
  width: 1%;
  position: sticky;
  right: 0;
  background: var(--bg-raised);
  box-shadow: -6px 0 6px -6px rgba(0, 0, 0, 0.18);
}
.outcomes tbody tr:hover { background: var(--bg-sunken); }
.swatch {
  width: 26px; height: 26px; border-radius: 6px; border: 1px solid var(--border-strong);
  padding: 0; cursor: pointer; flex: none;
}
.swatch.auto { position: relative; }
.swatch.auto::after {
  content: "A"; position: absolute; inset: 0; display: grid; place-items: center;
  font-size: 11px; font-weight: 700; color: var(--auto-ink, rgba(255,255,255,0.85));
}
.swatch-groups { max-height: 56vh; overflow: auto; padding-right: 4px; }
.swatch-group-title { margin: 10px 0 4px; font-size: 13px; }
.swatch-grid { display: flex; flex-wrap: wrap; gap: 5px; }
.swatch-grid button { width: 28px; height: 28px; border-radius: 7px; padding: 0; min-height: 0; border: 1px solid rgba(0,0,0,0.12); }
.swatch-grid button:hover { transform: scale(1.12); }
.swatch-name { min-height: 1.4em; margin-bottom: 4px; }
.swatch-grid button[aria-pressed="true"] { outline: 2px solid var(--ink); outline-offset: 1px; }

.editor-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: var(--pad); align-items: start; }
/* minmax(0, 1fr), not 1fr: a 1fr track grows to the table's width instead of scrolling. */
@media (max-width: 900px) { .editor-layout { grid-template-columns: minmax(0, 1fr); } }
.table-scroll { max-height: 62vh; overflow: auto; border: 1px solid var(--border); border-radius: var(--radius); }

/* ---- misc ----------------------------------------------------------------- */

/* Cards are filled later; an empty one would show as a blank rounded box. */
.importer > .card:empty { display: none; }
.report { font-family: var(--mono); font-size: 13px; line-height: 1.7; white-space: pre-wrap; margin: 0; }
.report .ok { color: var(--ok); }
.report .warn { color: var(--warn); }
.report .error { color: var(--error); }

.toasts { position: fixed; left: 50%; bottom: 18px; transform: translateX(-50%); z-index: 50; display: flex; flex-direction: column; gap: 8px; }
.toast {
  background: var(--ink); color: var(--bg); padding: 9px 12px; border-radius: var(--radius);
  display: flex; align-items: center; gap: 12px; box-shadow: var(--shadow); font-size: 14px;
}
.toast button { background: none; border: 0; color: var(--bg); text-decoration: underline; padding: 2px 4px; min-height: 0; }

.history-list { list-style: none; margin: 0; padding: 0; }
.history-list li { display: flex; gap: 10px; align-items: baseline; padding: 6px 0; border-bottom: 1px solid var(--border); }
.history-list .when { color: var(--ink-faint); font-variant-numeric: tabular-nums; font-size: 13px; flex: none; }
.history-list .what { flex: 1; min-width: 0; }
.history-list .what .name { font-weight: 600; }
.history-list .what .detail { font-family: var(--mono); font-size: 12px; color: var(--ink-soft); }
.history-list .what .roll-note { display: block; font-size: 13px; color: var(--ink-faint); }
.history-list .what .roll-parts { font-family: var(--mono); }

/* Full screen: chrome is hidden here, as rules that set display beat [hidden]. */
body.presenting .topbar,
body.presenting .side,
body.presenting .tabbar,
body.presenting .quickbar,
body.presenting .quick-wheel,
/* After the play card, not the first card: on home the quick wheel's card is first. */
body.presenting .play > .play-card ~ .card,
body.presenting .present-button,
body.presenting .popout-button,
body.presenting .link-button,
body.presenting .edit-link {
  display: none !important;
}

body.presenting #app { height: 100dvh; overflow: hidden; }
body.presenting .panes { height: 100dvh; }
body.presenting .main { padding: 0; overflow: hidden; }
body.presenting .main-inner { max-width: none; height: 100%; display: flex; }
body.presenting .play { flex: 1; min-height: 0; display: flex; flex-direction: column; }
body.presenting .play > .card {
  flex: 1;
  min-height: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 10px;
  padding: clamp(12px, 3vw, 40px);
}
/* The stage shrinks, not the result panel, so the answer never overlaps the wheel. */
body.presenting .stage { display: flex; justify-content: center; min-height: 0; flex: 1 1 auto; }
/* Full screen the wheel follows the height it is given, not the window width. */
body.presenting .wheel-wrap { display: flex; align-items: stretch; justify-content: center; min-height: 0; padding: 0; }
body.presenting .wheel-holder {
  /* Stretched to the height the stage was given — a definite size, unlike a
     percentage against a flex-sized parent — and squared from there. */
  align-self: stretch;
  width: auto;
  height: auto;
  aspect-ratio: 1;
  max-height: min(44vh, 420px);
  max-width: 100%;
}
body.presenting .wheel-svg { height: 100%; width: 100%; }
body.presenting .result-panel { min-height: 0; padding: 4px; flex: none; }
body.presenting .result-slot { font-size: clamp(40px, 11vw, 150px); }
body.presenting .result-slot.small { font-size: clamp(30px, 7vw, 96px); }
/* Two lines at full-screen size would fill a third of a laptop screen: step down. */
body.presenting .result-panel.two-lines .result-slot { font-size: min(clamp(36px, 8vw, 112px), 17vh); }
body.presenting .result-panel.two-lines .result-slot.small { font-size: min(clamp(28px, 6vw, 84px), 15vh); }
body.presenting .result-detail { font-size: clamp(13px, 1.5vw, 20px); }
body.presenting .offer-card { font-size: clamp(15px, 1.8vw, 24px); }
body.presenting .roll-button { min-height: 60px; font-size: 20px; flex: none; }
body.presenting .leave-presenting {
  position: fixed;
  top: 12px;
  right: 12px;
  z-index: 30;
  opacity: 0.5;
}
body.presenting .leave-presenting:hover,
body.presenting .leave-presenting:focus-visible { opacity: 1; }

.scheme-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.scheme-card {
  display: flex; flex-direction: column; align-items: flex-start; gap: 4px; text-align: left;
  padding: 10px; border-radius: var(--radius); min-height: 0;
}
.scheme-card[aria-pressed="true"] { outline: 2px solid var(--accent); outline-offset: 1px; }
.scheme-name { font-weight: 650; }
.scheme-swatch { width: 100%; height: 22px; border-radius: 6px; border: 1px solid rgba(0,0,0,0.08); }
.scheme-system .scheme-swatch { background: linear-gradient(90deg, #fff8ef 0 50%, #253122 50% 100%); }
.scheme-orangey .scheme-swatch { background: linear-gradient(90deg, #fff8ef 0 60%, #f3a257 60% 100%); }
.scheme-night .scheme-swatch { background: linear-gradient(90deg, #253122 0 60%, #f3a257 60% 100%); }
.scheme-meadow .scheme-swatch { background: linear-gradient(90deg, #f4fbf3 0 60%, #5cc46a 60% 100%); }
.scheme-ocean .scheme-swatch { background: linear-gradient(90deg, #f3f9fd 0 60%, #3fa7e0 60% 100%); }
.scheme-berry .scheme-swatch { background: linear-gradient(90deg, #fff5f8 0 60%, #e8679a 60% 100%); }
/* Your own: painted inline from the saved theme; dashed until there is one. */
.scheme-custom:disabled .scheme-swatch { background: none; border: 1px dashed var(--border-strong); }
.theme-warning { margin-top: 8px; }

/* Each preview box carries the derived tokens as inline custom properties. */
.theme-fields { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; margin: 10px 0; }
.theme-wheel-fields { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
.colour-field { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.colour-field-label { font-size: 14px; color: var(--ink-soft); }
.colour-field-inputs { flex-wrap: nowrap; }
.colour-picker { width: 44px; height: 36px; padding: 2px; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); background: var(--bg-raised); flex: none; }
input.colour-hex { width: 100%; min-width: 0; max-width: 110px; font-family: var(--mono); font-size: 15px; }
.theme-previews { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 10px; margin: 10px 0; }
.theme-preview { background: var(--bg); color: var(--ink); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px; }
.theme-preview[hidden] { display: none; }
.theme-preview-caption { margin: 0 0 8px; font-weight: 600; }
.theme-preview-row { align-items: center; flex-wrap: wrap; }
.theme-preview-sample { background: var(--bg-raised); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 10px; flex: 1; min-width: 150px; }
.theme-preview-sample p { margin: 0 0 6px; }
.theme-moved { margin: 8px 0 0; }
.theme-problems { margin: 6px 0 10px; padding-left: 18px; }
.theme-problems[hidden] { display: none; }
/* A wheel's own palette in the editor. */
.palette-fields { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 8px; margin: 0 0 12px; }
.palette-fields[hidden] { display: none; }
.palette-problems { margin: 0 0 12px; padding-left: 18px; }

.animate-toggle { font-size: 14px; }
.feel-card .feel-section { margin-top: 8px; }

.link-dialog input[type="text"] { font-family: var(--mono); font-size: 12px; }
.warning {
  color: var(--warn);
  background: var(--bg-sunken);
  border-left: 3px solid var(--warn);
  padding: 8px 10px;
  border-radius: var(--radius-sm);
  font-size: 14px;
}

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

dialog {
  border: 1px solid var(--border); border-radius: var(--radius); background: var(--bg-raised);
  color: var(--ink); box-shadow: var(--shadow); padding: var(--pad); max-width: min(560px, 92vw);
}
dialog::backdrop { background: rgba(0, 0, 0, 0.35); }

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; }
}

/* ---- Orangey the mascot --------------------------------------------------- */
.mascot { display: block; width: 100%; height: 100%; }
.mascot-svg { display: block; width: 100%; height: 100%; overflow: visible; }
.mascot-svg .l { fill: none; stroke: #253122; stroke-width: 1.35; stroke-linecap: round; stroke-miterlimit: 10; }
.mascot-svg .d { fill: #253122; }
.mascot-svg .body, .logo-svg .body { fill: #f3a257; }
.mascot-svg .stem, .logo-svg .stem { fill: #a49533; }
.mascot-svg .eye, .logo-svg .eye { fill: #f5ecc2; }
/* The mark in the top bar: the same artwork, standing still. */
.logo-svg { display: block; width: 100%; height: 100%; }
.mascot-svg .mouth { fill: #f48067; }
.mascot-svg .arm, .mascot-svg .mouth, .mascot-svg .eyeLopen, .mascot-svg .eyeLsquint { opacity: 0; transition: opacity 90ms linear; }
.mascot-svg[data-pose="neutral"] .armE, .mascot-svg[data-pose="neutral"] .armF, .mascot-svg[data-pose="neutral"] .mIdle,
.mascot-svg[data-pose="surprised"] .armA, .mascot-svg[data-pose="surprised"] .armB, .mascot-svg[data-pose="surprised"] .mO,
.mascot-svg[data-pose="oops"] .armC, .mascot-svg[data-pose="oops"] .armD, .mascot-svg[data-pose="oops"] .mW, .mascot-svg[data-pose="oops"] .eyeLsquint,
.mascot-svg[data-pose="happy"] .armG, .mascot-svg[data-pose="happy"] .armH, .mascot-svg[data-pose="happy"] .mHappy,
.mascot-svg[data-pose="anticipate"] .armI, .mascot-svg[data-pose="anticipate"] .armJ, .mascot-svg[data-pose="anticipate"] .mAnt { opacity: 1; }
.mascot-svg[data-pose]:not([data-pose="oops"]) .eyeLopen { opacity: 1; }
.mascot-svg .lid { transform-box: fill-box; transform-origin: 50% 50%; }
.mascot-svg.blinking .lid { animation: mascot-blink 5.4s infinite; }
@keyframes mascot-blink { 0%, 93%, 100% { transform: scaleY(1); } 95.5% { transform: scaleY(0.06); } 98% { transform: scaleY(1); } }
@media (prefers-reduced-motion: reduce) { .mascot-svg.blinking .lid { animation: none; } }

.mascot-preview { width: 150px; height: 150px; flex: none; }
.mascot-preview-row { align-items: center; gap: 18px; }
.mascot-preview-controls { display: flex; flex-direction: column; gap: 8px; }
.mascot-rules { display: grid; gap: 6px; }
.row.wrap { flex-wrap: wrap; }

.result-panel { position: relative; }
.mascot-slot { position: absolute; left: 6px; bottom: 0; width: 88px; height: 88px; pointer-events: none; }
.mascot-slot-inline { position: static; width: 72px; height: 72px; }
.mascot-host { opacity: 0; transition: opacity 180ms ease; }
.mascot-host.is-visible { opacity: 1; }
body.presenting .mascot-slot { left: auto; right: 24px; bottom: 24px; width: 120px; height: 120px; }
@media (prefers-reduced-motion: reduce) { .mascot-host { transition: none; } }

/* ---- a roll struck through ------------------------------------------------ */
.history-list li.struck .when,
.history-list li.struck .what { text-decoration: line-through; }
.history-list li.struck .name,
.history-list li.struck .detail { color: var(--ink-faint); }

/* ---- pictures on outcomes ------------------------------------------------- */

.result-picture {
  display: block; margin: 0 auto 6px; max-width: 100%; max-height: 18vh;
  border-radius: var(--radius); object-fit: contain;
}
body.presenting .result-picture { max-height: 40vh; }
.cell .result-picture { max-height: 22vh; }
.picture-cell { display: inline-flex; align-items: center; gap: 4px; }
.picture-thumb { width: 34px; height: 34px; object-fit: cover; border-radius: 4px; cursor: pointer; border: 1px solid var(--border); }
.picture-col { white-space: nowrap; }
.goes-to-cell { white-space: nowrap; }
/* The description column gives way first, but never to nothing. */
.outcomes .desc-cell input { min-width: 130px; }
.outcomes th, .outcomes .goes-to-cell, .outcomes .picture-col { white-space: nowrap; }

/* ---- boards --------------------------------------------------------------- */

.board-grid {
  display: grid; gap: var(--gap);
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  margin-bottom: var(--gap);
}
.board-grid.board-empty { display: none; }
.cell-holder { position: relative; border: 1px solid var(--border); border-radius: var(--radius); padding: 10px; background: var(--bg-raised); }
/* Equal-height cells with Roll at the bottom, so buttons line up across a row. */
.board-grid > .cell-holder, .board-grid > .chain-link.board-chain { display: flex; flex-direction: column; }
.board-grid > .cell-holder > .cell, .board-grid > .chain-link.board-chain > .cell { flex: 1 0 auto; }
.board-grid .cell-roll, .board-grid .chain-roll { margin-top: auto; }
.cell-holder.dragging { opacity: 0.5; }
.cell-name { font-size: 16px; margin: 0 0 6px; }
.cell-stage { display: grid; place-items: center; min-height: 120px; }
.cell-stage > .outcome-list { width: 100%; align-self: stretch; max-height: 240px; }
.cell-remove { position: absolute; top: 6px; right: 6px; padding: 2px 8px; line-height: 1; }
/* A cell's ✕ shows only while editing; a chain's ✕ always stays. */
.board:not(.board-editing) .cell-holder > .cell-remove { display: none; }
.board-editing .cell-holder { cursor: grab; }
.cell-missing { color: var(--ink-soft); }
.cell-roll { width: 100%; margin-top: 8px; }
.board-grid > .cell-holder > .cell, .board-grid > .chain-link.board-chain > .cell { margin-bottom: 8px; }
.board-grid > .chain-link.board-chain { position: relative; margin: 0; padding: 10px; box-shadow: none; border-style: dashed; }
.cell .result-slot { font-size: clamp(20px, 3.4vw, 34px); min-height: 0; }
.cell .result-slot.small { font-size: clamp(16px, 2.6vw, 26px); }
.cell .result-detail { font-size: 12px; }
.cell .result-panel { padding: 0; }
body.presenting .cell .result-slot { font-size: clamp(24px, 4vw, 54px); }

/* ---- choosing a randomizer ------------------------------------------------ */

.picker-dialog { border: 1px solid var(--border); border-radius: var(--radius); padding: var(--gap); width: min(520px, 92vw); }
.picker-dialog::backdrop { background: rgba(0, 0, 0, 0.35); }
.picker-dialog h2 { margin-top: 0; }
.picker-new { flex-wrap: wrap; margin-bottom: 8px; }
.picker-tree { max-height: 46vh; overflow-y: auto; border: 1px solid var(--border); border-radius: var(--radius-sm); margin: 8px 0; padding: 4px; display: grid; gap: 2px; }
.picker-row { width: 100%; text-align: left; justify-content: flex-start; }
.picker-taken { opacity: 0.45; }
.picker-chosen, .picker-chosen:hover { background: var(--accent-soft); box-shadow: inset 3px 0 0 var(--accent); font-weight: 600; }
.picker-chosen-note { font-size: 13px; margin: 0 0 8px; }
.picker-add[hidden] { display: none; }
.picker-note:empty { display: none; }
.goes-to { flex-wrap: nowrap; }
.goes-to-button { max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.goes-to-button.missing { color: var(--error); }

.board-picker { border: 1px solid var(--border); border-radius: var(--radius); padding: var(--gap); max-width: 420px; }
.board-picker::backdrop { background: rgba(0, 0, 0, 0.35); }
.picker-list { list-style: none; margin: 0 0 var(--gap); padding: 0; display: grid; gap: 4px; max-height: 50vh; overflow-y: auto; }
.picker-choice { width: 100%; text-align: left; }

/* Full screen: cells shrink to fit rather than pushing Roll off the bottom. */
body.presenting .board .home-bar,
body.presenting .board .cell-remove { display: none; }
body.presenting .board-quickbar,
body.presenting .temp-head .temp-save,
body.presenting .temp-editor { display: none; }

/* Temporary cells, beside the board's own; closing one does not change the board. */
.board-quickbar { margin: 4px 0 10px; }
input.board-dice { width: 140px; }
.cell-temp { border-style: dashed; border-color: var(--border-strong); }
.board-grid > .cell-temp > .temp-body { flex: 1 0 auto; }
.board-grid > .cell-temp > .temp-roll { margin-top: auto; }
.board-grid > .cell-temp > .temp-body > .cell { margin-bottom: 8px; }
.temp-head { margin: -4px 0 4px; }
.temp-head .temp-close, .temp-head .temp-save { padding: 2px 8px; line-height: 1.2; }
.temp-editor { margin-bottom: 6px; }
.temp-editor summary { cursor: pointer; }
.temp-editor .quick-options { min-height: 4.5em; margin: 4px 0; }
.temp-empty { text-align: center; margin: 24px 0; }
/* Full screen the page is a flex row: without flex: 1 a board shrinks to its content. */
body.presenting .board { flex: 1; min-width: 0; min-height: 0; display: flex; flex-direction: column; }
body.presenting .board-card {
  flex: 1;
  min-height: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  display: flex;
  flex-direction: column;
  padding: clamp(12px, 3vw, 40px);
}
body.presenting .board > .board-card ~ .card { display: none; }
body.presenting .board-grid { flex: 1; min-height: 0; overflow: auto; }

/* ---- an outcome that opens another randomizer -----------------------------
   The chain's elements are siblings of the play card, not a box around it,
   because the full-screen rules above target `.play > .card`. */

.play.has-chain {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: var(--gap);
  align-items: start;
}
.play.has-chain > * { grid-column: 1 / -1; }
.play.has-chain > .play-card { grid-column: 1; }
.play.has-chain > .chain-open { grid-column: 2; }
/* The root has become an icon, so there is no first column to sit beside. */
.play.has-chain.chain-wide > .chain-open { grid-column: 1 / -1; }
@media (max-width: 720px) { .play.has-chain { display: block; } }

.chain-open { display: flex; gap: var(--gap); align-items: start; }
.chain-open > * { flex: 1 1 0; min-width: 0; }
.chain-link {
  background: var(--bg-raised);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: var(--pad);
  box-shadow: var(--shadow);
  margin-bottom: var(--gap);
}
.chain-from { margin: 0 0 6px; }
.chain-link .cell-name { margin-top: 0; }
.chain-roll { width: 100%; min-height: 44px; margin-top: 8px; }
.chain-note { margin: 0 0 var(--gap); }

.chain-strip { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: var(--gap); }
/* An empty strip would still show its margin as a band. */
.chain-strip:empty { display: none; }
.chain-icon { display: flex; align-items: baseline; gap: 8px; max-width: 240px; }
.chain-icon-name { font-weight: 600; }
.chain-icon-answer { color: var(--ink-faint); font-size: 14px; }
.chain-icon-name,
.chain-icon-answer { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* The one-time Add to Home Screen notice on an iPhone or iPad in a tab. */
.home-screen-notice { margin: 8px var(--gap) 0; padding: 10px 14px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--bg-raised); }
.home-screen-notice p { margin: 0 0 8px; }

/* ---- type -----------------------------------------------------------------
   Arapey has no bold, so large text turns off the browser's faked bold; small
   interface text keeps it, where it reads as emphasis. */
h1, h2, h3, .brand, .board-name, .cell-name,
.result-panel:not(.is-dice) .result-value {
  font-synthesis: none;
}
.die, .die-value, .result-panel.is-dice .result-value {
  font-family: var(--font-dice);
  font-synthesis: none;
}
.wheel-label { font-family: var(--font-ui); }

/* ---- the pop-out window (popout.ts) --------------------------------------- */

body.popout {
  height: auto;
  min-height: 100vh;
  box-sizing: border-box;
  padding: 10px 12px 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.popout-title { font-size: 14px; font-weight: 400; margin: 0; color: var(--ink-soft); }
.popout-grid {
  flex: 1;
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  align-content: start;
}
.popout-slot { display: flex; flex-direction: column; min-width: 0; }
.popout-board .popout-slot { border: 1px solid var(--border); border-radius: var(--radius); padding: 8px 10px 10px; background: var(--bg-raised); }
/* Inside a slot a chain's own frame would be a box in a box. */
.popout-slot .chain-link { border: 0; box-shadow: none; padding: 0; margin: 0; background: none; }
.popout-back { align-self: flex-start; padding: 2px 8px; margin-bottom: 4px; }
.popout-slot button.popout-next { display: block; margin: 6px auto 2px; border: 1px solid var(--accent); color: var(--ink); }
.popout-note:empty { display: none; }
/* The rules above set display, which would otherwise override hidden. */
.popout-slot button[hidden] { display: none; }
.cell.click-to-roll { cursor: pointer; border-radius: var(--radius-sm); }
.cell.click-to-roll:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
.popout-roll-all { width: 100%; min-height: 48px; flex: none; }

/* One randomizer: each box down to the stage takes the leftover height. */
body.popout-single { height: 100vh; min-height: 0; }
.popout-single .popout-grid,
.popout-single .popout-slot,
.popout-single .popout-body,
.popout-single .popout-root,
.popout-single .popout-body > .chain-link,
.popout-single .cell {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
/* A size container: the wheel fits the smaller of its width and height. */
.popout-single .cell-stage { flex: 1 1 0; min-height: 0; min-width: 0; container-type: size; display: grid; place-items: center; }
.popout-single .wheel-wrap { padding: 0; }
.popout-single .wheel-holder { width: min(100cqw, 100cqh); max-width: none; }
.popout-single .cell-stage > .outcome-list { max-height: 100cqh; }
.popout-single .result-panel { flex: none; }
.popout-single .cell .result-slot { font-size: clamp(22px, min(10vw, 8vh), 80px); }
/* The window's title names it; a randomizer a chain swapped in names itself. */
.popout-single .popout-root .cell-name { display: none; }
/* Flat dice and the coin scale with the stage; wireframe canvases have a fixed size. */
.popout-single .dice-tray { --die: clamp(46px, min(24cqw, 36cqh), 140px); gap: calc(var(--die) * 0.22); }
.popout-single .die {
  width: var(--die);
  height: var(--die);
  border-radius: calc(var(--die) * 0.2);
  font-size: calc(var(--die) * 0.4);
}
/* Room above the coin for its toss (up to 0.6 of its size), inside the stage. */
.popout-single .coin-wrap { --coin: clamp(96px, min(50cqw, 45cqh), 280px); padding-top: calc(var(--coin) * 0.6); }
.popout-single .coin {
  width: var(--coin);
  height: var(--coin);
  font-size: calc(var(--coin) * 0.16);
}

/* ---- inkblot -------------------------------------------------------------- */

/* The card is paper in every theme: the ink is drawn for paper, and a saved
   picture should look the same as the one on screen. */
.inkblot-wrap { display: flex; flex-direction: column; align-items: center; gap: 6px; width: 100%; }
.inkblot-card {
  width: min(100%, 640px);
  aspect-ratio: 1.3 / 1;
  background: #fbf8f1;
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow);
  overflow: hidden;
  display: grid;
  place-items: center;
}
.inkblot-canvas, .inkblot-picture { grid-area: 1 / 1; width: 100%; height: 100%; display: block; }
.inkblot-empty { grid-area: 1 / 1; margin: 0; color: #8a8378; font-size: 15px; }
.inkblot-canvas[hidden], .inkblot-picture[hidden], .inkblot-empty[hidden] { display: none; }
.inkblot-download[hidden] { display: none; }
.inkblot-download { font-size: 20px; line-height: 1; }
.cell .inkblot-card { width: 100%; }
/* The blot is the answer: the result panel stays for the screen reader only. */
.result-panel.is-inkblot { min-height: 0; padding: 0; }
.result-panel.is-inkblot > :not([role="status"]) { display: none; }
.hidden-toggle[hidden] { display: none; }
/* Generate is a link under the blot, not a big button over it. */
.roll-button.generate, .cell-roll.generate {
  background: none;
  border: none;
  box-shadow: none;
  color: var(--ink-soft);
  text-decoration: underline;
  text-underline-offset: 3px;
  width: auto !important;
  min-height: 0 !important;
  font-size: 17px !important;
  display: block;
  margin: 0 auto;
  padding: 6px 12px;
}
.roll-button.generate:hover, .cell-roll.generate:hover { color: var(--ink); }
body.presenting .inkblot-wrap { height: 100%; min-height: 0; }
body.presenting .inkblot-card { width: auto; height: 100%; max-width: 100%; min-height: 0; }
.popout-single .inkblot-card { width: min(100cqw, calc(100cqh * 1.3)); }

/* Packs: the badge on an installed pack's folder, its credit, the publish form. */
.pack-badge { font-size: 11px; padding: 1px 6px; border-radius: 999px; background: var(--accent-soft); color: var(--ink); white-space: nowrap; }
.pack-credit { color: var(--ink-faint); font-size: 14px; margin: 2px 0 0; }
.pack-credit a { color: inherit; }
.pack-description { white-space: pre-line; }
.pack-dialog { max-width: 34rem; }
.pack-dialog form { display: grid; gap: 10px; }
.pack-dialog textarea { width: 100%; font: inherit; }
.pack-dialog .check { display: flex; gap: 6px; align-items: flex-start; font-size: 14px; }
.form-problem { color: var(--danger, #b3261e); font-size: 14px; margin: 0; }
.install-pack .warning { color: var(--danger, #b3261e); }

/* Typing {@ in an outcome: the tables to roll there. */
.ref-picker { position: fixed; z-index: 50; margin: 0; padding: 4px; list-style: none; background: var(--bg-raised); border: 1px solid var(--line, #ccc); border-radius: 8px; box-shadow: 0 6px 20px rgba(0,0,0,.15); max-height: 260px; overflow: auto; }
.ref-picker li { display: flex; justify-content: space-between; gap: 12px; padding: 6px 8px; border-radius: 6px; cursor: pointer; }
.ref-picker li.active, .ref-picker li:hover { background: var(--accent-soft); }
.ref-picker .ref-folder { color: var(--ink-faint); font-size: 13px; }