/* 置宝账簿 / SMOKED CHARCOAL GLASS — translucent base only; layout and jewel accents unchanged.
   Structural layout and all behavior are deliberately inherited from style.css. */
:root {
  color-scheme:dark;
  --ink:#f0eee8;
  --muted:#b0b4b4;
  --cream:#30302f;
  --paper:#363837;
  --yellow:#23465b;
  --pink:#c76b5d;
  --pink-bg:#443233;
  --mint:#1a3739;
  --line:#737473;
  --shadow:#232423;
  --white:#383a39;
  --border:1px solid rgba(181,176,164,.32);
  --satin:#d3c7b3;
  --shell-dark:#171819;
  --jewel-blue:#18374f;
  --jewel-cobalt:#285779;
  --jewel-teal:#28666d;
  --jewel-red:#b0493e;
  font-family:"Noto Serif SC","Songti SC","STSong","SimSun","AR PL SungtiL GB",serif;
  color:var(--ink);
}
html {background:#272827;}
body {
  color:var(--ink);
  /* The charcoal canvas below the translucent app layer, with a restrained mineral sheen. */
  background-color:#272827;
  background-image:
    radial-gradient(ellipse at 5% 12%,rgba(87,108,111,.22),transparent 52%),
    radial-gradient(ellipse at 90% 78%,rgba(127,88,73,.15),transparent 49%),
    repeating-linear-gradient(128deg,rgba(214,203,180,.016) 0 1px,transparent 1px 10px),
    radial-gradient(rgba(216,207,183,.05) .5px,transparent .95px);
  background-size:auto,auto,auto,26px 26px;
}
.shell {
  /* Opacity affects only the backdrop, never the content or controls. */
  background-color:rgba(48,48,47,.81);
  background-image:
    radial-gradient(ellipse at 60% -9%,rgba(121,116,105,.09),transparent 43%),
    radial-gradient(ellipse at 92% 88%,rgba(18,18,18,.07),transparent 56%),
    repeating-linear-gradient(139deg,transparent 0 9px,rgba(222,212,189,.009) 10px 10.8px,transparent 12px 24px),
    radial-gradient(rgba(228,221,202,.037) .45px,transparent .75px);
  background-size:auto,auto,auto,25px 25px;
  box-shadow:0 0 45px #16161635;
  -webkit-backdrop-filter:blur(5px);
  backdrop-filter:blur(5px);
}
button,input,select,textarea {font-family:inherit;}
.topbar {
  background:linear-gradient(125deg,#333433 0%,#303130 55%,#313536 100%);
  border-bottom:1px solid rgba(198,184,166,.27);
}
.brandmark {
  color:#e6c9a2;
  border:1px solid rgba(187,159,126,.65);
  background:radial-gradient(circle at 28% 22%,#275a69 0%,#162d40 42%,#191a1b 85%);
  box-shadow:inset 0 0 0 3px #151719,0 0 0 1px #0d1113,0 5px 18px #0005;
  text-shadow:0 0 11px #d18c5557;
  font-family:Georgia,serif;
}
.top-title strong,.page-heading h1,.section-row h2,.month-row strong,.modal-head h2,.book-title {
  font-family:"Noto Serif SC","Songti SC","STSong","SimSun","AR PL SungtiL GB",serif;
  color:#f4f0e9;
  font-weight:600;
  letter-spacing:1.1px;
}
.top-title strong {font-size:25px;letter-spacing:2px;}
.eyebrow {
  font-family:"Cormorant Garamond","Baskerville","Palatino Linotype",Georgia,serif;
  color:#c8b69e;
  font-weight:500;
  letter-spacing:3px;
  font-size:12px;
}
.page-heading h1 {font-size:25px;}
.subheading,.muted,.tx-sub {color:#aab5bc;}
.icon-btn {
  background:#383a39;
  border:1px solid #777a78;
  color:#dcd6ca;
  box-shadow:inset 0 1px 0 #ffffff14;
}
.icon-btn:hover,.button:hover{border-color:#bdac91;}
.bottom-nav {
  background:linear-gradient(180deg,#333534,#2d2e2e);
  border-top:1px solid rgba(176,165,147,.36);
  box-shadow:0 -7px 24px #07080975;
}
.nav-item {color:#aaa9a5;font-weight:550;}
.nav-item.active {
  background:linear-gradient(130deg,#21465f,#152c3d);
  box-shadow:inset 0 0 0 1px rgba(149,182,197,.42),0 2px 8px #0005;
  color:#f2ede5;
}
.nav-item.active .nav-icon {color:#d7bd9c;}
.button {
  background:linear-gradient(160deg,#3b3d3c,#323433);
  border:1px solid #696b6b;
  color:#ede7dc;
  box-shadow:0 2px 0 #0a0a0b;
  font-weight:650;
}
.button.primary {
  background:linear-gradient(150deg,#27616d,#1d4759);
  border-color:#588a90;
  color:#fff1dd;
}
.button.pink {
  background:linear-gradient(155deg,#b04c40,#903b36);
  border-color:#ca8074;
  color:#fff3e7;
}
.button.soft {background:#403134;border-color:#91625e;color:#f0c0b5;}
.button.text {color:#c9a58c;box-shadow:none;}
.button.danger {color:#e6a09a;}
.card {
  background:linear-gradient(140deg,#393b3b,#343635 68%,#353736);
  border:1px solid rgba(175,168,150,.36);
  box-shadow:inset 0 1px 0 #fbf3dc0b,0 3px 0 #242524,0 10px 20px #0003;
}
.soft-card {background:#373b3c;border:1px solid #626966;color:#dedbd4;}
.hero-main {
  background:radial-gradient(ellipse at 98% -6%,rgba(54,107,137,.25),transparent 55%),linear-gradient(150deg,#172a39,#111e29 75%);
  border-color:#627887;
  position:relative;
}
.hero-main::before {
  content:"";
  position:absolute;top:9px;right:9px;width:7px;height:7px;border-radius:50%;
  background:#b34c41;box-shadow:0 0 0 2px #74443e,0 0 10px #9e3b3840;
  pointer-events:none;
}
.big-amount {
  font-family:"Cormorant Garamond","Baskerville","Palatino Linotype",Georgia,serif;
  font-weight:500;
  font-size:clamp(31px,5.2vw,43px);
  letter-spacing:1px;
  color:#e4d7c5;
  text-shadow:none;
}
.money-secondary {color:#b9bdbe;}
.hero-sum {border-top:1px solid rgba(178,166,151,.3);color:#c6c4bf;}
.small-stat {
  background:radial-gradient(circle at 90% -20%,rgba(41,92,105,.16),transparent 65%),linear-gradient(140deg,#383c3c,#313737);
  border-color:#6b7675;
}
.small-stat .number {font-family:"Cormorant Garamond",Georgia,serif;font-size:32px;color:#efe9de;font-weight:500;}
.small-stat .label {color:#b7c4c4;}
.select,.input,textarea,input,select {background-color:#373a39;color:#f1eee9;border-color:#666865;}
.input::placeholder,textarea::placeholder {color:#a7a5a0;opacity:1;}
input[type="checkbox"],input[type="radio"] {accent-color:#ae6751;}
select option,select optgroup {background-color:#333635;color:#f3eee6;}
.field label {color:#d8d5cd;font-weight:600;}
.field-note {color:#acaaa6;}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible {outline-color:#d2b292;}
.pill {background:#343736;color:#c7c8c5;border:1px solid #696b69;font-weight:600;}
.pill.selected {background:#253c4c;color:#f0e5d4;border-color:#718b99;}
.datehead {color:#b7a58b;font-weight:650;}
.transaction {
  background:linear-gradient(125deg,#3d403f,#383b3a);
  border:1px solid #666b6c;
  color:#f1ede6;
  box-shadow:inset 0 1px 0 #ffffff07;
}
.transaction:hover {border-color:#a5a6a0;background:#444748;}
.category-icon {
  background:radial-gradient(circle at 30% 20%,#345461,#223740 58%,#21292e 100%);
  border:1px solid #8b999b;
  box-shadow:inset 0 1px 4px #ffffff15;
}
.tx-title,.tx-amount {color:#f0eee8;font-weight:650;}
.tx-amount,.rank-amount,.summary-tile .value {font-family:"Baskerville","Palatino Linotype",Georgia,serif;font-weight:600;}
.tx-meta {color:#c6a68e;}
.merchant-logo,.merchant-icon {background:#e1dfd9;border-color:#a6a6a0;color:#203b4a;}
.empty {background:#353736;border-color:#5b5d5b;color:#bbbcb8;}
.empty strong {color:#f0eee8;}
.summary-tile {background:#383b3a;border-color:#666b6b;}
.summary-tile .value {color:#f1ece4;}
.summary-tile .caption {color:#bbb8b1;}
.tabs {background:#2c2d2d;border:1px solid #4a4c4d;}
.tab {color:#bbb8b4;font-weight:600;}
.tab.active {background:linear-gradient(140deg,#26475c,#203643);color:#e9ddca;box-shadow:inset 0 0 0 1px #718b984a;}
.calendar-week {color:#c0bdb8;}
.day {border-color:#595d5b;background:#3a3b3a;color:#ede8e2;}
.day small {color:#d3a78e;}
.day.today {border-color:#bb8064;}
.day.selected {background:#514043;border-color:#ae6656;}
.day.blank {background:transparent;border-color:transparent;}
.rank-sub,.rank-text .muted {color:#aeb6b9;}
.progress {background:#353938;}
.progress>span {background:linear-gradient(90deg,#23586a,#34778c);}
.chart-bars {border-color:#686962;}
.chart-bar {background:linear-gradient(#946458,#653c3a);}
.chart-bar:nth-child(3n) {background:linear-gradient(#316779,#234a5e);}
.chart-bar:hover::after {background:#3c3d3c;color:#f1eee7;border:1px solid #8e8c86;}
.chart-axis {color:#b4b6b6;}
.notice {background:#433c37;border-color:#786956;color:#e2d1b8;}
.notice.warn {background:#4b3231;border-color:#ad7167;color:#f1c7b5;}
.product-card {background:linear-gradient(140deg,#3b3f3e,#333636);border-color:#676d70;}
.product-card .secondary-line {color:#b6c1c5;}
.badge {background:#513532;color:#f3c5ac;}
.badge.green {background:#24413b;color:#c2ded1;}
.badge.gold {background:#514337;color:#e6d3ae;}
.line-row {background:#3c3f3e;border-color:#636969;}
.overlay {background:#070708e8;}
.modal {background:radial-gradient(circle at 93% 0%,#29445020,transparent 40%),#343635;border:1px solid #7b7770;box-shadow:0 -15px 40px #000a;}
.modal-head {background:#343635;border-bottom-color:#696661;}
.modal-actions {border-top-color:#5e5c56;}
.receipt-preview img {border-color:#777772;background:#373938;}
.toggle input {accent-color:#aa6a55;}
.rating-actions .button[aria-pressed="true"] {background:#4c3634;border-color:#be8771;}
.product-detail-hero {background:#344043;border:1px solid #63757a;}
.product-detail-hero p {color:#bcc1c3;}
.loading {color:#bebdb7;}
.hr {border-top-color:#65645e;}
.book-tile {background:linear-gradient(140deg,#3c3f3d,#353836);border-color:#7b7a73;color:#f2e9dd;}
.book-meta {color:#bfc0bd;}
.price-table th,.price-table td {border-bottom-color:#5c5e5c;}
.price-table th {color:#bbb9b3;}
.donut>span {background:#383a39;color:#c4c1bb;}
.donut strong {color:#f3ede2;}
.group-legend>div span:last-child {color:#c3c2be;}
.toast {background:#344247;color:#f1ebdf;border:1px solid #7b9093;}
::selection {background:#6a3937;color:#fff9ef;}
@media(min-width:760px){.shell{border-left:1px solid #444543;border-right:1px solid #444543;}}
@media(max-width:410px){.top-title strong{font-size:23px;}.big-amount{font-size:31px;}}


/* EDGE JEWELS 2026-10-29 — small, feathered rim ornaments, never UI content. */
.shell {position:relative;isolation:isolate;}
.shell::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background-image:url("edge-left.webp"),url("edge-right.webp"),url("edge-top.webp");
  background-position:left top,right top,center top;
  background-repeat:no-repeat;
  /* Keep jewelry tiny; do not scale it up to fill the background. */
  background-size:clamp(26px,4.9vw,48px) min(1200px,100%),clamp(25px,4.6vw,46px) min(1200px,100%),100% 54px;
  opacity:.72;
}
.topbar,.main {position:relative;z-index:1;}
.topbar {background:linear-gradient(120deg,rgba(50,51,50,.82),rgba(49,50,50,.80));-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);}
/* Inner rows are translucent glass, not the headline cards or their text. */
.transaction {
  background:linear-gradient(120deg,rgba(65,72,75,.66),rgba(48,54,58,.59));
  border-color:rgba(172,178,178,.37);
  box-shadow:inset 0 1px rgba(241,235,219,.12),0 3px 10px rgba(10,14,17,.09);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
}
.transaction:hover {background:linear-gradient(120deg,rgba(77,84,86,.75),rgba(59,64,68,.68));}
.product-card {
  background:linear-gradient(120deg,rgba(68,72,74,.62),rgba(48,54,59,.54));
  border-color:rgba(171,178,179,.34);
  -webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);
}
.line-row {background:rgba(58,63,64,.78);}
@media(max-width:430px){
  .shell::before {background-size:30px min(1080px,100%),29px min(1080px,100%),100% 43px;opacity:.68;}
}
@media(prefers-reduced-transparency:reduce){
  .transaction,.product-card{background:#383c3e;-webkit-backdrop-filter:none;backdrop-filter:none;}
}
