/* delvs.css — the Delv chip and the bank statement (2026-10-28, dev log #1442). They inherit the font and colour of the
   page they are mounted in (the terminal, Quarters, the world's top bar); only the shape and the money colours are here. */

.delv-chip { display: inline-flex; align-items: center; gap: .35em; padding: .25em .7em; border-radius: 999px;
    border: 1px solid rgba(201, 162, 39, .55); background: rgba(201, 162, 39, .12); color: inherit; font: inherit;
    text-decoration: none; cursor: pointer; white-space: nowrap; line-height: 1.2; }
.delv-chip:hover { background: rgba(201, 162, 39, .22); }
.delv-chip-icon { color: #c9a227; }
.delv-chip-amount { font-weight: 700; font-variant-numeric: tabular-nums; }
.delv-chip-unit { opacity: .75; font-size: .9em; }
.delv-bump { animation: delv-bump .6s ease-out; }
@keyframes delv-bump { 0% { color: #f0c94a; text-shadow: 0 0 8px rgba(240, 201, 74, .8); } 100% { color: inherit; text-shadow: none; } }

.delv-statement { font-variant-numeric: tabular-nums; text-align: left; }
.delv-statement-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: .75rem; flex-wrap: wrap; }
.delv-statement-title { font-size: 1.25rem; font-weight: 700; }
.delv-statement-rule { opacity: .75; font-size: .9em; }
.delv-statement-balance { text-align: right; }
.delv-statement-balance-label { display: block; opacity: .7; font-size: .8em; text-transform: uppercase; letter-spacing: .06em; }
.delv-statement-balance-amount { font-size: 1.5rem; font-weight: 700; }
.delv-statement-balance-amount, .delv-statement .delv-chip-icon { color: #c9a227; }
.delv-statement-table { width: 100%; border-collapse: collapse; font-size: .92em; }
.delv-statement-table th { text-align: left; font-weight: 600; opacity: .75; border-bottom: 1px solid rgba(127, 127, 127, .4); padding: .4rem .5rem; }
.delv-statement-table td { padding: .4rem .5rem; border-bottom: 1px solid rgba(127, 127, 127, .15); vertical-align: top; }
.delv-statement-table .num { text-align: right; white-space: nowrap; }
/* the money colours (2026-10-28, William: "I can barely read the green highlight"): dark and bold on light pages (the
   terminal parchment), light on dark ones (Quarters card: .delv-on-dark) */
.delv-statement .delv-in { color: #1b6a31; font-weight: 700; }
.delv-statement .delv-out { color: #9e1f1a; font-weight: 700; }
.delv-on-dark .delv-statement .delv-in { color: #a8f0b9; }
.delv-on-dark .delv-statement .delv-out { color: #ffaaa3; }
.delv-empty { text-align: center; opacity: .6; padding: 1rem; }
.delv-statement-foot { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-top: .6rem; opacity: .85; font-size: .9em; flex-wrap: wrap; }
.delv-statement-pager button { font: inherit; padding: .2em .7em; border-radius: 6px; border: 1px solid rgba(127, 127, 127, .5); background: transparent; color: inherit; cursor: pointer; }
.delv-statement-pager button:disabled { opacity: .35; cursor: default; }
@media (max-width: 560px) { .delv-statement-table th:nth-child(1), .delv-statement-table td:nth-child(1) { display: none; } }

/* NOT VERIFIED YET (2026-10-28, William: "how would the user know that they're not getting any delves"): the chip reads
   "Verify email" in amber instead of a bare 0; the statement opens with why and the email again; the world shows a small
   note once a day. */
.delv-chip-verify { display: none; }
.delv-chip--verify { border-color: rgba(230, 150, 40, .7); background: rgba(230, 150, 40, .16); }
.delv-chip--verify .delv-chip-amount, .delv-chip--verify .delv-chip-unit { display: none; }
.delv-chip--verify .delv-chip-verify { display: inline; color: #f0a63a; font-weight: 700; }
.delv-chip--verify .delv-chip-icon { color: #f0a63a; }

.delv-verify { border: 1px solid rgba(230, 150, 40, .55); background: rgba(230, 150, 40, .1); border-radius: 8px; padding: .8rem 1rem; margin-bottom: 1rem; text-align: left; }
.delv-verify--done { border-color: rgba(60, 160, 90, .55); background: rgba(60, 160, 90, .1); }
.delv-verify-title { font-weight: 700; margin-bottom: .25rem; }
.delv-verify p { margin: 0 0 .5rem; }
.delv-verify-actions { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; font-size: .92em; }
.delv-verify-actions button { font: inherit; padding: .3em .9em; border-radius: 6px; border: 1px solid rgba(230, 150, 40, .7); background: rgba(230, 150, 40, .2); color: inherit; cursor: pointer; font-weight: 600; }
.delv-verify-actions button:disabled { opacity: .5; cursor: default; }
.delv-verify-actions a { color: inherit; opacity: .8; }
.delv-verify-status { opacity: .85; }

.delv-nudge { position: fixed; top: 58px; left: 50%; transform: translateX(-50%); z-index: 60; display: flex; align-items: center; gap: .6rem; max-width: min(560px, calc(100vw - 32px));
    padding: 9px 10px 9px 14px; border-radius: 8px; border: 1px solid rgba(230, 150, 40, .6); background: rgba(14, 12, 8, .9);
    color: rgba(255, 255, 255, .9); font: 600 13px/1.35 'Segoe UI', system-ui, sans-serif; box-shadow: 0 6px 20px rgba(0, 0, 0, .35); transition: opacity .6s; }
.delv-nudge .delv-chip-icon { color: #f0a63a; }
.delv-nudge button { font: inherit; padding: 3px 10px; border-radius: 5px; border: 1px solid rgba(230, 150, 40, .6); background: rgba(230, 150, 40, .2); color: inherit; cursor: pointer; }
.delv-nudge [data-delv-nudge-close] { border: none; background: transparent; font-size: 16px; padding: 0 4px; opacity: .7; }
.delv-nudge--quiet { opacity: .55; }
.delv-nudge--quiet:hover { opacity: 1; }
/* the banner keeps its own layout inside a themed card (Quarters' card lays children out in a row and restyles links) */
.delv-verify, .delv-verify > .delv-verify-title, .delv-verify > p { display: block !important; width: auto !important; max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; text-align: left !important; float: none !important; }
.delv-verify > .delv-verify-actions { display: flex !important; justify-content: flex-start; }
.delv-verify-actions a, .delv-verify-actions a:visited { display: inline !important; color: inherit !important; text-decoration: underline !important; font-size: inherit; background: none; border: 0; padding: 0; height: auto; width: auto; }

/* a BATTLE line opens its breakdown (2026-10-28, PLAN.md §9) */
.delv-statement tr.delv-battle { cursor: pointer; }
.delv-statement tr.delv-battle:hover td { background: rgba(201, 162, 39, .1); }
.delv-battle-open { display: inline-block; transition: transform .15s; opacity: .7; }
.delv-statement tr.delv-battle.is-open .delv-battle-open { transform: rotate(90deg); }
.delv-bd { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 24px; padding: 6px 4px 10px 22px; font-size: .95em; }
.delv-bd-col > div { display: flex; justify-content: space-between; gap: 10px; }
.delv-bd-h { font-weight: 700; opacity: .8; margin-bottom: 2px; }
.delv-bd b { font-variant-numeric: tabular-nums; }
.delv-bd-total { border-top: 1px solid rgba(127, 127, 127, .35); margin-top: 3px; padding-top: 3px; font-weight: 700; }
@media (max-width: 560px) { .delv-bd { grid-template-columns: 1fr; padding-left: 4px; } }
/* the multiplication in columns (William, 2026-10-28): what · count · each · Delvs */
.delv-bd-col > .delv-bd-line { display: grid; grid-template-columns: 1fr 52px 44px 54px; gap: 8px; }
.delv-bd-line > span:nth-child(2), .delv-bd-line > span:nth-child(3) { text-align: right; opacity: .8; }
.delv-bd-line > b { text-align: right; }
.delv-bd-line.delv-bd-h > span:nth-child(n+2) { font-weight: 600; font-size: .85em; }