/* RIENGOLD PRIVATE OFFICE の試作：共通の決まり
   書類（確実の一式・売り手への一枚・紹介者・報告書）は紙、りなさんの机は夜。
   数字と欧文の見出しは New York、和文は細いゴシック。真鍮は印と番号だけ。光らせない */
@font-face { font-family: RGNY; src: url(NewYork.ttf); }
:root {
  --paper: #F2EEE6; --paper2: #EAE4D8; --card: #F8F5EF;
  --ink: #17160F; --ink2: rgba(23,22,15,.64); --ink3: rgba(23,22,15,.42); --hair: rgba(23,22,15,.13); --hair2: rgba(23,22,15,.22);
  --brass: #8F7038; --brass2: #B08F55; --ok: #3E5F49; --warn: #8A4B3C;
  --night: #0A0B0E; --night2: #121318; --nink: #ECE6DA; --nink2: rgba(236,230,218,.64); --nink3: rgba(236,230,218,.40); --nhair: rgba(236,230,218,.12); --nbrass: #C9A96A;
  --serif: RGNY, "New York", ui-serif, Georgia, serif;
  --sans: -apple-system, "SF Pro Text", "Hiragino Sans", "Hiragino Kaku Gothic ProN", sans-serif;
  --ja: "Hiragino Sans", "Hiragino Kaku Gothic ProN", -apple-system, sans-serif;
  --mono: ui-monospace, "SF Mono", Menlo, monospace;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
body { font-family: var(--sans); color: var(--ink); background: var(--paper); font-weight: 400; }
body.night { background: var(--night); color: var(--nink); }
a { color: inherit; text-decoration: none; }
.num { font-family: var(--serif); font-variant-numeric: lining-nums tabular-nums; letter-spacing: .005em; }
.serif { font-family: var(--serif); }
.label { font: 500 10px/1.2 var(--sans); letter-spacing: .26em; text-transform: uppercase; color: var(--brass); }
.night .label { color: var(--nbrass); }
.mono { font-family: var(--mono); font-size: 11px; letter-spacing: .04em; }
.ja { font-family: var(--ja); font-weight: 300; }
.muted { color: var(--ink2); } .faint { color: var(--ink3); }
.night .muted { color: var(--nink2); } .night .faint { color: var(--nink3); }
.rule { height: 1px; background: var(--hair); border: 0; }
.night .rule { background: var(--nhair); }
.knot { width: 22px; height: 22px; object-fit: contain; }
.mark { display: inline-flex; align-items: center; gap: 10px; font: 500 11px var(--sans); letter-spacing: .34em; }
.chip { display: inline-flex; align-items: center; gap: 6px; font: 400 11.5px var(--sans); padding: 4px 9px; border: .7px solid var(--hair2); border-radius: 999px; color: var(--ink2); white-space: nowrap; }
.night .chip { border-color: rgba(236,230,218,.2); color: var(--nink2); }
.dot { width: 7px; height: 7px; border-radius: 50%; display: inline-block; flex: none; }
.dot.done { background: var(--ink); } .dot.ready { border: 1.2px solid var(--ink); } .dot.you { border: 1.4px solid var(--brass); box-shadow: inset 0 0 0 2px var(--paper); background: var(--brass); }
.night .dot.done { background: var(--nink); } .night .dot.ready { border-color: var(--nink); }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 44px; padding: 0 20px; border-radius: 999px; font: 500 13.5px var(--sans); letter-spacing: .02em; cursor: pointer; border: .7px solid var(--hair2); background: transparent; color: var(--ink); }
.btn.solid { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.night .btn { color: var(--nink); border-color: rgba(236,230,218,.25); }
.night .btn.solid { background: var(--nink); color: var(--night); border-color: var(--nink); }
.panel { background: var(--card); border: .7px solid var(--hair); border-radius: 14px; box-shadow: 0 1px 0 rgba(255,255,255,.7) inset, 0 1px 2px rgba(23,22,15,.04); }
.night .panel { background: var(--night2); border-color: var(--nhair); box-shadow: 0 1px 0 rgba(255,255,255,.04) inset; }
.sample { font: 400 11px var(--sans); color: var(--ink3); letter-spacing: .04em; }
.night .sample { color: var(--nink3); }
.photo { width: 100%; display: block; object-fit: cover; }
.toggle { display: inline-flex; border: .7px solid var(--hair2); border-radius: 999px; padding: 2px; }
.toggle button { border: 0; background: transparent; font: 500 11px var(--sans); letter-spacing: .08em; padding: 6px 11px; border-radius: 999px; color: var(--ink2); cursor: pointer; }
.toggle button.on { background: var(--ink); color: var(--paper); }