:root {
  --bg: #edf0eb;
  --surface: #f8faf6;
  --paper: #ffffff;
  --ink: #111a17;
  --muted: #65716c;
  --line: #d9dfda;
  --line-dark: #bdc8c1;
  --night: #0b1110;
  --night-2: #151e1b;
  --lime: #c8f44f;
  --lime-deep: #9dcb1e;
  --mint: #29d8b1;
  --mint-deep: #0d8c73;
  --violet: #7957ff;
  --orange: #ff8a50;
  --red: #e5483f;
  --blue: #2aabee;
  --shadow: 0 16px 44px rgba(17, 26, 23, .09);
  font-family: Inter, "Segoe UI", system-ui, -apple-system, sans-serif;
}

/* Dragon Gold pricing + cascade calculator */
.dg-coin { display: inline-grid; place-items: center; flex: 0 0 auto; width: 28px; height: 28px; color: #4a3100; background: radial-gradient(circle at 35% 30%, #fff2a6, #f4c24f 48%, #bd7914 100%); border: 2px solid #fff0a0; box-shadow: inset 0 0 0 2px rgba(102,62,0,.22), 0 3px 8px rgba(0,0,0,.16); border-radius: 50%; font-size: .48rem; font-weight: 1000; letter-spacing: -.03em; }
.dg-price { display: inline-flex; align-items: center; gap: 5px; color: var(--ink); white-space: nowrap; }
.dg-price small { color: var(--muted); font-size: .52rem; }
.dg-price strong { font-size: .8rem; }
.dg-simple { color: #77500a; background: #fff2c5; border: 1px solid #e2b944; padding: 5px 8px; font-size: .58rem; font-weight: 950; white-space: nowrap; }
.toolbar-price { display: flex; align-items: center; gap: 6px; }
.pricing-note, .research-price-rules { display: flex; align-items: center; gap: 10px; margin-top: 10px; padding: 10px 12px; color: var(--ink); background: #fff6d8; border-left: 4px solid #e0ad22; }
.pricing-note > div, .research-price-rules > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pricing-note strong, .research-price-rules strong { font-size: .72rem; }
.pricing-note small, .research-price-rules small { color: #725719; font-size: .58rem; line-height: 1.35; }
.inverse-price { color: #fff; background: #1c2723; border-color: #f4c24f; }
.inverse-price small { color: #b8c2be; }
.recommendation-ack { position: relative; display: grid; grid-template-columns: 24px minmax(0,1fr); align-items: start; gap: 9px; margin-top: 9px; padding: 10px; color: #602817; background: #fff0e9; border: 2px solid #f0825c; cursor: pointer; }
.recommendation-ack[hidden] { display: none; }
.recommendation-ack input { width: 21px; height: 21px; min-height: 0; margin: 0; accent-color: #d9532b; }
.recommendation-ack span { display: flex; flex-direction: column; gap: 3px; }
.recommendation-ack strong { font-size: .7rem; }
.recommendation-ack small { color: #854630; font-size: .57rem; line-height: 1.35; }
.dark-ack { color: #fff; background: #2a1b16; }
.dark-ack small { color: #e7a88f; }
.rune-detail-head { display: grid; grid-template-columns: minmax(0,1fr) minmax(120px,auto); align-items: start; gap: 12px; margin-bottom: 12px; }
.rune-detail-head .title { min-width: 0; overflow-wrap: anywhere; }
.rune-detail-price { justify-self: end; display: grid; grid-template-columns: 20px minmax(0,1fr); align-items: center; gap: 6px; max-width: 190px; padding: 7px 9px; color: #5d4107; background: #fff2c5; border-right: 4px solid #e0ad22; text-align: right; }
.rune-detail-price .rune-detail-coin { width: 20px; height: 20px; border-width: 1px; font-size: .34rem; }
.rune-detail-price strong { display: block; font-size: .64rem; line-height: 1.3; }
.dragon-card-head { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.dragon-card-price { color: #60420a; background: #fff2c5; padding: 3px 5px; font-size: .49rem; font-weight: 1000; }
.selected-price { display: grid; grid-template-columns: 30px auto; grid-template-rows: auto auto; align-items: center; gap: 0 7px; min-height: 58px; padding: 7px 9px; color: #fff; background: #202d28; border: 1px solid #49564f; }
.selected-price .dg-coin { grid-row: 1 / 3; }
.selected-price strong { font-size: 1.05rem; }
.selected-price small { color: #a8b3ae; font-size: .52rem; }
.chest-input-card { grid-template-columns: minmax(0,1fr) 150px 100px auto; }
.chest-reward.expandable { display: block; padding: 0; overflow: visible; }
.chest-reward-toggle { display: grid; grid-template-columns: 35px minmax(0,1fr) auto 18px; align-items: center; gap: 10px; width: 100%; min-height: 66px; padding: 10px 10px 10px 12px; color: var(--ink); background: transparent; border: 0; cursor: pointer; text-align: left; }
.chest-reward-arrow { color: var(--muted); font-size: .9rem; font-weight: 1000; transition: transform .15s ease; }
.chest-reward.open .chest-reward-arrow { transform: rotate(180deg); }
.chest-reward-details { padding: 0 10px 10px 12px; border-top: 1px solid var(--line); }
.chest-reward-details[hidden] { display: none; }
.cascade-opened { padding: 8px 0; }
.cascade-opened > small { color: var(--muted); font-size: .52rem; font-weight: 900; text-transform: uppercase; }
.cascade-opened > div { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 5px; }
.cascade-opened span { padding: 4px 6px; color: #44514c; background: #e8eee9; font-size: .52rem; }
.cascade-resource-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 4px; margin: 0; padding: 0; list-style: none; }
.cascade-resource-list li { display: flex; justify-content: space-between; gap: 8px; padding: 5px 6px; background: #fff; border: 1px solid var(--line); font-size: .53rem; }
.cascade-resource-list li span { overflow-wrap: anywhere; }
.cascade-resource-list li strong { white-space: nowrap; }
.cascade-unresolved { margin-top: 7px; padding-top: 7px; border-top: 1px dashed var(--line-dark); }
.cascade-unresolved > small { display: block; margin-bottom: 5px; color: #855d0e; font-size: .5rem; font-weight: 900; }
.chest-cascade-summary { margin-top: 14px; padding: 14px; color: #fff; background: var(--night); border-top: 4px solid #f4c24f; }
.cascade-summary-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.cascade-summary-head small { color: #f4c24f; font-size: .54rem; font-weight: 950; letter-spacing: .12em; }
.cascade-summary-head h3 { margin: 3px 0 0; font-size: 1rem; }
.cascade-summary-head > span { padding: 5px 8px; color: var(--night); background: #f4c24f; font-size: .58rem; font-weight: 950; }
.cascade-chest-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 5px; margin-top: 11px; }
.cascade-chest-total { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 2px 7px; padding: 8px; background: #19231f; border: 1px solid #34413c; }
.cascade-chest-total span { font-size: .6rem; font-weight: 850; }
.cascade-chest-total strong { grid-row: 1 / 3; grid-column: 2; align-self: center; color: var(--lime); font-size: .84rem; }
.cascade-chest-total small { color: #8d9994; font-size: .49rem; }
.cascade-summary-section { margin-top: 12px; }
.cascade-summary-section h4 { margin: 0 0 6px; color: #d9e2de; font-size: .66rem; text-transform: uppercase; letter-spacing: .06em; }
.cascade-resource-list.final li { color: #dce4e0; background: #111916; border-color: #34413c; }
.cascade-summary-section.unresolved { padding: 9px; color: #33250c; background: #fff2c5; }
.cascade-summary-section.unresolved h4 { color: #5f430d; }
.cascade-summary-section.unresolved p { margin: 0 0 7px; color: #725719; font-size: .54rem; line-height: 1.35; }
.cascade-summary-section.unresolved .cascade-resource-list li { color: #33250c; background: #fffaf0; border-color: #e6c46c; }
.cart-line-price { color: #60420a; background: #fff2c5; padding: 4px 6px; font-size: .56rem; font-weight: 1000; white-space: nowrap; }
.cart-total { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 11px; padding: 11px 12px; color: #fff; background: #18231f; border: 1px solid #394740; }
.cart-total > span { color: #a7b2ad; font-size: .66rem; font-weight: 900; text-transform: uppercase; letter-spacing: .08em; }
.cart-total strong { display: flex; align-items: center; gap: 7px; }
.cart-total b { color: var(--lime); font-size: 1.25rem; }
.discount-panel { margin-top: 11px; padding: 11px; color: #dce5e1; background: #101916; border: 1px solid #3b4843; border-left: 4px solid var(--violet); }
.request-identity-panel { display: grid; gap: 5px; margin-top: 11px; padding: 11px; color: #dce5e1; background: #101916; border: 1px solid #3b4843; border-left: 4px solid var(--lime); }
.request-identity-panel label { display: grid; gap: 6px; }
.request-identity-panel label > span { color: #fff; font-size: .7rem; font-weight: 900; }
.request-identity-panel em { color: var(--lime); font-style: normal; }
.request-identity-panel input { width: 100%; min-height: 40px; padding: 8px 10px; color: #fff; background: #202c27; border: 1px solid #4b5a54; font-size: .78rem; font-weight: 800; }
.request-identity-panel input:focus { outline: 2px solid var(--lime); outline-offset: 1px; }
.request-identity-panel input:invalid:not(:placeholder-shown) { border-color: #ff766f; }
.request-identity-panel small { color: #94a29c; font-size: .57rem; line-height: 1.4; }
.discount-panel-head { display: flex; align-items: center; gap: 9px; }
.discount-panel-head > span { display: grid; place-items: center; width: 31px; height: 31px; flex: 0 0 31px; color: #fff; background: var(--violet); font-size: .83rem; font-weight: 1000; transform: rotate(-3deg); }
.discount-panel-head > div { display: flex; min-width: 0; flex-direction: column; gap: 2px; }
.discount-panel-head strong { color: #fff; font-size: .73rem; }
.discount-panel-head small { color: #94a29c; font-size: .55rem; line-height: 1.35; }
.discount-controls { display: grid; grid-template-columns: minmax(0,1fr) auto auto; gap: 5px; margin-top: 9px; }
.discount-controls input { min-width: 0; min-height: 38px; padding: 8px 9px; color: #fff; background: #202c27; border: 1px solid #4b5a54; font-size: .7rem; font-weight: 900; letter-spacing: .07em; text-transform: uppercase; }
.discount-controls input:focus { outline: 2px solid var(--lime); outline-offset: 1px; }
.discount-controls .btn { min-height: 38px; padding: 7px 10px; font-size: .6rem; }
.discount-controls [hidden] { display: none !important; }
.discount-status { min-height: 0; margin: 7px 0 0; color: #a9b7b1; font-size: .57rem; line-height: 1.35; }
.discount-status:empty { display: none; }
.discount-status.success { color: var(--lime); }
.discount-status.error { color: #ff9b8d; }
.discount-total-stack { display: grid; justify-items: end; gap: 1px; }
.discount-total-stack del { color: #8d9994; font-size: .65rem; }
.discount-total-stack small { color: var(--lime); font-size: .5rem; font-weight: 900; text-transform: uppercase; }
.referral-benefit-panel{display:grid;gap:9px;margin-top:11px;padding:12px;color:#e8efe9;background:linear-gradient(135deg,#17231e,#101714);border:1px solid #43534b;border-left:4px solid var(--lime)}
.referral-benefit-panel[hidden]{display:none!important}.referral-benefit-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.referral-benefit-head>div{display:grid;gap:2px}.referral-benefit-head small{color:var(--lime);font-size:.51rem;font-weight:1000;letter-spacing:.12em}.referral-benefit-head strong{color:#fff;font-size:.69rem;line-height:1.3}.referral-benefit-head>span{flex:0 0 auto;padding:5px 7px;color:#bdc9c2;background:#26342e;font-size:.53rem;font-weight:900}.referral-benefit-head>span b{color:var(--lime);font-size:.72rem}.referral-benefit-choices{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}.referral-benefit-choices button{min-height:36px;color:#e8efe9;background:#26342e;border:1px solid #506159;font-size:.72rem;font-weight:1000;cursor:pointer}.referral-benefit-choices button:hover:not(:disabled),.referral-benefit-choices button.selected,.referral-benefit-choices button[aria-pressed="true"]{color:#12200f;background:var(--lime);border-color:var(--lime)}.referral-benefit-choices button:disabled{opacity:.3;cursor:not-allowed}.referral-live-preview{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:3px 10px;padding:9px;color:#fff;background:#0a100e;border:1px solid #37463f}.referral-live-preview span{font-size:.57rem;font-weight:850;line-height:1.35}.referral-live-preview strong{grid-row:1/3;grid-column:2;font-size:.85rem;color:var(--lime);white-space:nowrap}.referral-live-preview strong del{margin-right:4px;color:#839088;font-size:.58rem}.referral-live-preview small{color:#aab7b0;font-size:.51rem;font-weight:900;text-transform:uppercase}.referral-benefit-panel>p{margin:0;color:#9daba4;font-size:.53rem;line-height:1.45}.referral-benefit-panel.compact{grid-column:1/-1;margin:0;padding:9px}.referral-benefit-panel.compact .referral-benefit-head strong{font-size:.62rem}
.research-price-rules { margin: 10px 0 0; }
.research-config-panel .btn:disabled { opacity: .45; cursor: not-allowed; }

@media (max-width: 820px) {
  .chest-input-card { grid-template-columns: minmax(0,1fr) 130px 95px; }
  .chest-input-card .btn { grid-column: 1 / -1; }
}

@media (max-width: 560px) {
  .pricing-note, .research-price-rules { padding: 8px; }
  .pricing-note strong, .research-price-rules strong { font-size: .62rem; }
  .pricing-note small, .research-price-rules small { font-size: .5rem; }
  .dg-coin { width: 24px; height: 24px; font-size: .42rem; }
  .toolbar-price { align-items: flex-end; flex-direction: column; }
  .dg-simple { padding: 3px 5px; font-size: .49rem; }
  .chest-input-card { grid-template-columns: 1fr; }
  .selected-price { grid-template-columns: 26px auto; min-height: 48px; }
  .chest-reward-toggle { grid-template-columns: 31px minmax(0,1fr) auto 15px; gap: 7px; min-height: 60px; padding: 8px; }
  .chest-reward-toggle .chest-reward-icon { width: 31px; height: 31px; }
  .cascade-resource-list, .cascade-resource-list.final { grid-template-columns: 1fr; }
  .cascade-chest-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .chest-cascade-summary { padding: 10px; }
  .cascade-summary-head { align-items: flex-start; }
  .cascade-summary-head h3 { font-size: .8rem; }
  .cascade-summary-head > span { font-size: .49rem; }
  .cart-list li { grid-template-columns: minmax(0,1fr) auto auto; }
  .cart-line-price { padding: 3px 4px; font-size: .49rem; }
  .recommendation-ack { grid-template-columns: 20px minmax(0,1fr); padding: 8px; }
  .recommendation-ack input { width: 18px; height: 18px; }
  .recommendation-ack strong { font-size: .62rem; }
  .recommendation-ack small { font-size: .5rem; }
  .rune-detail-head { grid-template-columns: minmax(0,1fr) minmax(105px,auto); gap: 7px; }
  .rune-detail-price { max-width: 135px; padding: 6px 7px; }
  .rune-detail-price strong { font-size: .54rem; }
  .discount-controls { grid-template-columns: minmax(0,1fr) auto; }
  .discount-controls #btnDiscountRemove { grid-column: 1 / -1; }
  .referral-benefit-head{align-items:center}.referral-live-preview{grid-template-columns:1fr}.referral-live-preview strong{grid-row:auto;grid-column:auto;font-size:.8rem}.referral-benefit-panel{padding:9px}
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0; min-height: 100vh; color: var(--ink); background:
    radial-gradient(circle at 0 0, rgba(200,244,79,.18), transparent 28rem),
    radial-gradient(circle at 100% 10rem, rgba(121,87,255,.09), transparent 30rem),
    var(--bg);
}
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }

.topbar {
  position: sticky; top: 0; z-index: 30; display: grid; grid-template-columns: auto minmax(0,1fr) auto auto;
  align-items: center; gap: 28px; min-height: 72px; padding: 10px max(22px, calc((100vw - 1540px) / 2));
  color: #fff; background: rgba(11,17,16,.96); border-bottom: 1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(18px);
}
.brand { display: flex; align-items: center; gap: 11px; color: #fff; text-decoration: none; }
.brand-mark { position: relative; display: grid; place-items: center; width: 48px; height: 48px; overflow: hidden; color: #07100d; background: linear-gradient(135deg,#efffb4 0%,var(--lime) 44%,#62e6ba 100%); border: 1px solid rgba(255,255,255,.55); box-shadow: 0 0 0 3px rgba(200,244,79,.12),0 10px 24px rgba(0,0,0,.32); transform: skew(-6deg) rotate(-2deg); }
.brand-mark::after { content: ""; position: absolute; width: 70px; height: 12px; background: rgba(255,255,255,.46); transform: rotate(-38deg) translateY(-16px); }
.brand-mark b { position: absolute; left: 7px; bottom: 4px; font-size: 1.75rem; font-weight: 1000; line-height: 1; letter-spacing: -.13em; }
.brand-mark i { position: absolute; right: 4px; top: 7px; padding: 2px 3px; color: var(--lime); background: var(--night); font-size: .43rem; font-style: normal; font-weight: 1000; letter-spacing: .04em; }
.brand > span:last-child { display: flex; flex-direction: column; line-height: 1.05; }
.brand strong { font-size: 1.08rem; letter-spacing: -.025em; }
.brand small { margin-top: 4px; color: var(--lime); font-size: .59rem; font-weight: 900; letter-spacing: .16em; }
.topbar-note { color: #9fa9a5; font-size: .82rem; }
.contact-actions { display: flex; align-items: center; gap: 7px; }
.account-guest-link { display: inline-flex; align-items: center; min-height: 39px; padding: 7px 11px; color: var(--night); background: var(--lime); border: 1px solid var(--lime); text-decoration: none; font-size: .62rem; font-weight: 950; text-transform: uppercase; }
.account-guest-link[hidden] { display: none; }
.account-menu { display: flex; align-items: center; gap: 7px; min-height: 39px; padding: 4px 6px; background: #151f1b; border: 1px solid #3e4a45; }
.account-settings-link{display:grid!important;place-items:center;min-width:34px;padding-inline:8px!important;font-size:17px!important}
.account-menu[hidden] { display: none; }
.account-avatar { display: grid; place-items: center; width: 29px; height: 29px; color: var(--night); background: var(--lime); font-size: .72rem; font-weight: 1000; }
.account-copy { min-width: 85px; max-width: 145px; }
.account-copy small, .account-copy strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.account-copy small { color: #8f9d96; font-size: .42rem; font-weight: 950; letter-spacing: .1em; }
.account-copy strong { margin-top: 2px; color: #fff; font-size: .64rem; }
.account-admin-link, .account-logout { min-height: 28px; padding: 5px 7px; color: #fff; background: #28342f; border: 1px solid #48564f; text-decoration: none; font-size: .53rem; font-weight: 900; cursor: pointer; }
.account-admin-link { color: var(--night); background: var(--lime); border-color: var(--lime); }
.cart-shortcut { position: relative; display: inline-flex; align-items: center; gap: 7px; min-height: 39px; padding: 6px 9px; color: #fff; background: #202b27; border: 1px solid #4a5752; cursor: pointer; }
.cart-shortcut-icon { font-size: 1rem; line-height: 1; filter: grayscale(1) brightness(2); }
.cart-shortcut-label { font-size: .68rem; font-weight: 900; }
.cart-shortcut-count { display: grid; place-items: center; min-width: 21px; height: 21px; padding: 2px 5px; color: var(--night); background: var(--lime); font-size: .58rem; font-weight: 1000; }

.page { max-width: 1580px; margin: 0 auto; padding: 30px 22px 80px; }
.hero {
  position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(340px, 520px); align-items: stretch; gap: 40px;
  min-height: 330px; margin-bottom: 24px; padding: clamp(28px, 5vw, 64px); overflow: hidden;
  color: #fff; background: var(--night); box-shadow: 0 25px 70px rgba(11,17,16,.22);
}
.hero::before { content: ""; position: absolute; width: 420px; height: 420px; right: -120px; top: -210px; border: 90px solid rgba(200,244,79,.11); border-radius: 50%; }
.hero::after { content: ""; position: absolute; width: 220px; height: 220px; right: 240px; bottom: -170px; background: var(--violet); border-radius: 50%; opacity: .25; filter: blur(4px); }
.hero-copy, .hero-media { position: relative; z-index: 1; }
.hero-copy { align-self: center; }
.hero-brand-display { display: inline-flex; align-items: center; gap: 0; margin-bottom: 13px; color: #fff; font-size: clamp(1.35rem,3vw,2.3rem); font-weight: 1000; line-height: .9; letter-spacing: -.08em; text-transform: uppercase; filter: drop-shadow(0 9px 16px rgba(0,0,0,.28)); }
.hero-brand-display span { padding: 8px 2px 8px 10px; color: #fff; border: 1px solid rgba(255,255,255,.22); border-right: 0; }
.hero-brand-display strong { padding: 8px 9px 8px 2px; color: var(--night); background: var(--lime); border: 1px solid var(--lime); }
.hero-brand-display em { margin-left: 7px; padding: 8px 10px; color: #fff; background: var(--violet); border: 1px solid #9b84ff; font-size: .72em; font-style: normal; letter-spacing: -.04em; transform: skew(-6deg); }
.version-tag { display: inline-flex; padding: 7px 10px; color: var(--lime); border: 1px solid rgba(200,244,79,.38); font-size: .65rem; font-weight: 900; letter-spacing: .14em; }
.hero h1 { max-width: 900px; margin: 20px 0 18px; font-size: clamp(2.55rem, 6vw, 5.5rem); line-height: .92; letter-spacing: -.07em; }
.hero h1 span { color: var(--lime); }
.hero-copy p { max-width: 670px; margin: 0; color: #b9c4c0; font-size: clamp(.95rem, 1.5vw, 1.15rem); line-height: 1.6; }
.hero-copy p strong { color: #fff; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 24px; }
.hero-actions .btn { min-height: 44px; }
.hero-actions .btn-app-download { color: #fff; background: linear-gradient(120deg,#5f40e8,#8a69ff); border-color: #a994ff; box-shadow: 0 9px 24px rgba(121,87,255,.25); }
.hero-actions .btn-app-download:hover { color: var(--night); background: var(--lime); border-color: var(--lime); }
.app-platform-icons { display: inline-flex; align-items: center; gap: 6px; margin-right: 3px; }
.app-platform-icons img { width: 18px; height: 18px; object-fit: contain; }
.btn-app-download:hover .app-platform-icons img { filter: brightness(0) saturate(100%); }
.hero-media { min-height: 300px; overflow: hidden; border: 1px solid rgba(255,255,255,.13); }
.hero-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, rgba(11,17,16,.92)); }
.hero-media > img { width: 100%; height: 100%; object-fit: cover; object-position: 68% center; filter: saturate(.86) contrast(1.06); }
.hero-stats { position: absolute; z-index: 2; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: repeat(2, 1fr); backdrop-filter: blur(12px); background: rgba(11,17,16,.72); }
.hero-stats > div { display: flex; flex-direction: column; gap: 3px; padding: 17px 20px; border-right: 1px solid rgba(255,255,255,.16); }
.hero-stats > div:last-child { border-right: 0; }
.hero-stats strong { color: #fff; font-size: clamp(1.45rem, 3vw, 2rem); letter-spacing: -.05em; }
.hero-stats span { color: #c6cfcb; font-size: .68rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.hero-stats .hero-visitors strong { color: #d8cfff; }
.hero-stats .hero-guides strong { color: var(--lime); }

.intro-guide {
  display: grid; grid-template-columns: minmax(230px,.7fr) minmax(0,1.5fr); gap: 24px;
  margin-bottom: 24px; padding: 24px; background: var(--paper); border: 1px solid var(--line); box-shadow: var(--shadow);
}
.intro-guide-head > span { color: var(--violet); font-size: .61rem; font-weight: 950; letter-spacing: .15em; }
.intro-guide-head h2 { max-width: 450px; margin: 8px 0 7px; font-size: clamp(1.35rem, 2.5vw, 2rem); line-height: 1.05; letter-spacing: -.045em; }
.intro-guide-head p { max-width: 460px; margin: 0; color: var(--muted); font-size: .76rem; line-height: 1.5; }
.guide-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.guide-grid article { display: flex; align-items: flex-start; gap: 11px; min-height: 128px; padding: 16px; background: var(--surface); border: 1px solid var(--line); }
.guide-grid article > span { display: grid; flex: 0 0 auto; place-items: center; width: 34px; height: 34px; color: var(--night); background: var(--lime); font-size: .66rem; font-weight: 1000; }
.guide-grid strong { display: block; margin: 3px 0 6px; font-size: .9rem; }
.guide-grid p { margin: 0; color: var(--muted); font-size: .69rem; line-height: 1.48; }

.studio-grid { display: grid; grid-template-columns: minmax(0, 1fr) 370px; gap: 20px; align-items: start; }
.builder-column { min-width: 0; }
.mode-card { scroll-margin-top: 92px; padding: 24px; background: var(--paper); border: 1px solid var(--line); box-shadow: var(--shadow); }
.section-label { display: flex; align-items: center; gap: 12px; }
.section-label > span { display: grid; place-items: center; width: 38px; height: 38px; color: var(--night); background: var(--lime); font-size: .75rem; font-weight: 1000; }
.section-label small, .panel-toolbar small, .control-title small, .rail-head small { display: block; margin-bottom: 3px; color: var(--muted); font-size: .59rem; font-weight: 950; letter-spacing: .14em; }
.section-label h2 { margin: 0; font-size: 1.15rem; letter-spacing: -.025em; }
.tabs { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-top: 18px; }
.tab { display: grid; grid-template-columns: 64px 1fr auto; align-items: center; gap: 13px; min-height: 96px; padding: 14px; color: var(--ink); background: var(--surface); border: 2px solid transparent; cursor: pointer; text-align: left; transition: .18s ease; }
.tab:hover { transform: translateY(-2px); border-color: var(--line-dark); }
.tab.active { color: #fff; background: var(--night); border-color: var(--night); box-shadow: 0 14px 28px rgba(11,17,16,.15); }
.tab-art { position: relative; display: grid; place-items: center; width: 64px; height: 64px; overflow: hidden; color: var(--night); border: 2px solid rgba(255,255,255,.58); box-shadow: 0 8px 18px rgba(11,17,16,.22); font-size: 1.3rem; font-weight: 1000; }
.tab-art::after { content: ""; position: absolute; inset: 0; pointer-events: none; box-shadow: inset 0 0 0 1px rgba(255,255,255,.2), inset 0 -16px 22px rgba(0,0,0,.18); }
.tab-art img { display: block; width: 100%; height: 100%; object-fit: cover; filter: saturate(1.06) contrast(1.04); transition: transform .22s ease, filter .22s ease; }
.tab:hover .tab-art img, .tab.active .tab-art img { transform: scale(1.07); filter: saturate(1.13) contrast(1.07) brightness(1.04); }
.tab.active .tab-art { border-color: var(--lime); box-shadow: 0 0 0 2px rgba(200,244,79,.15), 0 10px 24px rgba(0,0,0,.32); }
.rune-art { background: var(--lime); transform: rotate(-3deg); }
.armor-art { background: var(--mint); transform: rotate(3deg); }
.dragon-art { color: #fff; background: var(--violet); transform: rotate(-2deg); }
.chest-art { background: #f4c24f; transform: rotate(2deg); }
.gold-art { background: #ffd65a; transform: rotate(-2deg); }
.special-art { color: #fff; background: #d9672c; transform: rotate(-2deg); }
.special-art img { object-position: center; }
.tab-copy { display: flex; flex-direction: column; gap: 4px; }
.tab-copy strong { font-size: 1.05rem; }
.tab-copy small { color: var(--muted); font-size: .72rem; }
.tab.active .tab-copy small { color: #92a09b; }
.tab-arrow { color: var(--muted); font-size: 1.25rem; transition: .18s; }
.tab.active .tab-arrow { color: var(--lime); transform: translateX(3px); }

.panel { display: none; scroll-margin-top: 88px; }
.panel.active { display: block; }
.category-scroll-hint { position: fixed; z-index: 65; left: 50%; bottom: 20px; display: flex; align-items: center; gap: 9px; min-width: 220px; padding: 9px 13px; color: #fff; background: rgba(11,17,16,.96); border: 1px solid rgba(200,244,79,.42); box-shadow: 0 16px 40px rgba(0,0,0,.28); opacity: 0; pointer-events: none; transform: translate(-50%, 18px); transition: opacity .2s ease, transform .2s ease; }
.category-scroll-hint.show { opacity: 1; transform: translate(-50%, 0); }
.category-scroll-hint > span:last-child { display: flex; flex-direction: column; gap: 2px; }
.category-scroll-hint strong { color: var(--lime); font-size: .66rem; letter-spacing: .1em; }
.category-scroll-hint small { color: #c3ccc8; font-size: .58rem; font-weight: 750; }
.category-scroll-arrow { display: grid; place-items: center; width: 30px; height: 30px; color: var(--night); background: var(--lime); font-size: 1rem; font-weight: 1000; animation: category-scroll-pulse .75s ease-in-out infinite alternate; }
@keyframes category-scroll-pulse { from { transform: translateY(-2px); } to { transform: translateY(3px); } }
@media (min-width: 821px) { .category-scroll-hint { display: none; } }
@media (prefers-reduced-motion: reduce) { .category-scroll-arrow { animation: none; } }
.workspace-title { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin: 32px 0 14px; }
.workspace-title > p { max-width: 430px; margin: 0; color: var(--muted); font-size: .84rem; text-align: right; }

.category-banner { position: relative; height: 150px; margin: 0 0 10px; overflow: hidden; color: #fff; background: var(--night); }
.category-banner::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(11,17,16,.94) 0%, rgba(11,17,16,.63) 48%, rgba(11,17,16,.05) 100%); }
.category-banner img { width: 100%; height: 100%; object-fit: cover; }
.rune-banner img { object-position: center 56%; }
.armor-banner img { object-position: 66% 43%; }
.dragon-banner img { object-position: 64% 44%; }
.chest-banner img { object-position: center 62%; filter: saturate(.75) contrast(1.08); }
.gold-banner img { object-position: center 55%; filter: saturate(.82) sepia(.08) contrast(1.08); }
.research-banner img { object-position: center 42%; filter: saturate(.86) contrast(1.16); }
.category-banner figcaption { position: absolute; z-index: 2; inset: 0; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: 22px; }
.category-banner figcaption small { color: var(--lime); font-size: .59rem; font-weight: 950; letter-spacing: .16em; }
.category-banner figcaption strong { max-width: 390px; margin-top: 5px; font-size: clamp(1.15rem, 2.5vw, 1.7rem); letter-spacing: -.035em; }
.category-banner figcaption span { margin-top: 9px; color: #9fa9a5; font-size: .55rem; }

.search-dock { display: grid; grid-template-columns: 50px minmax(0,1fr) auto; align-items: center; gap: 13px; padding: 13px 16px; color: #fff; background: var(--night); box-shadow: 0 14px 30px rgba(11,17,16,.14); }
.search-icon { display: grid; place-items: center; width: 42px; height: 42px; color: var(--night); background: var(--lime); font-size: 1.8rem; line-height: 1; }
.search-dock label { display: block; min-width: 0; }
.search-dock label > span { display: block; margin-bottom: 3px; color: #8f9b97; font-size: .62rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.search-dock input { width: 100%; padding: 0; color: #fff; background: transparent; border: 0; outline: 0; font-size: 1.08rem; font-weight: 750; }
.search-dock input::placeholder { color: #65716d; }
.search-hint { padding: 7px 9px; color: var(--lime); border: 1px solid rgba(200,244,79,.3); font-size: .68rem; font-weight: 800; }
.rune-search-dock { grid-template-columns: 64px minmax(0,1fr) auto; min-height: 88px; padding: 16px 18px; border: 2px solid var(--lime); }
.rune-search-dock .search-icon { width: 52px; height: 52px; font-size: 2.25rem; }
.rune-search-dock label > span { margin-bottom: 6px; color: var(--lime); font-size: .77rem; }
.rune-search-dock input { font-size: clamp(1.08rem, 2.25vw, 1.42rem); }
.rune-search-dock .search-hint { font-size: .75rem; }

.filter-drawer { width: 100%; max-width: 100%; margin-top: 10px; background: #f5f0ff; border: 2px solid var(--violet); box-shadow: 0 8px 20px rgba(103,79,183,.12); }
.filter-drawer > summary { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 58px; padding: 9px 12px; list-style: none; cursor: pointer; }
.filter-drawer > summary::-webkit-details-marker { display: none; }
.filter-summary { display: flex; align-items: center; gap: 10px; }
.filter-summary > span:last-child { display: flex; flex-direction: column; }
.filter-summary strong { color: #30245d; font-size: .82rem; }
.filter-summary small { display: block; margin-top: 2px; color: #716a83; font-size: .61rem; }
.filter-symbol { display: grid; place-items: center; width: 36px; height: 36px; color: #fff; background: var(--violet); font-size: 1rem; font-weight: 900; }
.open-label { display: inline-flex; align-items: center; min-height: 32px; padding: 6px 9px; color: #fff; background: var(--violet); font-size: .61rem; font-weight: 900; white-space: nowrap; }
.filter-drawer[open] .open-label { font-size: 0; }
.filter-drawer[open] .open-label::after { content: "Close"; font-size: .61rem; }
.filter-backdrop { position: fixed; z-index: 70; inset: 0; width: 100%; height: 100%; padding: 0; background: rgba(5,9,8,.7); border: 0; cursor: pointer; backdrop-filter: blur(3px); }
.filter-body { position: fixed; z-index: 71; inset: 0 auto 0 0; width: min(390px, 92vw); padding: 0 12px 18px; overflow-y: auto; overscroll-behavior: contain; color: var(--ink); background: #fff; border: 0; box-shadow: 24px 0 70px rgba(5,9,8,.3); animation: filterSlideIn .2s ease-out; }
.filter-sheet-head { position: sticky; z-index: 3; top: 0; display: flex; justify-content: space-between; align-items: center; gap: 15px; margin: 0 -12px 12px; padding: 14px 14px 12px; color: #fff; background: var(--night); border-bottom: 3px solid var(--lime); }
.filter-sheet-head > div { display: flex; flex-direction: column; gap: 2px; }
.filter-sheet-head small { color: var(--lime); font-size: .55rem; font-weight: 950; letter-spacing: .14em; }
.filter-sheet-head strong { font-size: .94rem; }
.filter-close { display: grid; place-items: center; width: 38px; height: 38px; padding: 0; color: var(--night); background: var(--lime); border: 0; cursor: pointer; font-size: 1.45rem; line-height: 1; }
body.filter-open { overflow: hidden; }
@keyframes filterSlideIn { from { transform: translateX(-100%); } to { transform: translateX(0); } }
.filter-section + .filter-section { margin-top: 9px; padding-top: 8px; border-top: 1px solid var(--line); }
.filter-title { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 5px; }
.filter-title h3 { margin: 0; font-size: .69rem; }
.filter-title > span { color: var(--muted); font-size: .58rem; }
.cat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 3px; }
.cat-grid label, label.chip { display: flex; align-items: center; gap: 5px; min-height: 28px; padding: 3px 6px; color: #495550; background: var(--surface); border: 1px solid var(--line); cursor: pointer; user-select: none; font-size: .64rem; }
.cat-grid label:has(input:checked), label.chip:has(input:checked) { color: var(--night); background: #eefbd1; border-color: var(--lime-deep); font-weight: 800; }
.cat-grid.buildings label:has(input:checked) { color: #0d4f68; background: #e8f7fd; border-color: #79ccef; }
.cat-grid .count, .cat-grid .el { margin-left: auto; color: var(--muted); font-size: .53rem; font-weight: 800; }
.number-add { display: flex; align-items: end; gap: 6px; margin-top: 8px; padding: 7px; background: var(--surface); border-left: 3px solid var(--violet); }
.number-add label { flex: 1; }
.number-add label > span { font-size: .6rem; }
.number-add input { min-height: 31px; padding: 5px 7px; font-size: .7rem; }
.number-add .btn { min-height: 31px; padding: 5px 9px; font-size: .62rem; }

.product-workspace { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(270px, .72fr); gap: 10px; margin-top: 10px; align-items: start; }
.catalog-panel, .details-panel { min-width: 0; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); }
.panel-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 14px; min-height: 76px; padding: 15px 18px; border-bottom: 1px solid var(--line); }
.panel-toolbar h3 { margin: 0; font-size: 1rem; letter-spacing: -.02em; }
.count-pill { display: inline-grid; place-items: center; min-width: 42px; min-height: 32px; padding: 5px 10px; color: #fff; background: var(--night); font-size: .74rem; font-weight: 950; }
.count-pill.bright { color: var(--night); background: var(--lime); }
.live-dot { width: 10px; height: 10px; background: var(--mint); border-radius: 50%; box-shadow: 0 0 0 6px rgba(41,216,177,.15); }
.table-wrap { max-height: 510px; overflow: auto; }
table { width: 100%; border-collapse: collapse; font-size: .78rem; }
th, td { padding: 9px 10px; border-bottom: 1px solid #e7ebe8; text-align: left; vertical-align: middle; }
th { position: sticky; top: 0; z-index: 2; color: #65716c; background: #f1f4f0; font-size: .61rem; letter-spacing: .07em; text-transform: uppercase; }
tbody tr { cursor: pointer; transition: .12s; }
tbody tr:hover { background: #f4f8f2; }
tbody tr.active { background: #eefbd1; box-shadow: 4px 0 0 var(--lime-deep) inset; }
tbody tr.checked { background: #e4fac0; box-shadow: 5px 0 0 var(--lime-deep) inset; }
tbody tr.checked.active { background: #dff7b5; }
td.name, td strong { font-weight: 800; }
.select-cell { width: 58px; padding: 5px 8px; text-align: center; }
.rune-check { position: relative; display: grid; place-items: center; width: 38px; height: 38px; margin: auto; cursor: pointer; }
.rune-check input { position: absolute; z-index: 2; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.rune-check > span { display: grid; place-items: center; width: 28px; height: 28px; color: transparent; background: #fff; border: 3px solid #87938e; border-radius: 8px; box-shadow: 0 2px 0 rgba(11,17,16,.12); pointer-events: none; font-size: 1.1rem; font-weight: 1000; line-height: 1; transition: transform .12s, background .12s, border-color .12s, box-shadow .12s; }
.rune-check:hover > span { border-color: var(--lime-deep); transform: scale(1.06); }
.rune-check:has(input:checked) > span { color: var(--night); background: var(--lime); border-color: var(--night); box-shadow: 0 0 0 4px rgba(199,242,55,.32), 0 3px 0 rgba(11,17,16,.22); transform: scale(1.08); }
.rune-check:has(input:focus-visible) > span { outline: 3px solid var(--violet); outline-offset: 3px; }
#panelRunes thead th:first-child { position: sticky; left: 0; z-index: 4; min-width: 58px; }
#runeBody .select-cell { position: sticky; left: 0; z-index: 1; background: #fff; border-right: 1px solid #e0e6e2; }
#runeBody tr:hover .select-cell { background: #f4f8f2; }
#runeBody tr.active .select-cell { background: #eefbd1; }
#runeBody tr.checked .select-cell { background: #e4fac0; }
#runeBody tr.checked.active .select-cell { background: #dff7b5; }
.action-bar { display: flex; flex-wrap: wrap; gap: 7px; padding: 12px 15px; border-top: 1px solid var(--line); }
.top-actions { padding: 0 16px 12px; border: 0; }
.details-panel { position: sticky; top: 82px; }
.stats-panel { min-height: 360px; max-height: 510px; overflow: auto; padding: 15px; background: var(--surface); }
.stats-panel .title { margin: 0 0 8px; font-size: 1.12rem; font-weight: 900; }
.stats-panel .big { margin: 8px 0; font-size: 1.05rem; font-weight: 900; }
.stats-panel .stat { margin-bottom: 7px; padding: 11px; background: #fff; border-left: 3px solid var(--mint); }
.stats-panel .stat h4 { margin: 0 0 5px; }
.empty-visual { display: grid; place-items: center; min-height: 320px; color: var(--muted); text-align: center; }
.empty-visual > span { display: grid; place-items: center; width: 64px; height: 64px; margin-bottom: -35px; color: var(--night); background: var(--lime); font-size: 1.25rem; font-weight: 1000; transform: rotate(-4deg); }
.empty-visual strong { align-self: end; color: var(--ink); font-size: .9rem; }
.empty-visual small { align-self: start; font-size: .72rem; }

.armor-filter-panel { margin-top: 10px; padding: 14px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); }
.armor-filter-head { display: flex; justify-content: space-between; align-items: center; gap: 14px; }
.armor-filter-head small { color: var(--violet); font-size: .58rem; font-weight: 950; letter-spacing: .14em; }
.armor-filter-head h3 { margin: 3px 0 0; font-size: 1rem; letter-spacing: -.025em; }
.armor-filter-head p { margin: 4px 0 0; color: var(--muted); font-size: .62rem; line-height: 1.35; }
.armor-clear-sets { min-height: 34px; padding: 6px 10px; }
.armor-filter-group { display: grid; grid-template-columns: 120px minmax(0,1fr); align-items: center; gap: 12px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.armor-filter-label { display: flex; align-items: center; gap: 8px; min-width: 0; }
.armor-filter-label > span { display: grid; flex: 0 0 auto; place-items: center; width: 27px; height: 27px; color: #fff; background: var(--violet); font-size: .6rem; font-weight: 1000; }
.armor-filter-label strong { display: block; font-size: .75rem; }
.armor-filter-label small { display: block; margin-top: 2px; color: var(--muted); font-size: .55rem; }
.armor-filter-panel .tier-grid { display: flex; gap: 6px; min-width: 0; overflow-x: auto; padding: 2px 1px 4px; scrollbar-width: none; scroll-snap-type: x proximity; }
.armor-filter-panel .tier-grid::-webkit-scrollbar, .armor-sets::-webkit-scrollbar { display: none; }
.tier-card { flex: 0 0 160px; display: grid; grid-template-columns: 31px minmax(0,1fr); align-items: center; gap: 8px; min-height: 52px; padding: 7px 8px; color: var(--ink); background: var(--surface); border: 2px solid transparent; cursor: pointer; scroll-snap-align: start; text-align: left; }
.tier-card:hover { border-color: var(--line-dark); }
.tier-card.active { color: #fff; background: var(--night); border-color: var(--lime); }
.tier-card .tier-symbol { display: grid; place-items: center; width: 31px; height: 31px; color: var(--night); background: var(--lime); font-size: .58rem; font-weight: 1000; }
.tier-card.tier-mythic .tier-symbol { color: #fff; background: var(--violet); }
.tier-card.tier-exotic .tier-symbol { color: var(--night); background: var(--orange); }
.tier-card-copy { min-width: 0; }
.tier-card .tier-label { display: block; overflow: hidden; font-size: .73rem; font-weight: 950; text-overflow: ellipsis; white-space: nowrap; }
.tier-card .tier-count { display: block; margin-top: 3px; color: var(--muted); font-size: .53rem; font-weight: 850; }
.tier-card.active .tier-count { color: #9ba6a2; }
.armor-set-group { align-items: start; }
.armor-set-head { display: flex; align-items: center; gap: 8px; }
.kind-row { display: flex; gap: 5px; margin-left: auto; }
.kind-row .chip { justify-content: center; min-height: 28px; padding: 3px 7px; font-size: .57rem; }
.armor-kind-chip { position: relative; }
.armor-kind-chip input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.armor-kind-check { display: grid; place-items: center; width: 14px; height: 14px; color: transparent; background: #fff; border: 2px solid #87938e; font-size: .57rem; font-weight: 1000; line-height: 1; }
.armor-kind-chip input:checked + .armor-kind-check { color: var(--night); background: var(--lime); border-color: var(--night); }
.armor-kind-chip input:focus-visible + .armor-kind-check { outline: 2px solid var(--violet); outline-offset: 2px; }
.armor-sets { display: grid; grid-template-columns: 1fr; gap: 6px; min-width: 0; overflow: visible; padding: 2px 1px 5px; }
.armor-filter-panel .armor-sets label { position: relative; width: 100%; display: grid; grid-template-columns: 17px minmax(0,1fr); grid-template-rows: auto auto; align-items: center; gap: 2px 8px; min-height: 48px; padding: 7px 9px; color: #4d5954; background: var(--surface); border: 1px solid var(--line-dark); cursor: pointer; user-select: none; }
.armor-filter-panel .armor-sets label:has(input:checked) { color: var(--night); background: #eefbd1; border-color: var(--lime-deep); box-shadow: inset 3px 0 0 var(--lime-deep); }
.armor-filter-panel .armor-sets input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.armor-set-check { grid-column: 1; grid-row: 1 / 3; display: grid; place-items: center; width: 16px; height: 16px; color: transparent; background: #fff; border: 2px solid #87938e; font-size: .6rem; font-weight: 1000; line-height: 1; }
.armor-sets input:checked + .armor-set-check { color: var(--night); background: var(--lime); border-color: var(--night); }
.armor-sets input:focus-visible + .armor-set-check { outline: 2px solid var(--violet); outline-offset: 2px; }
.armor-set-name { grid-column: 2; overflow: hidden; font-size: .67rem; font-weight: 950; line-height: 1.15; text-overflow: ellipsis; white-space: normal; }
.armor-sets .el { grid-column: 2; color: var(--muted); font-size: .51rem; line-height: 1.2; }
.armor-piece-check { position: relative; display: grid; place-items: center; width: 34px; height: 34px; margin: auto; cursor: pointer; }
.armor-piece-check input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.armor-piece-check span { display: grid; place-items: center; width: 24px; height: 24px; color: transparent; background: #fff; border: 2px solid #87938e; font-size: .82rem; font-weight: 1000; line-height: 1; }
.armor-piece-check:has(input:checked) span { color: var(--night); background: var(--lime); border-color: var(--night); }
.armor-piece-check:has(input:focus-visible) span { outline: 2px solid var(--violet); outline-offset: 2px; }
.substat-callout { display: flex; align-items: center; gap: 11px; margin: 13px 16px; padding: 11px; color: #6d2b1c; background: #fff0ea; border-left: 4px solid var(--orange); }
.substat-callout[hidden] { display: none; }
.alert-mark { display: grid; place-items: center; flex: 0 0 auto; width: 30px; height: 30px; color: #fff; background: var(--orange); font-weight: 1000; }
.substat-callout > div { display: flex; flex-direction: column; gap: 2px; }
.substat-callout strong { font-size: .77rem; }
.substat-callout small { color: #934d38; font-size: .65rem; }
.armor-set-actions { margin-top: 11px; padding: 1px 0 0; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); }
.armor-set-actions .top-actions { margin: 13px 16px 16px; }
.armor-set-preview { margin-top: 10px; padding: 14px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); }
.armor-set-preview[hidden] { display: none; }
.armor-set-preview-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 10px; }
.armor-set-preview-head small { color: var(--violet); font-size: .56rem; font-weight: 950; letter-spacing: .13em; }
.armor-set-preview-head h3 { margin: 3px 0 0; font-size: .92rem; }
.armor-set-preview-head p { margin: 3px 0 0; color: var(--muted); font-size: .58rem; }
.armor-set-piece-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; }
.armor-set-piece-card { min-width: 0; padding: 9px 10px; background: var(--surface); border-left: 3px solid var(--violet); }
.armor-set-piece-card .piece-top { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.armor-set-piece-card .piece-top strong { min-width: 0; font-size: .68rem; line-height: 1.2; }
.armor-set-piece-card .piece-top span { flex: 0 0 auto; color: var(--violet); font-size: .5rem; font-weight: 950; }
.armor-set-piece-card .piece-main { margin-top: 5px; color: var(--ink); font-size: .57rem; font-weight: 850; }
.armor-set-piece-card .piece-unique { margin-top: 4px; padding: 4px 5px; color: #4a2a76; background: #eee7ff; font-size: .52rem; font-weight: 850; line-height: 1.35; }
.armor-set-piece-card .piece-pool { margin-top: 3px; color: var(--muted); font-size: .48rem; line-height: 1.3; }
.armor-fixed-unique { display: flex; flex-direction: column; gap: 3px; margin: 8px 0; padding: 8px; color: #4a2a76; background: #eee7ff; border-left: 3px solid var(--violet); font-size: .68rem; }
.armor-exact-substats { margin-top: 9px; padding: 9px; background: #eff4f1; border: 1px solid var(--line-dark); }
.armor-exact-substats > strong { display: block; font-size: .72rem; }
.armor-exact-substats > small { display: block; margin-top: 2px; color: var(--muted); font-size: .58rem; }
.armor-exact-substats ul { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 4px; margin: 8px 0 0; padding: 0; list-style: none; }
.armor-exact-substats li { display: flex; flex-direction: column; padding: 5px; background: #fff; border-left: 2px solid var(--mint-deep); font-size: .57rem; }
.armor-exact-substats li span { margin-top: 1px; color: var(--muted); font-size: .52rem; }
.armor-table { max-height: 470px; }

.dragon-filter-bar {
  display: grid; grid-template-columns: repeat(4, minmax(0,1fr)) auto; align-items: end; gap: 7px;
  margin-top: 10px; padding: 13px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow);
}
.dragon-filter-bar label > span { color: var(--muted); font-size: .61rem; letter-spacing: .04em; text-transform: uppercase; }
.dragon-filter-bar select { min-height: 38px; padding: 7px 9px; font-size: .72rem; }
.dragon-filter-bar .btn { min-height: 38px; }
.dragon-catalog-panel { margin-top: 10px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); }
.dragon-selection-bar { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 15px; color: var(--muted); background: var(--surface); border-bottom: 1px solid var(--line); font-size: .69rem; font-weight: 800; }
.dragon-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 7px; max-height: 640px; overflow: auto; padding: 10px; }
.dragon-card {
  position: relative; display: flex !important; flex-direction: column; gap: 8px; min-width: 0; min-height: 174px;
  padding: 14px !important; color: var(--ink) !important; background: var(--surface); border: 2px solid transparent;
  cursor: pointer; transition: transform .14s ease, border-color .14s ease, background .14s ease, box-shadow .14s ease;
}
.dragon-card:hover { border-color: var(--line-dark); transform: translateY(-2px); }
.dragon-card.checked { background: #eefbd1; border-color: var(--lime-deep); box-shadow: 0 10px 24px rgba(157,203,30,.12); }
.dragon-card.unavailable { opacity: .68; }
.dragon-card.unavailable.checked { opacity: 1; }
.dragon-card input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.dragon-card-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; padding-right: 38px; }
.dragon-number { color: var(--violet); font-size: .64rem; font-weight: 950; letter-spacing: .04em; }
.dragon-check { position: absolute; top: 11px; right: 11px; display: grid; place-items: center; width: 30px; height: 30px; color: transparent; background: #fff; border: 2px solid #87938e; font-size: 1rem; font-weight: 1000; }
.dragon-card.checked .dragon-check { color: var(--night); background: var(--lime); border-color: var(--night); box-shadow: 0 0 0 4px rgba(200,244,79,.25); }
.dragon-card input:focus-visible + .dragon-check { outline: 3px solid var(--violet); outline-offset: 3px; }
.dragon-card-name { margin: 1px 0 0; overflow-wrap: anywhere; font-size: 1rem; line-height: 1.05; letter-spacing: -.025em; }
.dragon-type { min-height: 31px; margin: 0; color: var(--muted); font-size: .66rem; line-height: 1.35; }
.dragon-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: auto; }
.dragon-tag { display: inline-flex; align-items: center; min-height: 23px; padding: 3px 6px; color: #4e5b56; background: #fff; border: 1px solid var(--line); font-size: .57rem; font-weight: 850; }
.dragon-tag.rarity-mythic { color: #fff; background: var(--violet); border-color: var(--violet); }
.dragon-tag.rarity-legendary { color: #603617; background: #ffd98d; border-color: #e4ad42; }
.dragon-tag.element-fire { color: #8a301b; background: #ffe4d8; border-color: #ffb28e; }
.dragon-tag.element-earth { color: #61491d; background: #efe4ca; border-color: #cfb984; }
.dragon-tag.element-dark { color: #fff; background: #32274f; border-color: #5b4789; }
.dragon-tag.element-wind { color: #0c5674; background: #ddf4ff; border-color: #83d1f3; }
.dragon-tag.element-ice { color: #275d78; background: #e7f6ff; border-color: #9fd6ff; }
.dragon-level { display: flex; justify-content: space-between; align-items: center; gap: 8px; color: var(--muted); font-size: .58rem; }
.dragon-level strong { color: var(--ink); font-size: .65rem; }
.dragon-na { color: var(--red); font-weight: 900; }
.dragon-load-row { display: flex; justify-content: center; padding: 12px; border-top: 1px solid var(--line); }
.dragon-load-row[hidden] { display: none; }
.dragon-cart-tools { display: flex; justify-content: space-between; align-items: center; gap: 15px; padding: 11px 13px; color: #9ba6a2; background: var(--night-2); border: 1px solid rgba(255,255,255,.08); }
.dragon-cart-tools p { max-width: 600px; margin: 0; font-size: .7rem; line-height: 1.45; }
.dragon-cart-list li { grid-template-columns: minmax(0,1fr) auto; }
.cart-list .tier-tag.dragon { color: #fff; background: var(--violet); }
.cart-list .tier-tag.chest { color: var(--night); background: #f4c24f; }
.cart-list .tier-tag.gold { color: var(--night); background: #ffd65a; }

.chest-calculator { margin-top: 10px; padding: clamp(15px, 2vw, 22px); background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); }
.chest-calculator-head, .chest-results-head { display: flex; justify-content: space-between; align-items: center; gap: 14px; }
.chest-calculator-head small, .chest-results-head small { color: var(--muted); font-size: .59rem; font-weight: 950; letter-spacing: .14em; }
.chest-calculator-head h3, .chest-results-head h3 { margin: 4px 0 0; font-size: 1.08rem; letter-spacing: -.025em; }
.chest-live-badge { padding: 6px 9px; color: #64450a; background: #fff2c5; border: 1px solid #e6bd4c; font-size: .57rem; font-weight: 950; letter-spacing: .09em; }
.chest-type-grid { display: grid; grid-template-columns: repeat(7, minmax(0,1fr)); gap: 6px; margin-top: 17px; }
.chest-type { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-width: 0; min-height: 112px; padding: 11px; color: var(--ink); background: var(--surface); border: 2px solid transparent; cursor: pointer; text-align: left; transition: .15s ease; }
.chest-type:hover { border-color: var(--line-dark); transform: translateY(-2px); }
.chest-type.active { color: #fff; background: var(--night); border-color: var(--chest-accent, var(--lime)); box-shadow: 0 12px 26px rgba(11,17,16,.14); }
.chest-type > span { display: grid; place-items: center; width: 33px; height: 33px; margin-bottom: 4px; color: var(--night); background: var(--chest-accent, var(--lime)); font-size: .76rem; font-weight: 1000; }
.chest-type strong { font-size: .8rem; }
.chest-type small { color: var(--muted); font-size: .57rem; line-height: 1.25; }
.chest-type.active small { color: #94a09b; }
.chest-type.arcane { --chest-accent: #b889ff; }
.chest-type.freedom { --chest-accent: var(--mint); }
.chest-type.draconic { --chest-accent: var(--orange); }
.chest-type.platinum { --chest-accent: #b8c5d0; }
.chest-type.gold { --chest-accent: #f4c24f; }
.chest-type.super-sigil { --chest-accent: #a7c957; }
.chest-type.atlas { --chest-accent: #61d095; }
.chest-input-card { display: grid; grid-template-columns: minmax(0,1fr) 150px 100px auto; align-items: end; gap: 13px; margin-top: 13px; padding: 16px; color: #fff; background: var(--night); }
.chest-quantity-copy { display: flex; flex-direction: column; gap: 3px; }
.chest-quantity-copy small { color: #f4c24f; font-size: .58rem; font-weight: 950; letter-spacing: .14em; }
.chest-quantity-copy strong { font-size: .9rem; }
.chest-quantity-copy span { color: #8f9b96; font-size: .64rem; line-height: 1.4; }
.chest-quantity { color: #b9c3bf !important; }
.chest-quantity > span { font-size: .62rem; }
.chest-quantity input { min-height: 43px; font-size: 1rem; font-weight: 900; text-align: center; }
.chest-quantity input[readonly] { color: var(--night); background: #fff7df; border-color: #e6bd4c; cursor: default; }
.chest-quantity input:not([readonly]) { color: var(--night); background: #eefbd1; border-color: var(--lime-deep); }
.chest-input-card .btn { min-height: 43px; }
.chest-quick-row { display: flex; align-items: center; gap: 5px; overflow-x: auto; padding: 9px 0 13px; border-bottom: 1px solid var(--line); scrollbar-width: none; }
.chest-quick-row::-webkit-scrollbar { display: none; }
.chest-quick-row > span { flex: 0 0 auto; margin-right: 5px; color: var(--muted); font-size: .6rem; font-weight: 900; text-transform: uppercase; }
.chest-quick-row button { flex: 0 0 auto; min-width: 54px; min-height: 31px; padding: 5px 9px; color: var(--ink); background: var(--surface); border: 1px solid var(--line); cursor: pointer; font-size: .65rem; font-weight: 850; }
.chest-quick-row button.active { color: var(--night); background: #fff2c5; border-color: #d9a81e; }
.chest-results-head { margin-top: 17px; }
.chest-results { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 6px; margin-top: 11px; }
.chest-bottom-action { display: flex; justify-content: flex-end; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.chest-bottom-action .btn { min-width: min(100%, 260px); }
.chest-reward { position: relative; display: grid; grid-template-columns: 35px minmax(0,1fr) auto; align-items: center; gap: 10px; min-width: 0; min-height: 66px; padding: 10px 12px; background: var(--surface); border: 1px solid var(--line); overflow: hidden; }
.chest-reward::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--reward-accent, var(--lime)); }
.chest-reward-icon { display: grid; place-items: center; width: 35px; height: 35px; color: var(--night); background: var(--reward-accent, var(--lime)); font-size: .68rem; font-weight: 1000; }
.chest-reward-copy { min-width: 0; }
.chest-reward-copy strong { display: block; overflow-wrap: anywhere; font-size: .72rem; line-height: 1.25; }
.chest-reward-copy small { display: block; margin-top: 3px; color: var(--muted); font-size: .55rem; }
.chest-reward-value { color: var(--ink); font-variant-numeric: tabular-nums; font-size: clamp(.92rem, 2vw, 1.15rem); font-weight: 1000; letter-spacing: -.035em; }
.chest-disclaimer { margin: 12px 0 0; padding: 10px 11px; color: #735116; background: #fff7df; border-left: 3px solid #f4c24f; font-size: .65rem; line-height: 1.45; }
.chest-cascade-explainer { display: grid; grid-template-columns: 32px minmax(0,1fr); gap: 10px; margin-top: 10px; padding: 11px 12px; color: #28332f; background: #eefbd1; border: 1px solid #badf54; border-left: 4px solid var(--lime-deep); }
.cascade-explainer-mark { display: grid; place-items: center; width: 30px; height: 30px; color: var(--night); background: var(--lime); font-size: .9rem; font-weight: 1000; }
.chest-cascade-explainer > div:last-child > small { color: #567410; font-size: .54rem; font-weight: 1000; letter-spacing: .12em; }
.chest-cascade-explainer p { margin: 3px 0 0; font-size: .63rem; line-height: 1.45; }
.cascade-number-example { display: flex; align-items: center; gap: 7px; margin-top: 8px; }
.cascade-number-example span { padding: 5px 7px; background: #fff; border: 1px solid #d4e8a3; font-size: .57rem; }
.cascade-number-example span:nth-child(2) { padding: 0; color: #71951b; background: transparent; border: 0; font-size: .9rem; font-weight: 1000; }
.chest-cascade-explainer > div:last-child > small:last-child { display: block; margin-top: 6px; color: #52615b; font-size: .55rem; font-weight: 750; letter-spacing: 0; line-height: 1.4; }
.cascade-explanation, .cascade-summary-explanation { margin: 8px 0 2px; font-size: .56rem; line-height: 1.45; }
.cascade-explanation { color: #4d5b55; }
.cascade-summary-explanation { padding: 8px 9px; color: #d8e0dc; background: #18221f; border-left: 3px solid var(--lime); }
.expedite-days { display: block; margin-top: 2px; color: #9b5a12; font-size: .52rem; font-weight: 900; letter-spacing: 0; }
.cascade-resource-list .expedite-days { color: #bd781f; font-size: .48rem; text-align: right; }
.cascade-resource-list.final .expedite-days { color: #f4c24f; }
.expedite-total-mini { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: 7px; padding: 7px 8px; color: #5e420d; background: #fff2c5; border: 1px solid #e6c46c; font-size: .54rem; }
.expedite-total-mini strong { color: #241a07; white-space: nowrap; }
.expedite-total-card { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin-top: 12px; padding: 12px; color: var(--night); background: #f4c24f; border-left: 5px solid var(--lime); }
.expedite-total-card > div { display: flex; flex-direction: column; gap: 2px; }
.expedite-total-card small { color: #65440a; font-size: .53rem; font-weight: 1000; letter-spacing: .12em; }
.expedite-total-card strong { font-size: 1.15rem; line-height: 1; }
.expedite-total-card > span { max-width: 210px; color: #614612; font-size: .55rem; font-weight: 850; text-align: right; }

.gold-package-panel { margin-top: 10px; padding: clamp(14px, 2vw, 22px); background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); }
.gold-package-head { display: flex; justify-content: space-between; align-items: center; gap: 14px; }
.gold-package-head small, .gold-service-info small { color: #8a6411; font-size: .59rem; font-weight: 950; letter-spacing: .14em; }
.gold-package-head h3, .gold-service-info h3 { margin: 4px 0 0; font-size: 1.08rem; letter-spacing: -.025em; }
.gold-availability { flex: 0 0 auto; padding: 6px 9px; color: #5c4007; background: #fff0b8; border: 1px solid #dfb33d; font-size: .54rem; font-weight: 950; letter-spacing: .08em; }
.gold-package-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 6px; margin-top: 15px; }
.gold-package { display: grid; grid-template-columns: 38px minmax(0,1fr); grid-template-rows: auto auto; align-items: center; gap: 2px 8px; min-width: 0; min-height: 70px; padding: 9px; color: var(--ink); background: var(--surface); border: 2px solid transparent; cursor: pointer; text-align: left; }
.gold-package > span { grid-row: 1 / 3; display: grid; place-items: center; width: 38px; height: 38px; color: #503504; background: #ffd65a; font-size: .72rem; font-weight: 1000; }
.gold-package strong { overflow-wrap: anywhere; font-size: .72rem; line-height: 1.1; }
.gold-package small { color: var(--muted); font-size: .52rem; }
.gold-package:hover { border-color: #d6ad3c; }
.gold-package.active { color: #fff; background: var(--night); border-color: #ffd65a; }
.gold-package.active small { color: #aab3af; }
.gold-custom-row { margin-top: 8px; padding: 10px; background: #fff8df; border-left: 4px solid #e3b536; }
.gold-custom-row[hidden] { display: none; }
.gold-custom-row label { max-width: 260px; }
.gold-custom-row input { min-height: 38px; }
.gold-service-info { display: grid; grid-template-columns: 48px minmax(0,1fr); gap: 12px; align-items: start; padding: 14px; color: #fff; background: var(--night); }
.gold-service-info + .gold-package-head { margin-top: 15px; padding-top: 15px; border-top: 1px solid var(--line); }
.gold-service-mark { display: grid; place-items: center; width: 48px; height: 48px; color: #503504; background: #ffd65a; font-size: 1.1rem; font-weight: 1000; }
.gold-service-info h3 { color: #fff; }
.gold-service-info p { margin: 6px 0 0; color: #abb5b1; font-size: .66rem; line-height: 1.5; }
.gold-commit-row { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.gold-commit-row > div { display: flex; flex-direction: column; gap: 2px; }
.gold-commit-row strong { font-size: .84rem; }
.gold-commit-row span { color: var(--muted); font-size: .62rem; }

.research-browser { margin-top: 10px; padding: clamp(14px, 2vw, 22px); background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); }
.research-browser-head { display: flex; justify-content: space-between; align-items: center; gap: 14px; }
.research-browser-head small { color: #b95524; font-size: .59rem; font-weight: 950; letter-spacing: .14em; }
.research-browser-head h3 { margin: 4px 0 0; font-size: 1.08rem; letter-spacing: -.025em; }
.research-tier-controls { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 16px; }
.research-tier-heading span { display: block; color: #9d471f; font-size: .61rem; font-weight: 950; letter-spacing: .1em; text-transform: uppercase; }
.research-tier-heading small { display: block; margin-top: 3px; color: var(--muted); font-size: .61rem; font-weight: 800; }
.research-tier-actions { display: flex; gap: 6px; }
.research-tier-actions .btn { min-height: 36px; padding: 6px 11px; }
.research-tier-actions .btn:disabled { opacity: .42; cursor: not-allowed; filter: grayscale(.35); }
.research-tier-grid { display: flex; gap: 6px; max-width: 100%; overflow-x: auto; padding: 9px 1px 5px; scrollbar-width: none; scroll-snap-type: x proximity; }
.research-tier-grid::-webkit-scrollbar { display: none; }
.research-tier-option { flex: 0 0 auto; display: flex; align-items: center; gap: 6px; min-height: 34px; padding: 5px 9px; color: #4f5d57; background: var(--surface); border: 1px solid var(--line-dark); cursor: pointer; scroll-snap-align: start; font-size: .62rem; font-weight: 900; user-select: none; }
.research-tier-option input { width: 17px; height: 17px; margin: 0; accent-color: #d9672c; cursor: pointer; }
.research-tier-option:has(input:checked) { color: #fff; background: #9d471f; border-color: #9d471f; }
.research-scroll-note { display: flex; justify-content: center; align-items: center; gap: 8px; margin: 13px 0 7px; color: var(--muted); font-size: .6rem; font-weight: 850; text-align: center; }
.research-scroll-note span { color: #b95524; font-size: .82rem; }
.research-tree-wrap { position: relative; max-width: 100%; max-height: none; overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain; scroll-behavior: smooth; padding: 12px; color: #fff; background: #18100c; border: 1px solid #3d281d; box-shadow: inset 0 0 0 1px rgba(255,255,255,.03); scrollbar-color: #d9672c #281a13; }
.research-tree-wrap:focus { outline: 3px solid rgba(217,103,44,.3); outline-offset: 2px; }
.research-slider-toolbar { position: sticky; z-index: 8; top: 0; left: 0; display: flex; align-items: stretch; gap: 5px; width: max-content; max-width: calc(100vw - 50px); margin-bottom: 7px; }
.research-doubletap-tip { display: flex; align-items: center; width: max-content; min-height: 31px; margin: 0; color: #fff; background: rgba(11,17,16,.96); border: 2px solid var(--lime); box-shadow: 0 8px 20px rgba(0,0,0,.3); pointer-events: none; }
.research-doubletap-tip strong, .research-doubletap-tip span { padding: 6px 8px; font-size: .57rem; font-weight: 1000; letter-spacing: .08em; }
.research-doubletap-tip strong { color: var(--night); background: var(--lime); }
.research-slider-add-all { min-height: 31px; padding: 5px 9px; color: var(--night); background: var(--lime); border: 2px solid var(--lime); box-shadow: 0 8px 20px rgba(0,0,0,.3); cursor: pointer; font-size: .55rem; font-weight: 1000; letter-spacing: .05em; white-space: nowrap; }
.research-slider-add-all:disabled { color: #77817d; background: #28332f; border-color: #53605b; cursor: not-allowed; }
.research-tree { display: grid; grid-template-rows: repeat(4, 86px); grid-auto-flow: column; grid-auto-columns: 190px; gap: 9px 18px; min-width: max-content; min-height: 371px; padding: 7px; background-image: repeating-linear-gradient(to bottom, transparent 0, transparent 49px, rgba(218,118,62,.18) 49px, rgba(218,118,62,.18) 52px, transparent 52px, transparent 95px); }
.research-tree.research-tree-exact, .research-tree.research-tree-tier { position: relative; display: block; min-width: 0; min-height: 0; padding: 0; background: radial-gradient(ellipse at 0 50%, rgba(121,87,255,.16), transparent 1100px), linear-gradient(90deg, #21140e, #110b08 55%, #21140e); }
.research-tree-exact .research-link-map, .research-tree-tier .research-link-map { position: absolute; z-index: 0; inset: 0; display: block; overflow: visible; pointer-events: none; }
.research-tree-exact .research-link-map line, .research-tree-tier .research-link-map line { stroke: #b46a3e; stroke-width: 5; stroke-linecap: round; opacity: .58; filter: drop-shadow(0 0 4px rgba(217,103,44,.22)); }
.research-tree-exact .research-node, .research-tree-tier .research-node { position: absolute; z-index: 1; padding: 8px; grid-template-columns: 32px minmax(0,1fr); column-gap: 7px; }
.research-tree-exact .research-node-number, .research-tree-tier .research-node-number { width: 32px; height: 32px; }
.research-tree-exact .research-node::after, .research-tree-tier .research-node::after { display: none; }
.research-node { --research-accent: #d9672c; position: relative; display: grid; grid-template-columns: 35px minmax(0,1fr); grid-template-rows: 1fr auto; align-items: center; column-gap: 9px; min-width: 0; padding: 10px; color: #f7f0eb; background: linear-gradient(145deg, #32231b, #211610); border: 2px solid #5e4030; cursor: pointer; touch-action: manipulation; text-align: left; transition: transform .15s ease, border-color .15s ease, background .15s ease; }
.research-node::after { content: ""; position: absolute; top: 50%; right: -20px; width: 18px; height: 3px; background: rgba(217,103,44,.45); transform: translateY(-50%); }
.research-node:hover { z-index: 1; border-color: var(--research-accent); transform: translateY(-2px); }
.research-node.selected { color: var(--night); background: var(--lime); border-color: #fff; box-shadow: 0 0 0 2px var(--research-accent), 0 10px 24px rgba(0,0,0,.25); }
.research-node-number { grid-column: 1; grid-row: 1 / 3; display: grid; place-items: center; width: 35px; height: 35px; color: #fff; background: var(--research-accent); font-size: .67rem; font-weight: 1000; }
.research-node.selected .research-node-number { color: #fff; background: var(--night); }
.research-node-mark { position: absolute; top: 5px; right: 7px; color: #c98a69; font-size: .83rem; font-weight: 1000; }
.research-node.selected .research-node-mark { display: grid; place-items: center; width: auto; height: auto; min-height: 18px; padding: 3px 5px; top: 4px; right: 4px; color: #fff; background: #137c63; font-size: .43rem; letter-spacing: .06em; }
.research-node-copy { grid-column: 2; min-width: 0; padding-right: 13px; }
.research-node-copy strong { display: block; overflow-wrap: anywhere; font-size: .7rem; line-height: 1.18; }
.research-node-copy small { display: block; margin-top: 4px; color: #ab9589; font-size: .53rem; text-transform: uppercase; }
.research-node.selected .research-node-copy small { color: #536422; }
.research-node.research-dragon { --research-accent: #7957ff; }
.research-node.research-tower { --research-accent: #ff8a50; }
.research-node.research-spell { --research-accent: #29d8b1; }
.research-node.research-base { --research-accent: #f4c24f; }
.research-no-results { margin: 10px 0 0; padding: 15px; color: #7b3e23; background: #fff1e9; text-align: center; font-size: .72rem; }
.research-config-panel { color: var(--ink); background: #f6f1ed; border: 1px solid #cdb9ad; box-shadow: 0 16px 38px rgba(61,35,22,.12); }
.research-config-panel .section-label.inverse > span { color: #fff; background: #d9672c; }
.research-config-panel .section-label.inverse h2 { color: var(--ink); }
.research-config-panel .section-label.inverse small { color: #8b7164; }
.research-config-panel .config-list { background: #e9ded7; border-color: #cdb9ad; }
.research-config-panel .commit-row { border-top-color: #cdb9ad; }
.research-config-panel .commit-row span { color: #796b64; }
.research-config-panel .btn-outline-light { color: #a03732; background: #fff; border-color: #d7aaa6; }
.research-cart-tools { display: flex; justify-content: space-between; align-items: center; gap: 15px; padding: 11px 13px; color: #4f5d57; background: #fff; border: 1px solid #cdb9ad; }
.research-cart-tools p { margin: 0; font-size: .7rem; line-height: 1.45; }
.research-cart-list { max-height: 320px; }
.research-cart-list li { grid-template-columns: minmax(0,1fr) auto; }
.cart-list .tier-tag.research { color: #fff; background: #b95524; }

.config-panel { margin-top: 16px; padding: 20px; color: #fff; background: var(--night); box-shadow: 0 20px 50px rgba(11,17,16,.2); }
.rune-config-panel { color: var(--ink); background: #f2f6f1; border: 1px solid var(--line-dark); box-shadow: 0 16px 38px rgba(20,37,31,.12); }
.rune-config-panel .section-label.inverse h2 { color: var(--ink); }
.rune-config-panel .section-label.inverse small { color: var(--muted); }
.rune-config-panel .config-form { background: #fff; border-color: var(--line-dark); }
.rune-config-panel .config-form label > span, .rune-config-panel .level-pick legend { color: #52605a; }
.rune-config-panel .level-pick legend strong { margin-left: 4px; padding: 2px 5px; color: #6b341e; background: #ffe7dc; font-size: .55rem; text-transform: uppercase; }
.rune-config-panel .level-pick .chip { color: var(--ink); background: #eef2ed; border-color: var(--line-dark); }
.rune-config-panel .level-pick .chip:has(input:checked) { color: var(--night); background: var(--lime); border-color: var(--lime-deep); }
.rune-config-panel .level-pick .chip input { position: absolute; width: 1px; height: 1px; min-height: 0; margin: 0; padding: 0; opacity: 0; pointer-events: none; }
.rune-config-panel .level-pick .chip::before { content: ""; display: grid; flex: 0 0 auto; place-items: center; width: 14px; height: 14px; background: #fff; border: 2px solid #87938e; font-size: .55rem; font-weight: 1000; line-height: 1; }
.rune-config-panel .level-pick .chip:has(input:checked)::before { content: "\2713"; color: var(--night); background: var(--lime); border-color: var(--night); }
.rune-config-panel .level-pick .chip:has(input:focus-visible)::before { outline: 2px solid var(--violet); outline-offset: 2px; }
.rune-config-panel .level-pick.needs-choice { padding: 7px; background: #fff3ed; outline: 2px solid #e97350; }
.rune-config-panel .config-list { background: #e7ede8; border-color: var(--line-dark); }
.rune-config-panel .commit-row { border-top-color: var(--line-dark); }
.rune-config-panel .commit-row span { color: var(--muted); }
.rune-config-panel .btn-outline-light { color: #a03732; background: #fff; border-color: #d7aaa6; }
.config-head { display: flex; justify-content: space-between; align-items: center; gap: 15px; margin-bottom: 17px; }
.section-label.inverse > span { color: var(--night); background: var(--lime); }
.section-label.inverse small { color: #8d9994; }
.section-label.inverse h2 { color: #fff; }
.section-label.inverse h2 b { margin-left: 6px; color: var(--lime); font-size: .72rem; font-weight: 800; }
.config-form { display: flex; flex-wrap: wrap; align-items: end; gap: 9px; padding: 13px; background: var(--night-2); border: 1px solid rgba(255,255,255,.08); }
.config-form > label { flex: 1 1 160px; }
.config-form label > span, .dark-field > span, .level-pick legend { color: #9ba6a2; }
label:not(.chip) { display: flex; flex-direction: column; gap: 5px; color: #56645e; font-size: .71rem; font-weight: 800; }
label span em { color: #899590; font-style: normal; font-weight: 500; }
label span small { color: #899590; font-weight: 500; }
label.full { margin-top: 11px; }
input, select, textarea { width: 100%; min-height: 41px; padding: 9px 10px; color: var(--ink); background: #fff; border: 1px solid var(--line-dark); border-radius: 0; }
input:focus, select:focus, textarea:focus { outline: 3px solid rgba(200,244,79,.28); border-color: var(--lime-deep); }
textarea { resize: vertical; font-family: inherit; }
.level-pick { display: flex; flex: 1 1 190px; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; border: 0; }
.level-pick legend { width: 100%; margin-bottom: 1px; font-size: .71rem; font-weight: 800; }
.level-pick .chip { flex: 1; justify-content: center; color: #c9d0cd; background: #1d2824; border-color: #34413c; }
.level-pick .chip:has(input:checked) { color: var(--night); background: var(--lime); border-color: var(--lime); }
.dark-field textarea, .dark-field select { color: #fff; background: var(--night-2); border-color: #3b4743; }
.dark-field textarea::placeholder { color: #68736f; }
.substat-panel { margin-top: 11px; padding: 13px; background: rgba(41,216,177,.07); border-left: 4px solid var(--mint); }
.substat-panel.hidden, .hidden { display: none !important; }
.substat-panel p { margin: 7px 0 0; color: #93aaa2; font-size: .7rem; }
.no-sub-note { padding: 11px; color: #c8d4cf; background: #1a2521; font-size: .73rem; }
.cart-list { margin: 11px 0 0; padding: 0; list-style: none; overflow: auto; }
.cart-list li { display: grid; grid-template-columns: minmax(0,1fr) auto auto; align-items: center; gap: 8px; margin-bottom: 6px; padding: 10px; color: var(--ink); background: #fff; border-left: 3px solid var(--lime-deep); }
.cart-list .nm { font-size: .82rem; font-weight: 850; }
.cart-list .id { color: var(--muted); font-size: .65rem; }
.cart-list .tier-tag { display: inline-block; margin-right: 5px; padding: 2px 6px; color: var(--night); background: var(--lime); font-size: .57rem; font-weight: 950; }
.cart-list .tier-tag.exotic { background: var(--orange); }
.cart-list .tier-tag.mythic { color: #fff; background: var(--violet); }
.cart-list .tier-tag.rune { color: #fff; background: var(--mint-deep); }
.cart-list input[type="number"] { width: 58px; min-height: 33px; padding: 5px; }
.config-list { max-height: 390px; padding: 7px; background: #141c19; border: 1px solid rgba(255,255,255,.07); }
.config-empty { margin: 10px 0 0; padding: 12px; color: #87928e; background: #141c19; text-align: center; font-size: .7rem; }
.armor-cart-item { grid-template-columns: minmax(0,1fr) minmax(250px,.85fr) auto !important; }
.armor-item-substat { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.armor-item-substat > span { color: var(--muted); font-size: .62rem; font-weight: 850; }
.armor-item-substat-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 5px; }
.armor-item-substat select { min-width: 0; min-height: 34px; padding: 5px 7px; font-size: .7rem; }
.armor-item-substat select:invalid { color: #7f6d49; background: #fff8e8; border-color: #d99b3d; }
.armor-set-substats { grid-column: 1 / -1; display: grid; gap: 7px; margin-top: 4px; }
.armor-shared-substats { padding: 10px; background: rgba(190,255,65,.12); border: 1px solid rgba(190,255,65,.45); }
.armor-shared-substats-head { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 7px; }
.armor-shared-substats-head strong { color: #fff; font-size: .68rem; }
.armor-shared-substats-head span { color: var(--lime); font-size: .52rem; font-weight: 900; }
.armor-shared-substats .armor-item-substat-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
.armor-apply-shared-subs { width: 100%; min-height: 32px; margin-top: 7px; padding: 5px 7px; font-size: .54rem; }
.armor-piece-substats { padding: 8px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16); }
.armor-piece-substats-head { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 6px; }
.armor-piece-substats-head strong { font-size: .64rem; line-height: 1.2; }
.armor-piece-substats-head span { color: #9db1aa; font-size: .5rem; }
.armor-piece-substats .armor-item-substat-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
.armor-piece-substats .armor-copy-subs { width: 100%; min-height: 29px; margin-top: 6px; padding: 4px 6px; font-size: .5rem; }
.armor-substat-error { margin-top: 5px; color: #ffb39e; font-size: .52rem; font-weight: 850; }
.armor-copy-subs { width: 100%; min-height: 33px; margin-top: 3px; padding: 6px 8px; font-size: .61rem; }
.commit-row { display: flex; justify-content: space-between; align-items: center; gap: 18px; margin-top: 13px; padding-top: 13px; border-top: 1px solid rgba(255,255,255,.1); }
.commit-row > div { display: flex; flex-direction: column; gap: 2px; }
.commit-row strong { font-size: .8rem; }
.commit-row span { color: #88948f; font-size: .68rem; }

.direct-send { margin-top: 10px; background: #fff; border: 1px solid var(--line); }
.direct-send > summary { display: flex; justify-content: space-between; align-items: center; gap: 15px; padding: 14px 17px; list-style: none; cursor: pointer; }
.direct-send > summary::-webkit-details-marker { display: none; }
.direct-send summary > span:first-child { display: flex; flex-direction: column; gap: 2px; }
.direct-send summary strong { font-size: .79rem; }
.direct-send summary small { color: var(--muted); font-size: .66rem; }
.direct-send summary > span:last-child { color: var(--violet); font-size: .68rem; font-weight: 900; }
.direct-send-body { padding: 15px; border-top: 1px solid var(--line); }
.summary { min-height: 60px; padding: 11px; color: #4c5a55; background: #f0f3ef; white-space: pre-wrap; font-family: Consolas, monospace; font-size: .7rem; }
.send-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 6px; margin-top: 9px; }
.send-grid.compact { grid-template-columns: repeat(2,1fr); }
.log { min-height: 90px; max-height: 210px; overflow: auto; margin: 9px 0 0; padding: 11px; color: #dce8e3; background: #0e1513; white-space: pre-wrap; font-size: .68rem; }

.order-rail { position: sticky; top: 92px; max-height: calc(100vh - 112px); overflow: auto; padding: 22px; color: #fff; background: var(--night); box-shadow: 0 20px 54px rgba(11,17,16,.25); }
.rail-kicker { display: flex; align-items: center; gap: 8px; color: var(--mint); font-size: .59rem; font-weight: 950; letter-spacing: .15em; }
.pulse { width: 8px; height: 8px; background: var(--mint); border-radius: 50%; box-shadow: 0 0 0 5px rgba(41,216,177,.14); }
.rail-head { display: flex; justify-content: space-between; align-items: start; gap: 15px; margin-top: 20px; }
.rail-head small { color: #85918c; }
.rail-head h2 { margin: 0; font-size: 1.65rem; letter-spacing: -.045em; }
.rail-count { display: grid; place-items: center; min-width: 46px; height: 46px; padding: 5px; color: var(--night); background: var(--lime); font-size: 1rem; font-weight: 1000; }
.rail-help { margin: 9px 0 16px; color: #8e9a95; font-size: .72rem; line-height: 1.45; }
.rail-list { max-height: 260px; }
.rail-list li { font-size: .75rem; }
.rail-empty { display: grid; place-items: center; min-height: 160px; padding: 18px; color: #73807b; background: #121a17; border: 1px dashed #34413c; text-align: center; }
.rail-empty > span { display: grid; place-items: center; width: 42px; height: 42px; margin-bottom: 8px; color: var(--night); background: #35413d; font-size: 1.3rem; font-weight: 300; }
.rail-empty strong { color: #aab4b0; font-size: .8rem; }
.rail-empty small { margin-top: 3px; font-size: .66rem; }
.rail-summary { margin-top: 12px; color: #9faaa5; background: #151e1b; border-left: 3px solid var(--violet); }
.rail-actions { margin-top: 10px; }
.rail-action-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 5px; margin-top: 5px; }
.rail-action-grid.single { grid-template-columns: 1fr; }
.request-sent-panel { display: grid; gap: 9px; margin-top: 9px; padding: 11px; color: var(--night); background: var(--mint); border-left: 4px solid var(--lime); }
.request-sent-panel[hidden] { display: none; }
.request-sent-panel > div { display: flex; flex-direction: column; gap: 2px; }
.request-sent-panel strong { font-size: .76rem; }
.request-sent-panel small { color: #20483d; font-size: .6rem; line-height: 1.4; }
.request-sent-panel .btn { width: 100%; background: var(--night); color: #fff; }
.rail-preview { margin-top: 12px; }
.rail-preview summary { color: #9da8a3; cursor: pointer; font-size: .68rem; font-weight: 800; }
.clear-order { width: 100%; margin-top: 14px; padding: 8px; color: #cf7772; background: transparent; border: 0; border-top: 1px solid #29332f; cursor: pointer; font-size: .68rem; font-weight: 800; }
.secure-note { margin-top: 10px; color: #6f7c77; text-align: center; font-size: .62rem; }
.secure-note span { color: var(--mint); }

.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 39px; padding: 8px 12px; color: var(--ink); background: #e9eeea; border: 1px solid transparent; border-radius: 0; cursor: pointer; text-decoration: none; font-weight: 850; font-size: .72rem; transition: .15s ease; }
.btn:hover { filter: brightness(.97); transform: translateY(-1px); }
.btn-accent, .btn.primary { color: var(--night); background: var(--lime); }
.btn-lime { color: var(--night); background: var(--lime); }
.btn-soft, .btn.secondary { color: var(--ink); background: #eef2ed; border-color: var(--line); }
.btn-dark { color: #fff; background: var(--night); }
.btn-outline-light { color: #d4deda; background: transparent; border-color: #46534e; }
.btn.ghost { color: var(--ink); background: transparent; border-color: var(--line-dark); }
.config-panel .btn.ghost { color: #d4deda; border-color: #46534e; }
.danger, .btn.danger { color: #f0827c !important; }
.btn.secondary-tg { color: #0b6e99; background: #e8f7fd; border-color: #a9ddf2; }
.btn-large { width: 100%; min-height: 48px; font-size: .8rem; }
.link-btn { padding: 3px 0; color: var(--violet); background: transparent; border: 0; cursor: pointer; font-size: .67rem; font-weight: 900; }
.muted { color: var(--muted); }
.toast { position: fixed; left: 50%; bottom: 24px; z-index: 50; padding: 11px 15px; color: #fff; background: var(--night); box-shadow: var(--shadow); opacity: 0; transform: translateX(-50%) translateY(12px); transition: .2s; }
.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }
.contact-fab { position: fixed; z-index: 44; right: 18px; bottom: 18px; display: flex; align-items: center; gap: 10px; min-height: 58px; padding: 8px 16px 8px 9px; color: #fff; background: var(--violet); border: 0; box-shadow: 0 18px 42px rgba(11,17,16,.3); cursor: pointer; text-align: left; transition: transform .16s ease, filter .16s ease; }
.contact-fab[hidden] { display: none !important; }
.contact-fab:hover { filter: brightness(1.05); transform: translateY(-2px); }
.contact-fab-unread { position: absolute; top: -8px; right: -8px; display: grid; place-items: center; min-width: 24px; height: 24px; padding: 0 5px; color: #fff; background: var(--red); border: 3px solid #fff; border-radius: 999px; box-shadow: 0 5px 14px rgba(203,64,54,.42); font-size: .61rem; font-weight: 1000; line-height: 1; }
.contact-fab-unread[hidden] { display: none; }
.contact-fab.new-message { animation: chat-alert-pulse 1.25s ease-in-out 2; }
@keyframes chat-alert-pulse { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-3px) scale(1.025); } }
.contact-fab-icon { display: grid; place-items: center; width: 40px; height: 40px; color: var(--night); background: var(--lime); font-size: 1.25rem; font-weight: 1000; transform: rotate(-3deg); }
.contact-fab > span:last-child { display: flex; flex-direction: column; gap: 2px; }
.contact-fab strong { font-size: .77rem; }
.contact-fab small { color: #ded8ff; font-size: .61rem; }
body.cart-open { overflow: hidden; }
.request-cart-dialog { width: min(430px, calc(100vw - 20px)); max-height: min(680px, calc(100dvh - 20px)); margin: auto; padding: 0; overflow: hidden; color: var(--ink); background: var(--paper); border: 0; box-shadow: 0 28px 90px rgba(11,17,16,.42); }
.request-cart-dialog[open] { display: grid; grid-template-rows: auto minmax(150px,1fr) auto; }
.request-cart-dialog::backdrop { background: rgba(5,10,8,.72); backdrop-filter: blur(5px); }
.request-cart-head { display: flex; justify-content: space-between; align-items: center; gap: 15px; padding: 16px 17px; color: #fff; background: var(--night); border-bottom: 4px solid var(--lime); }
.request-cart-head small { color: var(--lime); font-size: .54rem; font-weight: 950; letter-spacing: .14em; }
.request-cart-head h2 { margin: 3px 0 0; font-size: 1.18rem; }
.request-cart-close { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; color: var(--night); background: var(--lime); border: 0; cursor: pointer; font-size: 1.4rem; }
.request-cart-body { min-height: 0; overflow-y: auto; padding: 11px; background: #eef1ed; }
.request-cart-list { display: grid; gap: 5px; margin: 0; padding: 0; list-style: none; }
.request-cart-list li { display: grid; grid-template-columns: minmax(0,1fr) 32px; align-items: center; gap: 8px; padding: 9px 9px 9px 11px; background: #fff; border-left: 3px solid var(--lime-deep); }
.request-cart-list li > div { min-width: 0; }
.request-cart-list strong { display: block; overflow-wrap: anywhere; font-size: .67rem; line-height: 1.25; }
.request-cart-list small { display: block; margin-top: 3px; color: #75520d; font-size: .57rem; font-weight: 900; }
.request-cart-list button { width: 32px; height: 32px; padding: 0; color: #b4433d; background: #fff1ef; border: 1px solid #e8bbb7; cursor: pointer; font-size: 1.05rem; }
.request-cart-empty { display: grid; place-items: center; min-height: 220px; color: var(--muted); text-align: center; }
.request-cart-empty[hidden] { display: none; }
.request-cart-empty > span { font-size: 2rem; filter: grayscale(1); opacity: .45; }
.request-cart-empty strong { margin-top: 8px; color: var(--ink); font-size: .78rem; }
.request-cart-empty small { max-width: 260px; margin-top: 4px; font-size: .62rem; line-height: 1.4; }
.request-cart-footer { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 11px; background: #fff; border-top: 1px solid var(--line); }
.request-cart-discount { grid-column: 1 / -1; padding: 9px; color: #fff; background: #18231f; border-left: 3px solid var(--violet); }
.request-cart-discount label { display: flex; align-items: center; gap: 6px; margin-bottom: 6px; font-size: .61rem; font-weight: 950; }
.request-cart-discount label span { display: grid; place-items: center; width: 20px; height: 20px; background: var(--violet); }
.request-cart-discount > div { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 5px; }
.request-cart-discount input { min-width: 0; min-height: 35px; padding: 7px 8px; color: #fff; background: #26332e; border: 1px solid #52615b; font-size: .61rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.request-cart-discount .btn { min-height: 35px; padding: 6px 9px; font-size: .56rem; }
.request-cart-discount [hidden] { display: none !important; }
.request-cart-discount small { display: block; margin-top: 5px; color: #9eaaa5; font-size: .52rem; line-height: 1.3; }
.request-cart-discount small.success { color: var(--lime); }
.request-cart-discount small.error { color: #ff9b8d; }
.request-cart-total { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; padding: 9px 10px; color: #fff; background: var(--night); }
.request-cart-total span { color: #a7b2ad; font-size: .61rem; font-weight: 900; text-transform: uppercase; }
.request-cart-total strong { color: var(--lime); font-size: 1.05rem; }
.request-cart-footer .btn { min-height: 40px; }
.contact-dialog { position: fixed; z-index: 2147483000; isolation: isolate; opacity: 1; inset: auto 18px 82px auto; width: min(380px, calc(100vw - 24px)); height: min(560px, calc(100dvh - 104px)); max-height: calc(100dvh - 104px); margin: 0; padding: 0; overflow: hidden; color: var(--ink); background: #eef1ed; border: 1px solid #526158; box-shadow: 0 28px 90px rgba(11,17,16,.58); }
.contact-dialog[open] { display: grid; grid-template-rows: auto minmax(0, 1fr); }
.contact-dialog::backdrop { background: rgba(5,10,8,.56); backdrop-filter: blur(2px); }
.contact-dialog-head { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 18px 19px; color: #fff; background: var(--night); border-bottom: 4px solid var(--lime); }
.contact-dialog-head small { color: var(--lime); font-size: .57rem; font-weight: 950; letter-spacing: .15em; }
.contact-dialog-head h2 { margin: 3px 0 0; font-size: 1.28rem; letter-spacing: -.035em; }
.chat-online-dot { display: inline-block; width: 7px; height: 7px; margin-right: 4px; background: var(--lime); border-radius: 50%; box-shadow: 0 0 0 4px rgba(200,244,79,.13); }
.contact-close { display: grid; place-items: center; width: 40px; height: 40px; padding: 0; color: var(--night); background: var(--lime); border: 0; cursor: pointer; font-size: 1.55rem; line-height: 1; }
.contact-window-actions { display: flex; align-items: center; gap: 6px; }
.contact-minimize { display: grid; place-items: center; width: 40px; height: 40px; padding: 0; color: #fff; background: #26352f; border: 1px solid #5a6a62; cursor: pointer; font-size: 1.35rem; line-height: 1; }
.chat-shell { min-height: 0; display: grid; grid-template-rows: auto minmax(180px, 1fr) auto; background: #eef1ed; }
.chat-profile { padding: 14px 16px 12px; background: #fff; border-bottom: 1px solid var(--line); }
.chat-profile > p { margin: 0 0 10px; color: var(--muted); font-size: .7rem; line-height: 1.45; }
.contact-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.chat-profile .contact-form-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
.chat-profile label, .contact-form label { display: flex; flex-direction: column; gap: 5px; }
.chat-profile label > span, .contact-form label > span { color: #52605b; font-size: .64rem; font-weight: 900; }
.chat-profile label em { color: var(--muted); font-weight: 600; }
.chat-profile input, .contact-form textarea { width: 100%; min-height: 42px; padding: 9px 10px; color: var(--ink); background: var(--surface); border: 1px solid var(--line-dark); border-radius: 0; outline: 0; }
.chat-profile input:focus, .contact-form textarea:focus { background: #fff; border-color: var(--violet); box-shadow: 0 0 0 3px rgba(121,87,255,.14); }
.contact-form textarea:user-invalid { border-color: var(--red); }
.chat-messages { min-height: 0; display: flex; flex-direction: column; gap: 10px; overflow: auto; padding: 18px 16px; background: linear-gradient(145deg, #eef2ec, #f8faf6 65%); overscroll-behavior: contain; }
.chat-empty { display: grid; place-items: center; align-content: center; gap: 7px; min-height: 100%; color: var(--muted); text-align: center; }
.chat-empty > span { display: grid; place-items: center; width: 48px; height: 48px; color: var(--night); background: var(--lime); font-size: 1.2rem; transform: rotate(-3deg); }
.chat-empty strong { color: var(--ink); font-size: .8rem; }
.chat-empty small { font-size: .65rem; }
.chat-bubble { align-self: flex-start; max-width: 82%; padding: 10px 12px 8px; color: var(--ink); background: #fff; border-left: 3px solid var(--violet); box-shadow: 0 8px 18px rgba(11,17,16,.08); }
.chat-bubble.visitor { align-self: flex-end; color: #fff; background: var(--violet); border-left-color: var(--lime); }
.chat-bubble p { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; font-size: .76rem; line-height: 1.45; }
.chat-bubble time { display: block; margin-top: 5px; color: #7d8984; font-size: .54rem; text-align: right; }
.chat-bubble.visitor time { color: #ded8ff; }
.contact-form { display: grid; gap: 8px; padding: 12px 14px 11px; background: #fff; border-top: 1px solid var(--line); }
.contact-form textarea { min-height: 64px; max-height: 140px; resize: vertical; }
.chat-compose-actions { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 10px; }
.chat-compose-actions .btn { min-width: 104px; }
.contact-honey { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.contact-privacy { margin: 0; color: var(--muted); font-size: .56rem; line-height: 1.4; }
.contact-status { display: none; padding: 8px 9px; color: #36520b; background: #effbd6; border-left: 3px solid var(--lime-deep); font-size: .64rem; line-height: 1.35; }
.contact-status.show { display: block; }
.contact-status.error { color: #7b2923; background: #fff0ee; border-left-color: var(--red); }
.chat-identity-prompt { padding: 11px; color: var(--ink); background: #fff7df; border-left: 4px solid #f4c24f; }
.chat-identity-prompt[hidden] { display: none; }
.chat-identity-prompt strong { display: block; font-size: .76rem; }
.chat-identity-prompt p { margin: 4px 0 9px; color: #735116; font-size: .63rem; line-height: 1.4; }
.chat-identity-prompt > div { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; }
.chat-identity-prompt .btn { min-height: 34px; padding: 6px 8px; font-size: .63rem; }
.contact-form[aria-busy="true"] { opacity: .72; pointer-events: none; }

@media (max-width: 1280px) {
  .studio-grid { grid-template-columns: minmax(0,1fr) 330px; }
  .product-workspace { grid-template-columns: minmax(0,1fr) 260px; }
  .armor-controls { grid-template-columns: 1fr; }
  .dragon-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .chest-type-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
}

@media (max-width: 1040px) {
  .studio-grid { grid-template-columns: 1fr; }
  .order-rail { position: static; max-height: none; }
  .rail-list { max-height: 380px; }
  .hero { grid-template-columns: 1fr; }
  .intro-guide { grid-template-columns: 1fr; }
  .hero-stats { grid-template-columns: repeat(5,1fr); width: auto; border-top: 1px solid rgba(255,255,255,.14); border-left: 0; }
  .hero-stats > div { flex-direction: column; align-items: flex-start; padding: 16px; border-right: 1px solid rgba(255,255,255,.14); border-bottom: 0; }
  .hero-stats > div:last-child { border-right: 0; }
}

@media (max-width: 820px) {
  .topbar { grid-template-columns: 1fr auto; gap: 12px; padding: 10px 14px; }
  .topbar-note { display: none; }
  .topbar > .language-switcher { grid-column: 1 / -1; grid-row: 2; }
  .topbar > .contact-actions { grid-column: 1 / -1; grid-row: 3; min-width: 0; width: 100%; justify-content: flex-end; flex-wrap: wrap; }
  .account-copy { display: none; }
  .page { padding: 18px 12px 50px; }
  .hero { min-height: 0; padding: 32px 24px; }
  .hero h1 { font-size: clamp(2.5rem, 11vw, 4rem); }
  .guide-grid { grid-template-columns: 1fr; }
  .guide-grid article { min-height: 0; }
  .tabs { grid-template-columns: 1fr; }
  .workspace-title { align-items: flex-start; flex-direction: column; }
  .workspace-title > p { text-align: left; }
  .product-workspace { grid-template-columns: 1fr; }
  .dragon-filter-bar { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .dragon-filter-bar .btn { grid-column: 1 / -1; }
  .chest-input-card { grid-template-columns: minmax(0,1fr) 140px 95px; }
  .chest-input-card .btn { grid-column: 1 / -1; }
  .details-panel { position: static; }
  .stats-panel { min-height: 240px; }
  .empty-visual { min-height: 210px; }
  .armor-cart-item { grid-template-columns: minmax(0,1fr) auto !important; }
  .armor-item-substat { grid-column: 1 / -1; grid-row: 2; }
  .send-grid { grid-template-columns: repeat(2,1fr); }
}

@media (max-width: 560px) {
  .brand > span:last-child { display: none; }
  .contact-actions .btn { min-height: 36px; padding: 7px 9px; font-size: .65rem; }
  .contact-actions > [data-open-live-chat] { display: none; }
  .account-menu { gap: 4px; padding: 3px; }
  .account-avatar { width: 28px; height: 28px; }
  .account-logout, .account-admin-link { padding: 4px 6px; font-size: .48rem; }
  .account-guest-link { min-height: 34px; padding: 5px 7px; font-size: .49rem; }
  .cart-shortcut { min-height: 36px; padding: 5px 7px; }
  .cart-shortcut-label { display: none; }
  .cart-shortcut-icon { font-size: .9rem; }
  .request-cart-dialog { width: calc(100vw - 10px); max-height: calc(100dvh - 10px); }
  .request-cart-footer { grid-template-columns: 1fr; }
  .request-cart-total { grid-column: 1; }
  .hero-media { min-height: 250px; }
  .hero-stats { grid-template-columns: repeat(2, 1fr); }
  .hero-stats > div { flex-direction: column; align-items: flex-start; padding: 11px; border-right: 1px solid rgba(255,255,255,.14); border-bottom: 0; }
  .category-banner { height: 125px; }
  .armor-filter-panel { padding: 10px; }
  .armor-filter-head { align-items: flex-start; }
  .armor-filter-head h3 { font-size: .9rem; }
  .armor-filter-head p { display: none; }
  .armor-clear-sets { flex: 0 0 auto; min-height: 31px; padding: 5px 8px; font-size: .58rem; }
  .armor-filter-group { grid-template-columns: 1fr; gap: 6px; margin-top: 8px; padding-top: 8px; }
  .armor-filter-label > span { width: 22px; height: 22px; }
  .armor-filter-label strong { font-size: .69rem; }
  .armor-filter-label small { font-size: .5rem; }
  .armor-set-head { align-items: center; }
  .kind-row { gap: 4px; }
  .kind-row .chip { min-height: 23px; padding: 2px 5px; font-size: .49rem; }
  .armor-kind-check { width: 12px; height: 12px; border-width: 1.5px; font-size: .48rem; }
  .armor-filter-panel .tier-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 4px; overflow: visible; padding: 0; }
  .tier-card { width: 100%; min-width: 0; min-height: 40px; padding: 4px; grid-template-columns: 24px minmax(0,1fr); gap: 4px; }
  .tier-card .tier-symbol { width: 24px; height: 24px; font-size: .45rem; }
  .tier-card .tier-label { font-size: .58rem; }
  .tier-card .tier-count { margin-top: 1px; font-size: .45rem; }
  .armor-sets { display: grid; grid-template-columns: 1fr; gap: 4px; overflow: visible; padding: 0; }
  .armor-filter-panel .armor-sets label { width: 100%; min-width: 0; min-height: 40px; padding: 4px 5px; }
  .armor-set-name { white-space: normal; font-size: .53rem; }
  .armor-sets .el { font-size: .4rem; }
  .armor-set-piece-list { grid-template-columns: 1fr; }
  .armor-exact-substats ul { grid-template-columns: 1fr; }
  .armor-shared-substats .armor-item-substat-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .armor-piece-substats .armor-item-substat-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .config-panel.rune-config-panel { padding: 10px; }
  .rune-config-panel .config-head { margin-bottom: 8px; }
  .rune-config-panel .config-form { display: grid; grid-template-columns: 64px minmax(0,1fr) auto; align-items: end; gap: 5px; padding: 7px; }
  .rune-config-panel .config-form > label { min-width: 0; }
  .rune-config-panel .config-form label > span, .rune-config-panel .level-pick legend { font-size: .55rem; }
  .rune-config-panel .config-form input[type="number"] { min-height: 32px; padding: 5px 7px; font-size: .68rem; }
  .rune-config-panel .level-pick { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); min-width: 0; gap: 4px; }
  .rune-config-panel .level-pick legend { grid-column: 1 / -1; margin: 0; }
  .rune-config-panel .level-pick .chip { position: relative; justify-content: flex-start; min-width: 0; min-height: 32px; padding: 4px 5px; font-size: .52rem; line-height: 1.05; }
  .rune-config-panel .level-pick .chip::before { width: 13px; height: 13px; border-width: 1.5px; }
  .rune-config-panel .config-form > .btn { min-height: 32px; padding: 5px 7px; font-size: .53rem; }
  .rune-config-panel .config-list { max-height: 260px; margin-top: 7px; padding: 5px; }
  .rune-config-panel .cart-list li { grid-template-columns: minmax(0,1fr) 43px 32px; gap: 5px; margin-bottom: 4px; padding: 7px; }
  .rune-config-panel .cart-list .nm { font-size: .66rem; line-height: 1.2; }
  .rune-config-panel .cart-list .id { margin-top: 2px; font-size: .51rem; }
  .rune-config-panel .cart-list input[type="number"] { width: 43px; min-height: 30px; padding: 4px; font-size: .62rem; }
  .rune-config-panel .cart-list .btn { width: 32px; min-height: 30px; padding: 3px; font-size: .58rem; }
  .rune-config-panel .commit-row { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 8px; margin-top: 8px; padding-top: 8px; }
  .rune-config-panel .commit-row strong { font-size: .65rem; }
  .rune-config-panel .commit-row span { font-size: .53rem; }
  .rune-config-panel .commit-row .btn { min-height: 34px; padding: 6px 8px; font-size: .56rem; white-space: nowrap; }
  .mode-card, .control-block, .config-panel, .order-rail { padding: 15px; }
  .search-dock { grid-template-columns: 38px minmax(0,1fr); }
  .search-icon { width: 36px; height: 36px; }
  .search-hint { display: none; }
  .rune-search-dock { grid-template-columns: 48px minmax(0,1fr); min-height: 80px; padding: 13px; }
  .rune-search-dock .search-icon { width: 42px; height: 42px; font-size: 1.85rem; }
  .rune-search-dock label > span { font-size: .67rem; }
  .rune-search-dock input { font-size: 1rem; line-height: 1.25; }
  .filter-drawer > summary { align-items: center; }
  .open-label { display: inline-flex; }
  .cat-grid { grid-template-columns: 1fr; }
  .filter-drawer .cat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .filter-drawer .cat-grid label { min-height: 34px; padding: 5px 6px; }
  .number-add, .commit-row { align-items: stretch; flex-direction: column; }
  .filter-drawer .number-add { align-items: end; flex-direction: row; }
  .tier-grid { grid-template-columns: 1fr; }
  .dragon-filter-bar { grid-template-columns: 1fr; }
  .dragon-grid { grid-template-columns: 1fr; max-height: 610px; }
  .dragon-selection-bar, .dragon-cart-tools { align-items: stretch; flex-direction: column; }
  .chest-type-grid { grid-template-columns: repeat(3, minmax(0,1fr)); gap: 4px; }
  .chest-type { min-height: 72px; padding: 7px; }
  .chest-type > span { width: 25px; height: 25px; margin-bottom: 1px; font-size: .58rem; }
  .chest-type strong { font-size: .6rem; }
  .chest-type small { display: none; }
  .chest-quick-row { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 4px; overflow: visible; }
  .chest-quick-row > span { grid-column: 1 / -1; margin: 0; }
  .chest-quick-row button { min-width: 0; padding: 5px 3px; font-size: .57rem; }
  .chest-input-card { grid-template-columns: 1fr; }
  .chest-input-card .btn { grid-column: auto; }
  .chest-results { grid-template-columns: 1fr; }
  .chest-cascade-explainer { grid-template-columns: 25px minmax(0,1fr); gap: 7px; padding: 8px; }
  .cascade-explainer-mark { width: 24px; height: 24px; font-size: .7rem; }
  .chest-cascade-explainer p { font-size: .56rem; }
  .cascade-number-example { display: grid; grid-template-columns: 1fr auto 1fr; gap: 4px; }
  .cascade-number-example span { padding: 4px; font-size: .5rem; }
  .expedite-total-card { align-items: flex-start; flex-direction: column; gap: 6px; padding: 9px; }
  .expedite-total-card > span { max-width: none; text-align: left; }
  .gold-package-panel { padding: 10px; }
  .gold-package-head { align-items: flex-start; }
  .gold-package-head h3 { font-size: .88rem; }
  .gold-package-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 4px; margin-top: 10px; }
  .gold-package { min-height: 54px; padding: 6px; grid-template-columns: 29px minmax(0,1fr); gap: 1px 5px; }
  .gold-package > span { width: 29px; height: 29px; font-size: .55rem; }
  .gold-package strong { font-size: .6rem; }
  .gold-package small { font-size: .45rem; }
  .gold-service-info { grid-template-columns: 36px minmax(0,1fr); gap: 8px; padding: 10px; }
  .gold-service-mark { width: 36px; height: 36px; font-size: .78rem; }
  .gold-service-info h3 { font-size: .76rem; }
  .gold-service-info p { font-size: .54rem; line-height: 1.4; }
  .gold-commit-row { align-items: stretch; flex-direction: column; gap: 7px; }
  .gold-commit-row .btn { width: 100%; }
  .research-tier-controls { align-items: stretch; flex-direction: column; }
  .research-tier-actions { width: 100%; }
  .research-tier-actions .btn { flex: 1; }
  .research-tier-option { min-height: 31px; padding: 4px 7px; font-size: .57rem; }
  .research-tier-option input { width: 16px; height: 16px; }
  .research-tier-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 4px; overflow: visible; padding: 8px 0 4px; }
  .research-tier-option { min-width: 0; padding: 4px; overflow-wrap: anywhere; }
  .research-tree-wrap { max-height: none; margin-right: -15px; margin-left: -15px; padding: 6px; border-right: 0; border-left: 0; }
  .research-tree { grid-template-rows: repeat(4, 82px); grid-auto-columns: 172px; min-height: 355px; gap: 8px 14px; }
  .research-node { padding: 8px; grid-template-columns: 32px minmax(0,1fr); column-gap: 7px; }
  .research-node-number { width: 32px; height: 32px; }
  .research-tree-exact .research-link-map line, .research-tree-tier .research-link-map line { stroke-width: 3; }
  .research-tree-exact .research-node, .research-tree-tier .research-node { padding: 5px; grid-template-columns: 23px minmax(0,1fr); column-gap: 4px; }
  .research-tree-exact .research-node-number, .research-tree-tier .research-node-number { width: 23px; height: 23px; font-size: .5rem; }
  .research-tree-exact .research-node-copy, .research-tree-tier .research-node-copy { padding-right: 8px; }
  .research-tree-exact .research-node-copy strong, .research-tree-tier .research-node-copy strong { font-size: .53rem; line-height: 1.1; }
  .research-tree-exact .research-node-copy small, .research-tree-tier .research-node-copy small { margin-top: 2px; font-size: .39rem; }
  .research-tree-exact .research-node-mark, .research-tree-tier .research-node-mark { top: 3px; right: 4px; font-size: .62rem; }
  .research-tree-exact .research-node.selected .research-node-mark, .research-tree-tier .research-node.selected .research-node-mark { width: auto; height: auto; min-height: 13px; padding: 2px 3px; top: 2px; right: 2px; font-size: .34rem; }
  .research-tree-exact .research-node.selected .research-node-copy, .research-tree-tier .research-node.selected .research-node-copy { padding-right: 28px; }
  .research-slider-toolbar { gap: 3px; max-width: calc(100vw - 24px); margin: 0 0 5px 1px; }
  .research-doubletap-tip { min-height: 27px; }
  .research-doubletap-tip strong, .research-doubletap-tip span { padding: 5px 6px; font-size: .48rem; }
  .research-slider-add-all { min-height: 27px; padding: 4px 6px; font-size: .45rem; }
  .research-cart-tools { align-items: stretch; flex-direction: column; }
  .table-wrap { max-height: 420px; }
  #panelRunes table, #panelArmor table, #panelRunes tbody, #panelArmor tbody { display: block; width: 100%; min-width: 0; }
  #panelRunes thead, #panelArmor thead { display: none; }
  #panelRunes tbody, #panelArmor tbody { padding: 6px; }
  #panelRunes tbody tr, #panelArmor tbody tr { display: grid; width: 100%; min-width: 0; margin-bottom: 5px; padding: 6px; background: #f7f9f6; border: 1px solid var(--line); }
  #panelRunes tbody tr { grid-template-columns: 40px auto minmax(0,1fr); align-items: center; gap: 2px 7px; }
  #panelRunes tbody td, #panelArmor tbody td { position: static; width: auto; padding: 0; background: transparent !important; border: 0; }
  #runeBody .select-cell { grid-column: 1; grid-row: 1 / 3; }
  #runeBody .rune-number { grid-column: 2; grid-row: 1; color: var(--violet); font-size: .58rem; font-weight: 950; }
  #runeBody .rune-name { grid-column: 3; grid-row: 1; font-size: .67rem; }
  #runeBody .rune-rarity { grid-column: 2; grid-row: 2; color: var(--muted); font-size: .52rem; }
  #runeBody .rune-slot { grid-column: 3; grid-row: 2; color: var(--muted); font-size: .52rem; }
  #panelArmor tbody tr { grid-template-columns: 38px minmax(0,1fr) auto; align-items: center; gap: 3px 7px; }
  #armorBody .select-cell { grid-column: 1; grid-row: 1 / 4; }
  #armorBody .armor-number { grid-column: 2; grid-row: 1; color: var(--violet); font-size: .55rem; font-weight: 950; }
  #armorBody .armor-tier-cell { grid-column: 3; grid-row: 1; color: var(--muted); font-size: .5rem; font-weight: 850; }
  #armorBody .armor-name-cell { grid-column: 2 / 4; grid-row: 2; min-width: 0; font-size: .64rem; line-height: 1.15; }
  #armorBody .armor-set-cell { grid-column: 2; grid-row: 3; color: var(--muted); font-size: .49rem; }
  #armorBody .armor-slot-cell { grid-column: 3; grid-row: 3; color: var(--ink); font-size: .49rem; font-weight: 850; }
  #armorBody .armor-element-cell { grid-column: 2; grid-row: 4; color: var(--muted); font-size: .46rem; }
  #armorBody .armor-kind-cell { grid-column: 3; grid-row: 4; color: var(--muted); font-size: .46rem; }
  .armor-item-substat-grid { grid-template-columns: 1fr; }
  .send-grid { grid-template-columns: 1fr; }
  .rail-action-grid { grid-template-columns: 1fr; }
  .contact-fab { right: 12px; bottom: 12px; min-height: 52px; padding: 7px 12px 7px 7px; }
  .contact-fab-icon { width: 37px; height: 37px; }
  .contact-dialog { width: calc(100vw - 12px); height: calc(100dvh - 12px); max-height: calc(100dvh - 12px); }
  .contact-dialog-head { padding: 14px; }
  .chat-profile { padding: 11px 12px; }
  .chat-messages { padding: 13px 12px; }
  .contact-form { gap: 8px; padding: 10px 12px; }
  .contact-form-grid { grid-template-columns: 1fr; }
  .chat-profile .contact-form-grid { grid-template-columns: 1fr; }
  .chat-identity-prompt > div { grid-template-columns: 1fr; }
}

.request-disclaimer{display:flex;align-items:flex-start;gap:9px;margin:13px 0;padding:11px 12px;border:1px solid #547044;background:#121e15;color:#dcebc7;font-size:.72rem;line-height:1.38;border-radius:8px;cursor:pointer}.request-disclaimer input{appearance:auto;margin:2px 0 0;inline-size:17px;block-size:17px;flex:0 0 auto;accent-color:#c6fb39}.request-disclaimer a{color:#c6fb39;font-weight:900}
.request-disclaimer-panel{margin:13px 0;padding:13px;border:1px solid #5a6f3b;border-radius:9px;background:#121b14;color:#dce7dc}.request-disclaimer-panel>strong{display:block;color:#c6fb39;font-size:.72rem;letter-spacing:.055em}.request-disclaimer-panel>p{margin:6px 0;color:#b9c5ba;font-size:.63rem}.request-disclaimer-panel>ul{margin:7px 0 10px;padding-left:17px;display:grid;gap:4px;color:#cbd5cc;font-size:.59rem;line-height:1.35}.request-disclaimer-panel .request-disclaimer{margin:0;padding:10px;background:#1b291d;border-color:#7e9b47;font-size:.67rem;font-weight:850}.request-disclaimer-panel .request-disclaimer:focus-within{outline:2px solid #c6fb39;outline-offset:2px}
.request-disclaimer-dialog{width:min(650px,calc(100vw - 22px));max-height:calc(100dvh - 22px);margin:auto;padding:0;overflow:hidden;color:#edf5ef;background:#0f1916;border:0;box-shadow:0 28px 90px rgba(0,0,0,.58)}.request-disclaimer-dialog[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto}.request-disclaimer-dialog::backdrop{background:rgba(4,8,7,.8);backdrop-filter:blur(6px)}.request-disclaimer-head{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:17px 19px;color:#fff;background:#0b1110;border-bottom:4px solid #c6fb39}.request-disclaimer-head small{color:#c6fb39;font-size:.55rem;font-weight:950;letter-spacing:.13em}.request-disclaimer-head h2{margin:4px 0 0;font-size:1.12rem}.request-disclaimer-head button{display:grid;place-items:center;width:38px;height:38px;padding:0;color:#101808;background:#c6fb39;border:0;font-size:1.45rem;cursor:pointer}.request-disclaimer-body{overflow:auto;padding:18px}.request-disclaimer-body>p{margin:0 0 10px;color:#b9c5bc;font-size:.76rem}.request-disclaimer-body>ul{margin:0 0 16px;padding-left:21px;display:grid;gap:7px;color:#d5dfd7;font-size:.72rem;line-height:1.45}.request-disclaimer-dialog .request-disclaimer{margin:0;background:#1b291d;border-color:#789548;font-size:.75rem;font-weight:850}.request-disclaimer-actions{display:grid;grid-template-columns:1fr 2fr;gap:9px;padding:13px 18px;background:#0b1110;border-top:1px solid #34463d}.request-disclaimer-actions .btn{min-height:44px}@media(max-width:600px){.request-disclaimer-head{padding:13px}.request-disclaimer-head h2{font-size:.9rem}.request-disclaimer-body{padding:13px}.request-disclaimer-body>ul{font-size:.66rem}.request-disclaimer-actions{grid-template-columns:1fr;padding:10px 13px}}

/* Compact authenticated workspace */
.account-menu{position:relative;padding:0;background:transparent;border:0}.personal-area-toggle{display:flex;align-items:center;gap:8px;min-height:42px;padding:5px 9px;color:#fff;background:#18251f;border:1px solid #43534b;cursor:pointer}.account-vip-icon{display:grid;place-items:center;width:29px;height:29px;color:#101808;background:var(--lime);font-size:.85rem}.personal-area-toggle .account-copy{display:block;text-align:left}.personal-area-toggle .account-copy small,.personal-area-toggle .account-copy strong{display:block}.personal-area-toggle .account-copy small{color:var(--lime);font-size:.48rem;letter-spacing:.08em}.personal-area-toggle .account-copy strong{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.68rem}.personal-area-dropdown{position:absolute;z-index:80;top:calc(100% + 7px);right:0;display:grid;width:min(270px,calc(100vw - 22px));padding:7px;color:#fff;background:#0b1110;border:1px solid #415149;box-shadow:0 18px 45px #0008}.personal-area-dropdown[hidden]{display:none}.personal-area-dropdown>a,.personal-area-dropdown>button,.personal-language>button,.personal-language-options button,.personal-notifications button{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:39px;padding:8px 10px;color:#fff;background:#18251f;border:0;border-bottom:1px solid #34443d;text-decoration:none;font-size:.66rem;font-weight:900;cursor:pointer}.personal-area-dropdown>a:hover,.personal-area-dropdown>button:hover,.personal-language button:hover,.personal-notifications button:hover{color:#101808;background:var(--lime)}.personal-language-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3px;padding:5px;background:#101a17}.personal-language-options[hidden]{display:none}.personal-language-options button{min-height:32px;border:0;font-size:.58rem}.personal-notifications small{display:block;padding:6px;color:#aebbb4;font-size:.54rem;line-height:1.35}.personal-notifications[hidden],.personal-notifications button[hidden]{display:none}

@media(max-width:560px){.personal-area-toggle{min-height:36px;padding:3px 6px}.account-vip-icon{width:27px;height:27px}.personal-area-toggle .account-copy{display:block}.personal-area-toggle .account-copy small{font-size:.4rem}.personal-area-toggle .account-copy strong{max-width:82px;font-size:.58rem}.personal-area-dropdown{position:fixed;top:62px;right:7px}.chat-profile input,.contact-form textarea,.customer-order-chat textarea,.direct-chat-form textarea{font-size:16px!important;line-height:1.35}.contact-dialog[open]{height:var(--chat-viewport-height,calc(100dvh - 8px));max-height:var(--chat-viewport-height,calc(100dvh - 8px));margin:4px auto}.chat-shell{min-height:0;grid-template-rows:auto minmax(0,1fr) auto}.contact-form{position:relative;z-index:2;padding-bottom:max(10px,env(safe-area-inset-bottom))}.contact-form textarea{min-height:52px;max-height:96px;resize:none}}

/* Floating support window: compact on desktop and stable above mobile keyboards. */
@media(max-width:560px){
  .contact-dialog,.contact-dialog[open]{inset:auto 8px max(8px,env(safe-area-inset-bottom)) 8px;width:auto;height:min(64dvh,520px);max-height:calc(100dvh - 16px);margin:0}
  .contact-dialog.keyboard-open,.contact-dialog.keyboard-open[open]{top:var(--chat-viewport-top,6px);right:6px;bottom:auto;left:6px;height:var(--chat-viewport-height,calc(100dvh - 12px));max-height:var(--chat-viewport-height,calc(100dvh - 12px))}
  .contact-dialog.keyboard-open .chat-profile{display:none}
  .contact-dialog-head{padding:10px 12px}
  .contact-dialog-head h2{font-size:1rem}
  .contact-close,.contact-minimize{width:34px;height:34px}
  .chat-shell{height:100%;overflow:hidden}
  .chat-messages{min-height:0;overflow-y:auto}
  .contact-form{flex:0 0 auto;padding-bottom:max(9px,env(safe-area-inset-bottom))}
  .contact-form textarea{font-size:16px!important;min-height:48px;max-height:82px}
}

@media(min-width:561px) and (max-width:820px){
  .contact-dialog,.contact-dialog[open]{inset:auto 12px 72px auto;width:min(370px,calc(100vw - 24px));height:min(540px,calc(100dvh - 92px));max-height:calc(100dvh - 92px);margin:0}
}

/* Phone-first polish: compact navigation, shorter hero and unobtrusive support. */
@media(max-width:560px){
  .topbar{
    grid-template-columns:40px minmax(0,1fr);
    gap:6px 8px;
    min-height:0;
    padding:max(6px,env(safe-area-inset-top)) 8px 7px;
  }
  .topbar>.brand{grid-column:1;grid-row:1;align-self:center}
  .topbar>.language-switcher{
    grid-column:2;
    grid-row:1;
    justify-self:stretch;
    width:auto;
    min-width:0;
    padding:2px;
  }
  .topbar>.contact-actions{
    grid-column:1/-1;
    grid-row:2;
    justify-content:space-between;
    flex-wrap:nowrap;
    gap:5px;
  }
  .brand-mark{width:38px;height:38px}
  .brand-mark b{left:6px;bottom:4px;font-size:1.38rem}
  .brand-mark i{right:3px;top:5px;font-size:.36rem}
  .topbar .language-switcher button{height:28px;padding:2px}
  .topbar .language-flag{width:24px;height:15px}
  .contact-actions>.account-menu{min-width:0;max-width:calc(100% - 45px)}
  .personal-area-toggle{max-width:100%;min-height:34px}
  .personal-area-toggle .account-copy{min-width:0}
  .personal-area-toggle .account-copy strong{max-width:120px}
  .cart-shortcut{flex:0 0 auto;min-height:34px}

  .page{padding:10px 8px 44px}
  .hero{gap:18px;margin-bottom:12px;padding:20px 16px}
  .hero-brand-display{margin-bottom:8px;font-size:1.3rem}
  .version-tag{padding:5px 7px;font-size:.5rem;letter-spacing:.08em;line-height:1.25}
  .hero h1{margin:14px 0 12px;font-size:clamp(2.05rem,10.5vw,2.8rem);line-height:.94}
  .hero-copy p{font-size:.88rem;line-height:1.5}
  .hero-actions{gap:7px;margin-top:17px}
  .hero-actions .btn{min-height:40px;padding:8px 10px;font-size:.65rem}
  .hero-actions .btn-app-download{width:100%;justify-content:center}
  .hero-media{min-height:210px}
  .hero-stats>div{padding:9px 11px}
  .hero-stats strong{font-size:1.35rem}
  .hero-stats span{font-size:.61rem}
  .intro-guide{gap:15px;margin-bottom:12px;padding:16px}
  .intro-guide-head p{font-size:.72rem}
  .guide-grid article{padding:12px}
  .guide-grid p{font-size:.69rem}

  .contact-fab{
    right:max(10px,env(safe-area-inset-right));
    bottom:max(10px,env(safe-area-inset-bottom));
    display:grid;
    place-items:center;
    width:46px;
    height:46px;
    min-height:46px;
    padding:5px;
    border:2px solid rgba(255,255,255,.82);
    border-radius:50%;
    box-shadow:0 12px 28px rgba(11,17,16,.34);
  }
  .contact-fab:hover{transform:none}
  .contact-fab>span:nth-child(2){display:none}
  .contact-fab-icon{width:34px;height:34px;border-radius:50%;font-size:1rem;transform:none}
  .contact-fab-unread{display:grid;top:-6px;right:-6px;min-width:21px;height:21px;border-width:2px}
  .contact-fab-unread[hidden]{display:none}
}