*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    :root {
      --bg: #0d0b08; --surface: #13110d; --card: #1a1712; --border: #2e2a22;
      --gold: #c9a84c; --gold-dim: #8a6f30; --gold-glow: #e0b85a;
      --text: #d4c9b0; --text-dim: #7a7060; --green: #4caf7a; --red: #c44444;
      --ui-brightness-overlay: transparent;
      --ui-brightness-opacity: 0;
      --ui-font-scale: 1;
    }
    body { background: var(--bg); color: var(--text); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: calc(14px * var(--ui-font-scale)); min-height: 100vh; overflow-x: hidden; }
    body.font-readable { font-family: Verdana, Geneva, sans-serif; }
    body.font-classic { font-family: Georgia, 'Times New Roman', serif; }
    body.font-classic input, body.font-classic button, body.font-classic select, body.font-classic textarea,
    body.font-readable input, body.font-readable button, body.font-readable select, body.font-readable textarea { font-family: inherit; }
    body::before { content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 0;
      background: radial-gradient(ellipse 80% 50% at 50% -10%, rgba(201,168,76,0.07) 0%, transparent 60%),
                  radial-gradient(ellipse 40% 30% at 80% 80%, rgba(155,111,212,0.04) 0%, transparent 50%); }
    body::after { content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 99998; background: var(--ui-brightness-overlay); opacity: var(--ui-brightness-opacity); }
    header { position: relative; z-index: 10; display: flex; align-items: center; justify-content: space-between; gap: 14px 20px; flex-wrap: wrap;
      padding: 10px 40px; min-height: 86px; background: rgba(13,11,8,0.95); border-bottom: 1px solid var(--border); backdrop-filter: blur(8px); }
    .logo { font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; font-size: 20px; font-weight: 700; letter-spacing: 0.08em; color: var(--gold); text-shadow: 0 0 20px rgba(201,168,76,0.4); display:flex; align-items:center; gap:10px; text-decoration:none; cursor:pointer; }
    nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; flex: 1 1 620px; max-width: 980px; }
    .nav-btn { background: none; border: 1px solid transparent; color: var(--text-dim); font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; font-size: 10px; letter-spacing: 0.08em; padding: 7px 12px; min-height: 31px; cursor: pointer; border-radius: 4px; transition: all 0.2s; text-transform: uppercase; white-space: nowrap; }
    .nav-btn:hover { color: var(--gold); border-color: var(--border); }
    .nav-btn.active { color: var(--gold); border-color: var(--gold-dim); background: rgba(201,168,76,0.07); }
    .logout-btn { background: rgba(196,68,68,0.08); border: 1px solid rgba(196,68,68,0.45); color: #e06060; font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; font-size: 11px; letter-spacing: 0.1em; padding: 7px 14px; cursor: pointer; border-radius: 4px; transition: all 0.2s; text-transform: uppercase; }
    .logout-btn:hover { background: rgba(196,68,68,0.16); border-color: #c44444; color: #ff7777; }
    .logout-btn:not(.signed-in) { background: rgba(201,168,76,0.08); border-color: var(--gold-dim); color: var(--gold); }
    .logout-btn:not(.signed-in):hover { background: rgba(201,168,76,0.16); border-color: var(--gold); color: var(--gold-glow); }
    .header-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex: 0 0 auto; }
    .language-select { height: 32px; min-width: 70px; background: #0d0b08; border: 1px solid var(--border); border-radius: 4px; color: var(--gold); font-size: 11px; font-weight: 800; letter-spacing: 0.08em; padding: 0 8px; outline: none; cursor: pointer; }
    .language-select:focus, .language-select:hover { border-color: var(--gold-dim); background: rgba(201,168,76,0.06); }
    .settings-btn { background: rgba(201,168,76,0.08); border: 1px solid var(--border); color: var(--gold); font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; font-size: 11px; letter-spacing: 0.1em; padding: 7px 14px; cursor: pointer; border-radius: 4px; transition: all 0.2s; text-transform: uppercase; }
    .settings-btn:hover, .settings-btn.active { background: rgba(201,168,76,0.16); border-color: var(--gold-dim); color: var(--gold-glow); }
    .settings-panel { position: fixed; top: 98px; right: 18px; z-index: 60; width: min(340px, calc(100vw - 28px)); display: none; background: rgba(19,17,13,0.98); border: 1px solid var(--border); border-radius: 8px; padding: 16px; box-shadow: 0 18px 50px rgba(0,0,0,0.45); backdrop-filter: blur(10px); }
    .settings-panel.open { display: block; }
    .settings-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding-bottom: 12px; border-bottom: 1px solid var(--border); margin-bottom: 14px; }
    .settings-title { color: var(--gold); font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; font-size: 13px; letter-spacing: 0.14em; text-transform: uppercase; }
    .settings-subtitle { color: var(--text-dim); font-size: 11px; margin-top: 3px; }
    .settings-close { width: 30px; height: 30px; background: #0d0b08; border: 1px solid var(--border); border-radius: 4px; color: var(--text-dim); cursor: pointer; }
    .settings-close:hover { color: var(--gold); border-color: var(--gold-dim); }
    .settings-row { display: grid; gap: 8px; margin-bottom: 14px; }
    .settings-row label { color: var(--text-dim); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; }
    .settings-control-line { display: grid; grid-template-columns: 1fr 46px; align-items: center; gap: 10px; }
    .settings-control-line input[type="range"] { width: 100%; accent-color: var(--gold); }
    .settings-control-line span { color: var(--gold-glow); font-size: 12px; text-align: right; font-weight: 700; }
    .settings-segments { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
    .settings-segment { min-height: 34px; background: #0d0b08; border: 1px solid var(--border); border-radius: 4px; color: var(--text-dim); cursor: pointer; font-size: 12px; }
    .settings-segment.active { color: var(--gold); border-color: var(--gold-dim); background: rgba(201,168,76,0.08); }
    .settings-toggle { width: 100%; min-height: 36px; background: #0d0b08; border: 1px solid var(--gold-dim); border-radius: 4px; color: var(--gold); cursor: pointer; font-size: 12px; font-weight: 700; }
    .settings-toggle.off { border-color: var(--border); color: var(--text-dim); background: transparent; }
    .settings-reset { width: 100%; min-height: 36px; margin-top: 2px; background: none; border: 1px solid var(--border); border-radius: 4px; color: var(--text-dim); cursor: pointer; font-size: 12px; }
    .settings-reset:hover { color: var(--gold); border-color: var(--gold-dim); }
    body.font-large .page-title { font-size: 27px; }
    body.font-large .page-subtitle, body.font-large .stat-label, body.font-large .drop-name, body.font-large .mat-card-name, body.font-large .field-input, body.font-large .field-select { font-size: 14px; }
    body.font-xl .page-title { font-size: 30px; }
    body.font-xl .page-subtitle, body.font-xl .stat-label, body.font-xl .drop-name, body.font-xl .mat-card-name, body.font-xl .field-input, body.font-xl .field-select { font-size: 15px; }
    body.font-xl .nav-btn, body.font-xl .logout-btn, body.font-xl .settings-btn { font-size: 12px; }
    .auth-card { background:#1a1712; border:1px solid #2e2a22; border-radius:12px; padding:34px 38px; text-align:center; max-width:420px; width:90%; box-shadow:0 18px 50px rgba(0,0,0,0.38); }
    .auth-title { font-family:'Palatino Linotype','Book Antiqua',Palatino,serif; font-size:15px; color:#c9a84c; letter-spacing:0.1em; margin-bottom:10px; }
    .auth-subtitle { font-size:13px; color:#7a7060; margin-bottom:20px; line-height:1.6; }
    .auth-tabs, .auth-account-tabs { display:grid; grid-template-columns:1fr 1fr; gap:6px; margin-bottom:18px; }
    .auth-tab, .auth-small-tab { background:#0d0b08; border:1px solid #2e2a22; border-radius:5px; color:#7a7060; font-size:12px; font-weight:600; padding:9px 10px; cursor:pointer; }
    .auth-tab.active, .auth-small-tab.active { color:#c9a84c; border-color:#c9a84c; background:rgba(201,168,76,0.08); }
    .auth-panel { display:none; }
    .auth-panel.active { display:block; }
    .discord-login-btn { display:inline-flex; align-items:center; justify-content:center; gap:10px; background:#5865F2; border-radius:8px; color:white; font-size:14px; font-weight:600; padding:12px 28px; cursor:pointer; text-decoration:none; min-height:46px; }
    .auth-input { width:100%; background:#0d0b08; border:1px solid #2e2a22; border-radius:5px; color:#d4c9b0; font-size:13px; padding:11px 12px; outline:none; margin-bottom:8px; }
    .auth-input:focus { border-color:#8a6f30; }
    .auth-submit { width:100%; min-height:42px; background:rgba(201,168,76,0.12); border:1px solid #8a6f30; border-radius:6px; color:#e0b85a; font-size:13px; font-weight:700; cursor:pointer; margin-top:4px; }
    .auth-submit:hover { background:rgba(201,168,76,0.2); border-color:#c9a84c; }
    .auth-submit:disabled { opacity:0.55; cursor:default; }
    .auth-error { min-height:18px; color:#e06060; font-size:12px; margin-top:10px; line-height:1.4; }
    .auth-guest-btn { width:100%; min-height:40px; margin-top:14px; background:transparent; border:1px solid #2e2a22; border-radius:6px; color:#d4c9b0; font-size:12px; font-weight:700; cursor:pointer; transition:all 0.2s; }
    .auth-guest-btn:hover { color:#c9a84c; border-color:#8a6f30; background:rgba(201,168,76,0.07); }
    .auth-guest-note { color:#7a7060; font-size:11px; line-height:1.45; margin-top:8px; }
    .welcome-gate { position:fixed; inset:0; z-index:100001; align-items:center; justify-content:center; padding:clamp(14px,3vw,42px); background:#0d0b08; }
    .welcome-shell { width:min(1160px,100%); min-height:min(760px,calc(100vh - 40px)); display:grid; grid-template-columns:1.08fr .92fr; overflow:hidden; border:1px solid #302a20; border-radius:8px; background:#100d09; box-shadow:0 24px 80px rgba(0,0,0,.48); }
    .welcome-brand-panel { min-width:0; display:flex; flex-direction:column; justify-content:space-between; padding:clamp(32px,5vw,64px); background:radial-gradient(circle at 43% 34%,rgba(110,24,17,.46),transparent 42%),#0d0907; }
    .welcome-brand-mark { width:min(300px,70%); max-height:300px; align-self:center; object-fit:contain; mix-blend-mode:screen; }
    .welcome-brand-copy h1 { margin:24px 0 12px; max-width:500px; color:#f0d270; font-family:'Palatino Linotype','Book Antiqua',Palatino,serif; font-size:clamp(46px,5.4vw,78px); line-height:.92; letter-spacing:0; }
    .welcome-brand-copy p { max-width:480px; margin:0; color:#c6aa69; font-size:14px; line-height:1.65; }
    .welcome-action-panel { display:grid; place-items:center; padding:clamp(28px,5vw,64px); background:#1a1712; }
    .welcome-join-card { width:min(390px,100%); padding:30px; text-align:center; border:1px solid #3a3226; border-radius:8px; background:#14110d; box-shadow:0 18px 50px rgba(0,0,0,.26); }
    .welcome-kicker { display:inline-flex; padding:7px 12px; border:1px solid #755f1d; border-radius:999px; color:#e1bb45; background:rgba(201,168,76,.08); font-family:'Palatino Linotype','Book Antiqua',Palatino,serif; font-size:10px; font-weight:800; letter-spacing:.1em; }
    .welcome-join-card h2 { margin:16px 0 8px; color:#ead8ad; font-family:'Palatino Linotype','Book Antiqua',Palatino,serif; font-size:30px; letter-spacing:0; }
    .welcome-join-copy { margin:0 0 22px; color:#94866e; font-size:13px; line-height:1.65; }
    .welcome-join-note { margin-top:12px; color:#776b58; font-size:11px; line-height:1.5; }
    .join-site-btn { width:100%; min-height:48px; border:1px solid var(--gold); border-radius:6px; background:var(--gold); color:#171208; font-family:'Palatino Linotype','Book Antiqua',Palatino,serif; font-size:15px; font-weight:800; cursor:pointer; }
    .join-site-btn:hover { background:var(--gold-glow); border-color:var(--gold-glow); }
    @media (max-width:760px) { .welcome-gate { padding:10px; } .welcome-shell { min-height:calc(100vh - 20px); grid-template-columns:1fr; overflow-y:auto; } .welcome-brand-panel { min-height:310px; padding:28px; } .welcome-brand-mark { width:150px; max-height:150px; } .welcome-brand-copy h1 { margin-top:16px; font-size:44px; line-height:.95; } .welcome-action-panel { min-height:360px; padding:24px; } }
    body.guest-mode input:disabled,
    body.guest-mode select:disabled,
    body.guest-mode textarea:disabled,
    body.guest-mode button:disabled { opacity:0.48; cursor:not-allowed; }
    body.guest-mode .chat-compose { opacity:0.72; }
    body.guest-mode .mat-price-input,
    body.guest-mode .shop-price-input,
    body.guest-mode #coin-rate-input { color:var(--text-dim); }
    .online-rail { position: fixed; right: 18px; top: 84px; z-index: 20; width: 58px; display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 10px 8px; background: rgba(19,17,13,0.92); border: 1px solid var(--border); border-radius: 8px; backdrop-filter: blur(8px); }
    .online-title { color: var(--gold); font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; writing-mode: vertical-rl; transform: rotate(180deg); margin-bottom: 2px; }
    .online-list { display: flex; flex-direction: column; gap: 8px; align-items: center; }
    .online-avatar { position: relative; width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--gold-dim); object-fit: cover; background: #0d0b08; }
    .online-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--green); border: 2px solid var(--surface); position: absolute; right: 0; bottom: 0; }
    .online-user { position: relative; width: 38px; height: 38px; }
    .support-tab { position: fixed; left: 50%; bottom: 18px; transform: translateX(-50%); z-index: 30; min-width: 520px; max-width: calc(100vw - 32px); min-height: 56px; display: flex; align-items: center; justify-content: center; gap: 16px; padding: 12px 18px; background: rgba(19,17,13,0.96); border: 1px solid var(--border); border-radius: 8px; color: var(--text-dim); text-decoration: none; backdrop-filter: blur(8px); box-shadow: 0 10px 30px rgba(0,0,0,0.34); transition: border-color 0.2s, color 0.2s, background 0.2s, transform 0.2s; }
    .support-tab:hover { color: var(--gold); border-color: var(--gold-dim); background: rgba(26,23,18,0.98); }
    .support-tab:hover { transform: translateX(-50%) translateY(-2px); }
    .support-tab-kicker { color: var(--gold); font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; }
    .support-tab-text { flex: 1; font-size: 13px; line-height: 1.35; text-align: center; }
    .support-tab-action { color: #fff; background: #5865F2; border-radius: 5px; padding: 9px 12px; font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; white-space: nowrap; }
    .chat-widget { position: fixed; right: 18px; bottom: 18px; z-index: 99999; width: 330px; max-width: calc(100vw - 28px); background: rgba(19,17,13,0.99); border: 1px solid var(--gold-dim); border-radius: 8px; box-shadow: 0 18px 50px rgba(0,0,0,0.5), 0 0 18px rgba(201,168,76,0.16); overflow: hidden; backdrop-filter: blur(10px); }
    .chat-header { width: 100%; min-height: 44px; display: flex; align-items: center; justify-content: space-between; gap: 10px; background: rgba(201,168,76,0.14); border: 0; border-bottom: 1px solid var(--border); color: var(--gold-glow); padding: 10px 12px; cursor: pointer; font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; letter-spacing: 0.08em; text-transform: uppercase; }
    .chat-header small { color: var(--text-dim); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: 10px; letter-spacing: 0.04em; text-transform: none; }
    .chat-body { display: grid; grid-template-rows: 260px auto; }
    .chat-widget.collapsed .chat-body { display: none; }
    .chat-messages { overflow-y: auto; padding: 10px 12px; display: flex; flex-direction: column; gap: 8px; scrollbar-color: var(--gold-dim) #0d0b08; }
    .chat-empty { color: var(--text-dim); font-size: 12px; text-align: center; padding: 28px 6px; }
    .chat-message { display: grid; gap: 3px; padding: 7px 8px; border: 1px solid var(--border); border-radius: 6px; background: #0d0b08; }
    .chat-message-head { display: flex; justify-content: space-between; gap: 8px; color: var(--gold); font-size: 11px; font-weight: 700; }
    .chat-message-time { color: var(--text-dim); font-weight: 400; white-space: nowrap; }
    .chat-message-text { color: var(--text); font-size: 12px; line-height: 1.4; overflow-wrap: anywhere; }
    .chat-compose { display: grid; grid-template-columns: 1fr 68px; gap: 6px; padding: 10px; border-top: 1px solid var(--border); background: rgba(13,11,8,0.92); }
    .chat-compose input { min-width: 0; background: #0d0b08; border: 1px solid var(--border); border-radius: 4px; color: var(--text); font-size: 12px; padding: 8px 10px; outline: none; }
    .chat-compose input:focus { border-color: var(--gold-dim); }
    .chat-compose button { border: 1px solid var(--gold-dim); border-radius: 4px; background: rgba(201,168,76,0.12); color: var(--gold); font-size: 12px; font-weight: 700; cursor: pointer; }
    main { position: relative; z-index: 1; max-width: 1200px; margin: 0 auto; padding: 40px 24px 80px; }
    .page { display: none; }
    .page.active { display: block; }
    .page-title { font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; font-size: 24px; color: var(--gold-glow); margin-bottom: 6px; }
    .page-subtitle { color: var(--text-dim); font-size: 13px; margin-bottom: 32px; letter-spacing: 0.04em; }
    .two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
    .section-title { font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; font-size: 12px; font-weight: 600; letter-spacing: 0.15em; color: var(--gold); text-transform: uppercase; display: flex; align-items: center; gap: 12px; margin-bottom: 20px; }
    .section-title::after { content: ''; flex: 1; height: 1px; background: linear-gradient(to right, var(--gold-dim), transparent); }
    .card { background: var(--card); border: 1px solid var(--border); border-radius: 8px; padding: 24px; }
    .notice { display: flex; align-items: center; gap: 10px; background: rgba(201,168,76,0.05); border: 1px dashed var(--gold-dim); border-radius: 6px; padding: 10px 14px; color: var(--text-dim); font-size: 12px; margin-bottom: 20px; }
    .notice b { color: var(--gold); }
    .counter { display: flex; align-items: center; background: #0d0b08; border: 1px solid var(--border); border-radius: 4px; overflow: hidden; }
    .counter button { background: none; border: none; color: var(--gold); font-size: 16px; width: 32px; height: 34px; cursor: pointer; transition: background 0.15s; flex-shrink: 0; }
    .counter button:hover { background: rgba(201,168,76,0.1); }
    .counter input { background: none; border: none; border-left: 1px solid var(--border); border-right: 1px solid var(--border); color: var(--text); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: 13px; font-weight: 600; text-align: center; width: 80px; height: 34px; outline: none; }
    .stat-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
    .stat-label { color: var(--text-dim); font-size: 13px; }
    .yang-stat-input { width: 116px; text-align: right; }
    .metin-picker { display: grid; gap: 10px; margin-bottom: 18px; }
    .metin-group-tabs { display: flex; flex-wrap: wrap; gap: 6px; }
    .metin-group-btn { background: #0d0b08; border: 1px solid var(--border); border-radius: 4px; color: var(--text-dim); font-size: 11px; padding: 7px 10px; cursor: pointer; }
    .metin-group-btn:hover { border-color: var(--gold-dim); color: var(--gold); }
    .metin-group-btn.active { border-color: var(--gold); background: rgba(201,168,76,0.1); color: var(--gold); }
    .computed-stats { border-top: 1px solid var(--border); margin-top: 20px; padding-top: 18px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
    .stat-item .val { font-size: 18px; font-weight: 600; color: var(--gold-glow); }
    .stat-item .lbl { font-size: 11px; color: var(--text-dim); margin-top: 2px; letter-spacing: 0.05em; }
    .yang-result { background: var(--card); border: 1px solid var(--gold-dim); border-radius: 8px; padding: 20px 28px; margin-top: 24px; display: flex; align-items: center; justify-content: space-between; }
    .yang-result .yr-label { font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; font-size: 12px; color: var(--text-dim); letter-spacing: 0.12em; margin-bottom: 4px; }
    .yang-result .yr-value { font-size: 30px; font-weight: 700; color: var(--gold-glow); }
    .yang-result .yr-sub { font-size: 12px; color: var(--text-dim); margin-top: 4px; }
    .drop-item { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--border); }
    .drop-item:last-child { border-bottom: none; }
    .drop-inputs { display: flex; align-items: center; gap: 6px; margin-left: auto; }
    .drop-input-wrap { display: grid; gap: 3px; }
    .drop-input-wrap span { color: var(--text-dim); font-size: 9px; text-transform: uppercase; letter-spacing: 0.06em; text-align: center; }
    .drop-input-wrap .price-input { width: 62px; text-align: center; }
    .drop-amount { color: var(--gold); font-size: 11px; font-weight: 700; margin-left: 4px; }
    .drop-rarity { font-weight: 700; }
    .drop-rarity.guaranteed { color: #e8e8e8; }
    .drop-rarity.common { color: #49c853; }
    .drop-rarity.rare { color: #31a7dc; }
    .drop-rarity.epic { color: #a66af1; }
    .drop-rarity.legendary { color: #e0a935; }
    .drop-rarity.mystic { color: #ff6848; }
    .drop-icon { width: 36px; height: 36px; border-radius: 5px; background: #0d0b08; border: 1px solid var(--border); display: flex; align-items: center; justify-content: center; font-size: 16px; flex-shrink: 0; }
    .drop-info { flex: 1; }
    .drop-name { font-size: 13px; font-weight: 500; }
    .drop-rate { font-size: 11px; color: var(--text-dim); margin-top: 2px; }
    .price-input { background: #0d0b08; border: 1px solid var(--border); border-radius: 4px; color: var(--gold-glow); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: 12px; font-weight: 600; text-align: right; padding: 6px 10px; width: 120px; outline: none; transition: border-color 0.2s; }
    .price-input:focus { border-color: var(--gold-dim); }
    .price-input::placeholder { color: var(--text-dim); font-weight: 400; }
    .mat-search-row { display: flex; gap: 10px; margin-bottom: 20px; }
    .mat-search { flex: 1; background: #0d0b08; border: 1px solid var(--border); border-radius: 4px; color: var(--text); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: 13px; padding: 9px 14px; outline: none; transition: border-color 0.2s; }
    .mat-search:focus { border-color: var(--gold-dim); }
    .mat-search::placeholder { color: var(--text-dim); }
    .mat-stats-bar { display: flex; gap: 24px; margin-bottom: 24px; }
    .mat-stat { background: var(--card); border: 1px solid var(--border); border-radius: 6px; padding: 12px 18px; }
    .mat-stat .ms-val { font-size: 20px; font-weight: 700; color: var(--gold-glow); }
    .mat-stat .ms-lbl { font-size: 11px; color: var(--text-dim); margin-top: 2px; letter-spacing: 0.05em; }
    .price-source-card { display: flex; align-items: center; justify-content: space-between; gap: 16px; background: var(--card); border: 1px solid var(--border); border-radius: 6px; padding: 14px 16px; margin-bottom: 14px; }
    .price-source-title { color: var(--gold); font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 4px; }
    .price-source-status { color: var(--text-dim); font-size: 12px; }
    .price-source-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
    .price-report-reward { position:relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(190px, 280px); align-items: center; gap: 16px; padding: 15px 16px; margin: 0 0 14px; border: 1px solid var(--gold-dim); border-left:3px solid var(--gold); border-radius: 6px; background: linear-gradient(90deg, rgba(215,174,67,.13), rgba(215,174,67,.035)); box-shadow:0 10px 28px rgba(0,0,0,.18); }
    .price-report-reward .field-input { width: 100%; }
    .price-report-callout-arrow { position:absolute; right:24px; top:-34px; color:var(--gold-glow); font-size:32px; font-weight:800; line-height:1; text-shadow:0 0 12px rgba(224,190,91,.35); animation:priceRewardPoint 1.4s ease-in-out infinite; pointer-events:none; }
    .price-report-callout-title { color:var(--gold-glow); font-family:'Palatino Linotype','Book Antiqua',Palatino,serif; font-size:15px; font-weight:800; letter-spacing:0; }
    .price-report-callout-copy { margin-top:4px; color:var(--text); font-size:12px; line-height:1.45; }
    .price-report-callout-claim { margin-top:5px; color:var(--gold); font-size:11px; font-weight:700; }
    @keyframes priceRewardPoint { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-5px); } }
    .price-health-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 14px; }
    .price-health-card { background: var(--card); border: 1px solid var(--border); border-radius: 6px; padding: 14px 16px; min-width: 0; }
    .auction-layout { display: grid; grid-template-columns: 360px minmax(0, 1fr); gap: 24px; align-items: start; }
    .auction-list { display: grid; gap: 10px; }
    .auction-card { background: var(--card); border: 1px solid var(--border); border-radius: 8px; padding: 16px; }
    .auction-card-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: start; margin-bottom: 10px; }
    .auction-title { color: var(--gold-glow); font-size: 15px; font-weight: 700; overflow-wrap: anywhere; }
    .auction-seller, .auction-note, .auction-meta { color: var(--text-dim); font-size: 11px; line-height: 1.45; margin-top: 3px; }
    .auction-price { color: var(--green); font-size: 16px; font-weight: 800; text-align: right; white-space: nowrap; }
    .auction-bid-row { display: grid; grid-template-columns: 1fr auto; gap: 8px; margin-top: 12px; }
    .auction-bid-row input { min-width: 0; }
    .auction-bid-row button { white-space: nowrap; }
    .auction-bids { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
    .auction-bid-pill { background: #0d0b08; border: 1px solid var(--border); border-radius: 4px; color: var(--text); font-size: 11px; padding: 5px 7px; }
    .price-health-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
    .missing-price-list, .import-preview-list { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; max-height: 120px; overflow: auto; scrollbar-color: var(--gold-dim) #0d0b08; }
    .login-history-list { display: flex; flex-direction: column; gap: 8px; margin-top: 14px; }
    .login-history-row { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 10px; border-bottom: 1px solid var(--border); padding: 8px 0; }
    .login-history-row:last-child { border-bottom: none; }
    .login-history-avatar { width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--gold-dim); background: #0d0b08; object-fit: cover; }
    .login-history-name { color: var(--text); font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .login-history-meta { color: var(--text-dim); font-size: 11px; margin-top: 2px; }
    .login-history-count { color: var(--gold-glow); font-size: 12px; font-weight: 700; text-align: right; }
    .price-report-row { display: grid; gap: 10px; border-bottom: 1px solid var(--border); padding: 10px 0; }
    .price-report-row:last-child { border-bottom: none; }
    .price-report-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; }
    .price-report-admin-actions { display: flex; align-items: center; justify-content: flex-end; gap: 7px; flex-wrap: wrap; }
    .price-report-reward-state { display: inline-flex; align-items: center; min-height: 24px; padding: 3px 8px; border: 1px solid var(--gold-dim); border-radius: 4px; color: var(--gold-glow); font-size: 10px; font-weight: 700; text-transform: uppercase; }
    .price-report-reward-state.paid { border-color: rgba(89, 173, 112, 0.45); color: #82d398; }
    .missing-price-pill { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; background: #0d0b08; border: 1px solid var(--border); border-radius: 4px; color: var(--text); font-size: 11px; padding: 5px 7px; }
    .missing-price-pill.warn { border-color: rgba(196,68,68,0.6); color: #e06060; }
    .missing-price-pill.ok { border-color: rgba(76,175,122,0.45); color: var(--green); }
    .missing-price-source { color: var(--text-dim); font-size: 10px; }
    .mat-price-input[readonly] { color: var(--text-dim); border-color: var(--border); cursor: default; }
    .mat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
    .mat-card { background: var(--card); border: 1px solid var(--border); border-radius: 6px; padding: 14px 16px; display: flex; align-items: center; gap: 12px; transition: border-color 0.2s; }
    .mat-card:hover { border-color: var(--gold-dim); }
    .mat-card.has-price { border-color: rgba(201,168,76,0.3); }
    .mat-card-icon { width: 38px; height: 38px; border-radius: 5px; background: #0d0b08; border: 1px solid var(--border); display: flex; align-items: center; justify-content: center; font-size: 18px; flex-shrink: 0; }
    .mat-card-body { flex: 1; min-width: 0; }
    .mat-card-name { font-size: 12px; font-weight: 500; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-bottom: 6px; }
    .mat-price-input { width: 100%; background: #0d0b08; border: 1px solid var(--border); border-radius: 3px; color: var(--gold-glow); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: 12px; font-weight: 600; text-align: right; padding: 4px 8px; outline: none; transition: border-color 0.15s; }
    .mat-price-input:focus { border-color: var(--gold-dim); }
    .mat-price-input::placeholder { color: var(--text-dim); font-weight: 400; font-size: 11px; }
    .mat-craft-note { margin-top: 5px; color: var(--info, #69aec0); font-size: 10px; line-height: 1.35; }
    .mat-order-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 8px; }
    .mat-order-actions button { background: #0d0b08; border: 1px solid var(--border); border-radius: 3px; color: var(--gold); font-size: 10px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; padding: 5px 6px; cursor: pointer; transition: all 0.15s; }
    .mat-order-actions button:hover:not(:disabled) { border-color: var(--gold-dim); background: rgba(201,168,76,0.08); }
    .mat-order-actions button:disabled { color: var(--text-dim); opacity: 0.45; cursor: default; }
    .items-table { width: 100%; border-collapse: collapse; }
    .items-table th { font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; font-size: 10px; letter-spacing: 0.12em; color: var(--gold); text-transform: uppercase; text-align: left; padding: 0 12px 14px; border-bottom: 1px solid var(--border); }
    .items-table th.r { text-align: right; }
    .items-table td { padding: 11px 12px; border-bottom: 1px solid var(--border); vertical-align: middle; }
    .items-table tr:last-child td { border-bottom: none; }
    .items-table tr:hover td { background: rgba(201,168,76,0.025); }
    .fav-btn { background: none; border: none; color: var(--text-dim); font-size: 14px; cursor: pointer; transition: color 0.2s; padding: 0 4px; }
    .fav-btn.on { color: var(--gold); }
    .item-cell { display: flex; align-items: center; gap: 10px; }
    .tbl-icon { width: 30px; height: 30px; border-radius: 4px; background: #0d0b08; border: 1px solid var(--border); display: flex; align-items: center; justify-content: center; font-size: 14px; }
    .coins-badge { background: rgba(201,168,76,0.1); border: 1px solid var(--gold-dim); border-radius: 3px; color: var(--gold); font-size: 11px; font-weight: 600; padding: 2px 7px; }
    .tbl-pi { background: #0d0b08; border: 1px solid var(--border); border-radius: 4px; color: var(--gold-glow); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: 12px; font-weight: 600; text-align: right; padding: 5px 9px; width: 110px; outline: none; transition: border-color 0.2s; }
    .tbl-pi:focus { border-color: var(--gold-dim); }
    .tbl-pi::placeholder { color: var(--text-dim); font-weight: 400; }
    .profit-pos { color: var(--green); font-weight: 600; }
    .profit-neg { color: var(--red); font-weight: 600; }
    .profit-na { color: var(--text-dim); }
    .tab-strip { display: flex; gap: 6px; margin-bottom: 20px; flex-wrap: wrap; }
    .chapter-strip { display: flex; gap: 6px; margin: 0 0 10px; padding-bottom: 10px; border-bottom: 1px solid var(--border); }
    .chapter-btn { min-width: 112px; padding: 9px 16px; border: 1px solid var(--border); border-radius: 4px; background: #0d0b08; color: var(--text-dim); font: inherit; font-size: 11px; font-weight: 800; letter-spacing: 0; cursor: pointer; transition: color .15s, border-color .15s, background .15s; }
    .chapter-btn:hover { color: var(--text); border-color: var(--gold-dim); }
    .chapter-btn.active { color: var(--gold-glow); border-color: var(--gold); background: rgba(201,168,76,.1); }
    .tab-btn { background: none; border: 1px solid var(--border); border-radius: 4px; color: var(--text-dim); font-size: 12px; padding: 6px 14px; cursor: pointer; transition: all 0.2s; }
    .tab-btn:hover { color: var(--text); border-color: var(--gold-dim); }
    .tab-btn.active { color: var(--gold); border-color: var(--gold); background: rgba(201,168,76,0.08); }
    .upgrade-layout { display: grid; grid-template-columns: 340px 1fr; gap: 24px; }
    .pet-layout { display: grid; grid-template-columns: 340px minmax(0, 1fr); gap: 24px; }
    .pet-skill-btn { width: 100%; min-height: 40px; display: grid; grid-template-columns: 28px 1fr; align-items: center; gap: 10px; background: var(--card); border: 1px solid var(--border); border-radius: 6px; color: var(--text); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: 12px; font-weight: 500; padding: 7px 10px; cursor: pointer; transition: all 0.15s; text-align: left; }
    .pet-skill-btn:hover { border-color: var(--gold-dim); color: var(--gold); }
    .pet-skill-btn.active { border-color: var(--gold); background: rgba(201,168,76,0.1); color: var(--gold); }
    .pet-skill-icon { width: 24px; height: 24px; display: grid; place-items: center; border: 1px solid var(--border); border-radius: 4px; background: #0d0b08; color: var(--gold); font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; font-size: 12px; font-weight: 700; }
    .pet-editor-icon-preview { width: 38px; height: 38px; }
    .pet-bonus-skill-info { display: flex; align-items: center; gap: 10px; min-width: 0; }
    #pet-skill-list { display: flex; flex-direction: column; gap: 6px; margin-bottom: 20px; }
    .pet-scroll-controls { display: flex; justify-content: flex-end; gap: 6px; margin: -44px 0 12px; }
    .pet-scroll-controls .btn { width: 38px; height: 32px; padding: 0; }
    .pet-table-wrap { width: 100%; max-width: 100%; overflow-x: auto; overflow-y: hidden; border: 1px solid var(--border); border-radius: 8px; background: var(--card); scrollbar-color: var(--gold-dim) #0d0b08; }
    .pet-table { min-width: 1120px; width: 100%; border-collapse: collapse; }
    .pet-table th, .pet-table td { border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); padding: 8px 10px; text-align: center; font-size: 12px; }
    .pet-table th:first-child, .pet-table td:first-child { position: sticky; left: 0; z-index: 1; min-width: 150px; text-align: left; background: #16130f; color: var(--gold); font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; }
    .pet-table th { color: var(--gold); font-size: 11px; font-weight: 600; background: #16130f; }
    .pet-table tr:last-child td { border-bottom: none; }
    .pet-table th:last-child, .pet-table td:last-child { border-right: none; }
    .pet-active-level { background: rgba(201,168,76,0.08); }
    .pet-yang { color: var(--gold-glow); font-weight: 700; }
    .pet-cost-cell { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-height: 38px; }
    .pet-cost-cell > span { color: var(--gold-glow); font-size: 10px; font-weight: 700; }
    .pet-cost-cell img { width: 24px !important; height: 24px !important; }
    .pet-book-icon { width: 24px; height: 24px; display: grid; place-items: center; border: 1px solid var(--gold-dim); border-radius: 4px; color: var(--gold); background: rgba(201,168,76,0.08); font-size: 8px; line-height: 1; }
    .pet-editor-levels { display: flex; flex-direction: column; gap: 8px; max-height: 620px; overflow: auto; padding-right: 4px; }
    .pet-editor-level { border: 1px solid var(--border); border-radius: 6px; padding: 10px; background: #13110d; }
    .pet-editor-level-head { display: grid; grid-template-columns: 70px 1fr; gap: 10px; align-items: end; margin-bottom: 10px; }
    .pet-editor-costs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
    .pet-editor-cost { display: grid; grid-template-columns: 1fr 62px; gap: 6px; }
    .petmount-layout, .mount-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
    .bonus-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
    .bonus-card { background: #0d0b08; border: 1px solid var(--border); border-radius: 6px; padding: 12px; min-width: 0; }
    .bonus-card-title { color: var(--text-dim); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 6px; }
    .bonus-card-value { color: var(--gold-glow); font-size: 18px; font-weight: 700; line-height: 1.2; }
    .bonus-card-note { color: var(--text-dim); font-size: 11px; line-height: 1.45; margin-top: 6px; }
    .bonus-list { display: flex; flex-direction: column; gap: 8px; }
    .bonus-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; border-bottom: 1px solid var(--border); padding-bottom: 8px; }
    .bonus-row:last-child { border-bottom: none; padding-bottom: 0; }
    .bonus-name { color: var(--text); font-size: 12px; font-weight: 600; }
    .bonus-meta { color: var(--text-dim); font-size: 11px; margin-top: 2px; }
    .bonus-value { color: var(--gold-glow); font-size: 13px; font-weight: 700; text-align: right; }
    .item-select-btn { width: 100%; min-height: 44px; display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 10px; background: var(--card); border: 1px solid var(--border); border-radius: 6px; color: var(--text); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: 12px; font-weight: 500; padding: 7px 10px; cursor: pointer; transition: all 0.15s; text-align: left; }
    .item-select-btn:hover { border-color: var(--gold-dim); color: var(--gold); }
    .item-select-btn.active { border-color: var(--gold); background: rgba(201,168,76,0.1); color: var(--gold); }
    .app-icon img, .item-select-icon img, .editor-item-icon img, .slot-picker-item-icon img, .char-summary-icon img, .char-slot-icon img { width: 100% !important; height: 100% !important; max-width: 100%; max-height: 100%; object-fit: contain; display: block; image-rendering: pixelated; }
    .item-select-icon { width: 28px; height: 28px; display: grid; place-items: center; overflow: hidden; }
    .item-select-name { color: inherit; line-height: 1.2; }
    .item-select-level { color: var(--text-dim); font-size: 10px; white-space: nowrap; }
    #item-btn-grid { display: flex; flex-direction: column; gap: 6px; margin-bottom: 20px; }
    .select-wrap { position: relative; margin-bottom: 16px; }
    .select-wrap select { width: 100%; background: #0d0b08; border: 1px solid var(--border); border-radius: 4px; color: var(--text); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: 13px; padding: 9px 32px 9px 12px; outline: none; appearance: none; cursor: pointer; }
    .select-wrap::after { content: '▾'; position: absolute; right: 12px; top: 50%; transform: translateY(-50%); color: var(--gold-dim); pointer-events: none; }
    .craft-label { font-size: 11px; color: var(--text-dim); margin-bottom: 7px; letter-spacing: 0.05em; text-transform: uppercase; }
    .upgrade-step { border: 1px solid var(--border); border-radius: 6px; margin-bottom: 8px; transition: border-color 0.2s; overflow: hidden; }
    .step-active { border-color: rgba(201,168,76,0.35); background: rgba(201,168,76,0.03); }
    .step-inactive { opacity: 0.4; }
    .step-header { display: grid; grid-template-columns: 100px 180px 90px 1fr 160px; align-items: center; gap: 12px; padding: 12px 16px; }
    .step-badge { font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; font-size: 11px; font-weight: 600; color: var(--gold); letter-spacing: 0.08em; white-space: nowrap; }
    .step-item-name { font-size: 12px; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .step-yang-col { font-size: 12px; color: var(--gold-glow); font-weight: 600; white-space: nowrap; }
    .step-mats-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
    .step-mat-chip { display: flex; flex-direction: column; align-items: center; gap: 2px; background: #0d0b08; border: 1px solid var(--border); border-radius: 5px; padding: 5px 8px; min-width: 52px; }
    .step-mat-icon { font-size: 16px; line-height: 1; }
    .step-mat-qty { font-size: 11px; font-weight: 700; color: var(--gold-glow); }
    .step-mat-name { font-size: 9px; color: var(--text-dim); text-align: center; text-transform: uppercase; letter-spacing: 0.04em; line-height: 1.2; max-width: 60px; }
    .step-fails { display: flex; align-items: center; gap: 8px; justify-content: flex-end; }
    .step-fails-disabled { opacity: 0.4; pointer-events: none; }
    .mat-summary-grid { display: flex; flex-direction: column; gap: 4px; margin-top: 4px; }
    .mat-summary-card { display: flex; align-items: center; gap: 8px; padding: 5px 8px; border-bottom: 1px solid var(--border); }
    .mat-summary-card:last-child { border-bottom: none; }
    .craft-item-summary-card { background: rgba(210, 169, 72, 0.07); border-left: 2px solid var(--gold); }
    .craft-item-summary-note { margin-top: 2px; color: var(--text-dim); font-size: 10px; }
    .cost-box { background: linear-gradient(135deg, rgba(201,168,76,0.06), rgba(201,168,76,0.01)); border: 1px solid var(--gold-dim); border-radius: 8px; padding: 20px; }
    .cost-row { display: flex; justify-content: space-between; align-items: center; padding: 9px 0; border-bottom: 1px solid var(--border); }
    .cost-row:last-child { border-bottom: none; }
    .cost-row.total { padding-top: 16px; }
    .cost-row .cl { color: var(--text-dim); font-size: 13px; }
    .cost-row .cv { font-weight: 600; color: var(--text); font-size: 13px; }
    .cost-row.total .cl { color: var(--gold); font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; font-size: 11px; letter-spacing: 0.12em; }
    .cost-row.total .cv { color: var(--gold-glow); font-size: 22px; }
    .editor-layout { display: grid; grid-template-columns: 220px 1fr 180px; gap: 16px; }
    #editor-equipment-panel .editor-layout > div:nth-child(3),
    #editor-pet-panel .editor-layout > div:nth-child(3) { position: sticky; top: 102px; align-self: start; max-height: calc(100vh - 118px); }
    #editor-equipment-panel .editor-layout > div:nth-child(3) .card,
    #editor-pet-panel .editor-layout > div:nth-child(3) .card { max-height: calc(100vh - 160px); overflow-y: auto; scrollbar-color: var(--gold-dim) #0d0b08; }
    .editor-item-list { display: flex; flex-direction: column; gap: 6px; }
    .editor-search-input { margin-bottom: 8px; }
    .material-editor-layout { grid-template-columns: 380px 1fr !important; }
    #material-editor-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; align-items: start; max-height: 70vh; overflow-y: auto; padding-right: 4px; scrollbar-color: var(--gold-dim) #0d0b08; }
    .material-editor-filters { grid-column: 1 / -1; display: flex; gap: 6px; flex-wrap: wrap; position: sticky; top: 0; z-index: 2; background: var(--bg); padding-bottom: 8px; }
    .material-editor-filter { min-height: 30px; border: 1px solid var(--border); border-radius: 4px; background: #0d0b08; color: var(--text-dim); padding: 0 9px; font-size: 11px; cursor: pointer; }
    .material-editor-filter.active { border-color: var(--gold); color: var(--gold); background: rgba(201,168,76,0.08); }
    .material-editor-filter.drop-target { border-color: var(--gold); color: var(--gold-glow); background: rgba(201,168,76,0.18); box-shadow: inset 0 0 0 1px rgba(201,168,76,0.28); }
    .material-editor-filter span { opacity: 0.6; margin-left: 3px; }
    .material-craft-title { margin-top: 22px; }
    .material-craft-editor { display: grid; gap: 12px; padding: 14px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); }
    .material-craft-ingredients { display: grid; gap: 7px; }
    .material-craft-ingredient { display: grid; grid-template-columns: minmax(160px, 1fr) 84px 38px; gap: 7px; align-items: center; }
    .material-craft-ingredient .btn { min-height: 36px; padding: 0; }
    .material-craft-value { padding-top: 10px; border-top: 1px solid var(--border); color: var(--text-dim); font-size: 12px; }
    .material-craft-value b { color: var(--gold-glow); }
    #material-editor-list .editor-cat-header { grid-column: 1 / -1; }
    #material-editor-list .editor-item-btn.has-icon { min-height: 44px; grid-template-columns: 26px minmax(0, 1fr); gap: 7px; padding: 7px; }
    #material-editor-list .editor-item-btn.dragging { opacity: 0.45; border-color: var(--gold-dim); }
    #material-editor-list .editor-item-icon { width: 24px; height: 24px; }
    #material-editor-list .editor-item-name { font-size: 11px; line-height: 1.2; overflow: hidden; text-overflow: ellipsis; }
    #material-editor-list .editor-item-cat { font-size: 9px; opacity: 0.55; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .editor-item-btn { background: var(--card); border: 1px solid var(--border); border-radius: 6px; padding: 10px 14px; cursor: pointer; text-align: left; transition: all 0.15s; color: var(--text); font-size: 13px; }
    .editor-item-btn.has-icon { display: grid; grid-template-columns: 30px 1fr; align-items: center; gap: 10px; }
    .editor-item-icon { width: 28px; height: 28px; display: grid; place-items: center; overflow: hidden; flex-shrink: 0; }
    .editor-item-name { min-width: 0; }
    .editor-item-btn:hover { border-color: var(--gold-dim); color: var(--gold); }
    .editor-item-btn.active { border-color: var(--gold); background: rgba(201,168,76,0.08); color: var(--gold); }
    .editor-item-cat { font-size: 10px; color: var(--text-dim); margin-top: 2px; text-transform: uppercase; letter-spacing: 0.05em; }
    .btn { border-radius: 4px; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: 12px; font-weight: 600; padding: 8px 16px; cursor: pointer; border: 1px solid; transition: all 0.15s; letter-spacing: 0.03em; }
    .btn-gold { background: rgba(201,168,76,0.12); border-color: var(--gold-dim); color: var(--gold); }
    .btn-gold:hover { background: rgba(201,168,76,0.2); border-color: var(--gold); }
    .btn-danger { background: rgba(196,68,68,0.1); border-color: #c44; color: #e06060; }
    .btn-ghost { background: none; border-color: var(--border); color: var(--text-dim); }
    .field-row { display: flex; gap: 12px; margin-bottom: 14px; align-items: flex-start; }
    .field-col { display: flex; flex-direction: column; gap: 6px; flex: 1; }
    .field-label { font-size: 11px; color: var(--text-dim); letter-spacing: 0.05em; text-transform: uppercase; }
    .field-input { background: #0d0b08; border: 1px solid var(--border); border-radius: 4px; color: var(--text); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: 13px; padding: 8px 12px; outline: none; transition: border-color 0.2s; width: 100%; }
    .field-input:focus { border-color: var(--gold-dim); }
    .field-select { background: #0d0b08; border: 1px solid var(--border); border-radius: 4px; color: var(--text); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: 13px; padding: 8px 12px; outline: none; width: 100%; appearance: none; cursor: pointer; }
    .step-editor-row2 { background: #0d0b08; border: 1px solid var(--border); border-radius: 6px; padding: 10px 12px; margin-bottom: 8px; }
    .step-row2-header { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; }
    .step-row2-badge { font-family: 'Palatino Linotype', Palatino, serif; font-size: 11px; color: var(--gold); letter-spacing:0.08em; min-width:70px; }
    .step-copy-actions { display: flex; gap: 5px; margin-left: auto; }
    .step-copy-actions button { min-height: 28px; padding: 4px 9px; border: 1px solid var(--border); border-radius: 5px; background: var(--surface); color: var(--text-dim); font: inherit; font-size: 10px; font-weight: 700; cursor: pointer; }
    .step-copy-actions button:hover { color: var(--gold-glow); border-color: var(--gold-dim); background: rgba(213,182,94,.08); }
    .step-drop-zone { min-height: 32px; border: 1px dashed var(--border); border-radius: 4px; padding: 4px; display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; transition: border-color 0.15s, background 0.15s; }
    .step-drop-zone.step-copy-source { cursor: grab; }
    .step-drop-zone.step-copy-source:hover { border-color: var(--gold-dim); background: rgba(201,168,76,0.04); }
    .step-drop-zone.dragging { opacity: 0.55; cursor: grabbing; }
    .step-drop-zone.drag-over { border-color: var(--gold); background: rgba(201,168,76,0.07); }
    .step-drop-zone-empty { font-size: 10px; color: var(--text-dim); padding: 4px; align-self: center; }
    .dropped-mat { display: flex; align-items: center; gap: 4px; background: rgba(201,168,76,0.08); border: 1px solid var(--gold-dim); border-radius: 4px; padding: 3px 6px; font-size: 11px; color: var(--text); }
    .dropped-mat-draggable { cursor: grab; }
    .dropped-mat-draggable.dragging { opacity: 0.55; cursor: grabbing; }
    .dropped-mat-qty { background: none; border: none; color: var(--gold-glow); font-size: 11px; font-weight: 700; width: 28px; text-align: center; padding: 0; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }
    .dropped-mat-remove { background: none; border: none; color: var(--text-dim); cursor: pointer; font-size: 12px; padding: 0 2px; line-height: 1; }
    .mat-palette-item { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 5px; cursor: grab; border: 1px solid var(--border); margin-bottom: 4px; background: #0d0b08; font-size: 11px; color: var(--text); transition: border-color 0.15s; user-select: none; }
    .mat-palette-item:hover { border-color: var(--gold-dim); color: var(--gold); }
    .mat-palette-icon { width: 22px; height: 22px; flex-shrink: 0; }
    .editor-actions { display: flex; gap: 8px; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--border); }
    .editor-sync-row { display: flex; align-items: center; gap: 10px; margin: -12px 0 18px; }
    .editor-sync-status { color: var(--text-dim); font-size: 12px; }
    .editor-sync-status.ok { color: var(--green); }
    .editor-sync-status.err { color: #d26a6a; }
    .editor-empty { color: var(--text-dim); font-size: 13px; padding: 40px 0; text-align: center; }
    .metin-editor-layout { grid-template-columns:260px minmax(420px,1fr) 300px; }
    .metin-editor-group { margin:12px 0 5px; padding:0 5px; color:var(--gold-dim); font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
    .metin-editor-form-grid { display:grid; grid-template-columns:minmax(0,1fr) 160px; gap:12px; }
    .metin-drop-editor-list { display:grid; gap:8px; margin-top:10px; }
    .metin-drop-editor-row { display:grid; grid-template-columns:minmax(170px,1fr) 120px 76px 76px 34px; gap:8px; align-items:end; padding:10px; border:1px solid var(--border); border-radius:6px; background:#14120e; }
    .metin-drop-editor-row .field-label { margin-bottom:4px; }
    .metin-drop-remove { width:34px; min-height:36px; padding:0; }
    .metin-screenshot-card { position:sticky; top:110px; padding:12px; }
    .metin-screenshot-card input[type="file"] { width:100%; color:var(--text-dim); font-size:11px; }
    .metin-screenshot-preview { min-height:120px; margin-top:12px; display:grid; place-items:center; overflow:hidden; border:1px dashed var(--border); border-radius:6px; background:#0d0b08; color:var(--text-dim); font-size:11px; }
    .metin-screenshot-preview img { width:100%; height:auto; display:block; image-rendering:auto; }
    @media (max-width:1050px) { .metin-editor-layout { grid-template-columns:230px minmax(0,1fr); } .metin-editor-layout > :last-child { grid-column:1 / -1; } .metin-screenshot-card { position:static; } }
    @media (max-width:700px) { .metin-editor-layout { grid-template-columns:1fr; } .metin-editor-layout > :last-child { grid-column:auto; } .metin-drop-editor-row { grid-template-columns:1fr 1fr; } .metin-drop-editor-row > :first-child { grid-column:1 / -1; } .price-report-reward { grid-template-columns:1fr; margin-top:24px; } .price-report-callout-arrow { right:50%; top:-32px; } .price-report-head { grid-template-columns:1fr; } .price-report-admin-actions { justify-content:flex-start; } }
    .editor-new-btn { width: 100%; background: none; border: 1px dashed var(--gold-dim); border-radius: 6px; color: var(--gold-dim); font-size: 13px; padding: 10px; cursor: pointer; transition: all 0.15s; margin-bottom: 8px; }
    .editor-new-btn:hover { border-color: var(--gold); color: var(--gold); background: rgba(201,168,76,0.05); }
    .home-welcome { display: flex; align-items: center; gap: 20px; margin-bottom: 40px; padding: 28px 120px 28px 32px; background: var(--card); border: 1px solid var(--border); border-radius: 10px; position: relative; overflow: hidden; }
    .home-welcome::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 60% 80% at 0% 50%, rgba(201,168,76,0.06) 0%, transparent 70%); pointer-events: none; }
    .home-avatar-wrap { position: relative; flex-shrink: 0; }
    .home-avatar { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; border: 2px solid var(--gold-dim); }
    .home-avatar-ring { position: absolute; inset: -4px; border-radius: 50%; border: 1px solid rgba(201,168,76,0.3); animation: spin 8s linear infinite; }
    @keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
    .home-greeting { font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; font-size: 22px; color: var(--gold-glow); font-weight: 600; }
    .home-subtitle { font-size: 13px; color: var(--text-dim); margin-top: 4px; }
    .home-welcome-copy { min-width: 0; }
    .home-server-age { min-width: 230px; margin-left: auto; padding: 12px 18px; border: 1px solid #463626; border-radius: 8px; background: rgba(13,9,7,0.72); text-align: center; box-shadow: inset 0 1px rgba(255,255,255,0.02); }
    .home-server-age-title { margin-bottom: 6px; color: #b99a77; font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; font-size: 12px; letter-spacing: 0.16em; }
    .home-server-age-value { color: #f2dfb5; font-size: 15px; line-height: 1.35; white-space: nowrap; }
    .home-server-age-value strong { color: #ffe000; font-size: 17px; }
    .home-login-btn { position:absolute; top:16px; right:16px; z-index:2; min-height:32px; padding:6px 12px; border:1px solid var(--gold-dim); border-radius:5px; background:rgba(201,168,76,0.08); color:var(--gold); font-size:11px; font-weight:700; cursor:pointer; }
    .home-login-btn:hover { border-color:var(--gold); background:rgba(201,168,76,0.16); color:var(--gold-glow); }
    .home-login-btn.signed-in { border-color:rgba(196,68,68,0.45); background:rgba(196,68,68,0.08); color:#e06060; }
    @media (max-width: 700px) { .home-welcome { flex-wrap:wrap; padding:64px 20px 22px; } .home-server-age { width:100%; min-width:0; margin-left:0; } }
    @media (max-width: 520px) { .home-welcome { align-items:flex-start; } .home-avatar { width:52px; height:52px; } .home-login-btn { top:14px; right:14px; } }
    .home-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; margin-bottom: 32px; }
    .home-card { background: var(--card); border: 1px solid var(--border); border-radius: 8px; padding: 20px; cursor: pointer; transition: all 0.2s; position: relative; display: flex; flex-direction: column; gap: 8px; }
    .home-card:hover { border-color: var(--gold-dim); background: rgba(201,168,76,0.04); transform: translateY(-2px); }
    .home-card-icon { font-size: 24px; }
    .home-card-title { font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; font-size: 13px; color: var(--gold); letter-spacing: 0.08em; }
    .home-card-desc { font-size: 12px; color: var(--text-dim); line-height: 1.5; flex: 1; }
    .home-card-arrow { font-size: 16px; color: var(--gold-dim); text-align: right; }
    .home-stats-bar { display: flex; gap: 16px; flex-wrap: wrap; }
    .home-stat { background: var(--card); border: 1px solid var(--border); border-radius: 8px; padding: 16px 24px; text-align: center; flex: 1; min-width: 100px; }
    .home-stat-val { font-size: 24px; font-weight: 700; color: var(--gold-glow); }
    .home-stat-lbl { font-size: 11px; color: var(--text-dim); margin-top: 4px; text-transform: uppercase; letter-spacing: 0.06em; }
    .warrior-helper { position:fixed; left:0; bottom:64px; z-index:45; width:210px; height:330px; pointer-events:none; }
    .warrior-character-button { position:absolute; left:-12px; bottom:0; width:190px; height:300px; padding:0; border:0; background:transparent; cursor:pointer; pointer-events:auto; filter:drop-shadow(0 14px 18px rgba(0,0,0,.62)); transition:transform .2s ease,filter .2s ease; }
    .warrior-character-button:hover { transform:translateX(5px); filter:drop-shadow(0 16px 22px rgba(0,0,0,.72)) drop-shadow(0 0 10px rgba(201,168,76,.2)); }
    .warrior-character-button img { width:100%; height:100%; display:block; object-fit:contain; object-position:left bottom; }
    .warrior-tip { position:absolute; left:132px; bottom:222px; width:260px; min-height:92px; padding:15px 34px 15px 17px; border:1px solid #66502b; border-radius:8px; background:rgba(20,17,13,.97); box-shadow:0 14px 34px rgba(0,0,0,.5); opacity:0; visibility:hidden; transform:translate(-8px,8px); transition:opacity .2s ease,transform .2s ease,visibility .2s; pointer-events:auto; }
    .warrior-tip::after { content:""; position:absolute; left:-7px; bottom:17px; width:12px; height:12px; border-left:1px solid #66502b; border-bottom:1px solid #66502b; background:#14110d; transform:rotate(45deg); }
    .warrior-tip.visible { opacity:1; visibility:visible; transform:translate(0,0); }
    .warrior-tip-name { margin-bottom:6px; color:var(--gold); font-family:'Palatino Linotype','Book Antiqua',Palatino,serif; font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
    .warrior-tip-text { color:#ddd1b8; font-size:12px; line-height:1.5; }
    .warrior-tip-close { position:absolute; top:7px; right:8px; width:24px; height:24px; padding:0; border:0; border-radius:4px; background:transparent; color:#827662; font-size:19px; line-height:1; cursor:pointer; }
    .warrior-tip-close:hover { color:var(--gold-glow); background:rgba(201,168,76,.08); }
    @media (max-width:1450px) {
      .warrior-helper { bottom:66px; width:140px; height:230px; }
      .warrior-character-button { left:-14px; width:132px; height:215px; }
      .warrior-tip { left:84px; bottom:154px; width:238px; }
    }
    @media (max-width:760px) {
      .warrior-helper { bottom:72px; width:92px; height:142px; }
      .warrior-character-button { left:-10px; width:92px; height:142px; }
      .warrior-tip { position:fixed; left:12px; bottom:206px; width:min(290px,calc(100vw - 24px)); min-height:0; }
      .warrior-tip::after { left:30px; bottom:-7px; border:0; border-right:1px solid #66502b; border-bottom:1px solid #66502b; }
    }
    .daily-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
    .daily-date { border: 1px solid var(--border); border-radius: 6px; color: var(--gold); background: rgba(201,168,76,0.06); padding: 10px 12px; font-size: 12px; white-space: nowrap; }
    .daily-progress-card { margin-bottom: 18px; }
    .daily-layout { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 22px; align-items: start; }
    .daily-progress-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
    .daily-progress-text { color: var(--text-dim); font-size: 12px; }
    .daily-progress-bar { height: 8px; border: 1px solid var(--border); border-radius: 99px; background: #0d0b08; overflow: hidden; margin-bottom: 16px; }
    .daily-progress-bar > div { height: 100%; width: 0%; background: linear-gradient(90deg, var(--gold-dim), var(--gold)); transition: width 0.18s ease; }
    .daily-category-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
    .daily-shared-side .daily-category-grid { grid-template-columns: 1fr; }
    .daily-category-card { background: var(--card); border: 1px solid var(--border); border-radius: 8px; padding: 16px; display: grid; gap: 12px; }
    .daily-category-card.done { border-color: rgba(98,180,110,0.45); background: rgba(98,180,110,0.05); }
    .daily-category-head { display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; }
    .daily-category-title { color: var(--gold-glow); font-size: 14px; font-weight: 800; overflow-wrap: anywhere; }
    .daily-category-meta { color: var(--text-dim); font-size: 11px; white-space: nowrap; }
    .daily-list { display: grid; gap: 8px; }
    .daily-task { display: grid; grid-template-columns: 30px minmax(0, 1fr) 34px; align-items: center; gap: 10px; min-height: 46px; border: 1px solid var(--border); border-radius: 6px; background: #0d0b08; padding: 8px 9px; }
    .daily-task.done { border-color: rgba(98,180,110,0.45); background: rgba(98,180,110,0.07); }
    .daily-check { width: 24px; height: 24px; border-radius: 5px; border: 1px solid var(--gold-dim); background: rgba(201,168,76,0.06); color: var(--gold); cursor: pointer; }
    .daily-task.done .daily-check { background: rgba(201,168,76,0.18); border-color: var(--gold); }
    .daily-title { color: var(--text); font-size: 13px; line-height: 1.35; overflow-wrap: anywhere; }
    .daily-task.done .daily-title { color: var(--text-dim); text-decoration: line-through; }
    .daily-delete { width: 28px; height: 28px; border: 1px solid transparent; border-radius: 4px; background: none; color: var(--text-dim); cursor: pointer; }
    .daily-delete:hover { border-color: rgba(196,68,68,0.45); color: #e06060; background: rgba(196,68,68,0.08); }
    .daily-side, .daily-personal-main, .daily-shared-side { display: grid; gap: 12px; }
    .daily-add-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
    .daily-note, .daily-empty { color: var(--text-dim); font-size: 12px; line-height: 1.45; }
    .daily-note.ok { color: var(--green); }
    .daily-note.err { color: #e0a060; }
    .guides-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 24px; }
    .guide-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 22px; }
    .guide-card { min-height: 420px; background: #10100f; border: 1px solid var(--border); border-radius: 6px; overflow: hidden; cursor: pointer; display: flex; flex-direction: column; transition: transform 0.18s, border-color 0.18s, background 0.18s; }
    .guide-card:hover { transform: translateY(-3px); border-color: var(--gold-dim); background: #15130f; }
    .guide-card.locked { cursor: not-allowed; }
    .guide-card.locked .guide-image, .guide-card.locked .guide-body { opacity: 0.72; }
    .guide-image { height: 188px; position: relative; display: flex; align-items: flex-end; padding: 18px; background: linear-gradient(135deg, #2a130f, #0d0b08); overflow: hidden; }
    .guide-image::before { content: ''; position: absolute; inset: 0; background-image: linear-gradient(180deg, transparent 20%, rgba(0,0,0,0.78)), var(--guide-art), url('../assets/bloodline.png'); background-size: cover; background-position: center; filter: saturate(1.05); }
    .guide-image::after { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 20% 18%, rgba(201,168,76,0.22), transparent 30%), radial-gradient(circle at 85% 12%, rgba(196,68,68,0.22), transparent 28%); mix-blend-mode: screen; opacity: 0.8; }
    .guide-kicker { position: relative; z-index: 1; color: var(--gold-glow); font-family: Georgia, 'Times New Roman', serif; font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; text-shadow: 0 2px 10px #000; }
    .guide-body { padding: 20px 18px 18px; display: flex; flex-direction: column; gap: 12px; flex: 1; }
    .guide-title { color: #fff; font-size: 20px; line-height: 1.16; font-weight: 800; }
    .guide-desc { color: #f1eadb; font-size: 14px; line-height: 1.55; flex: 1; }
    .guide-meta { color: var(--text-dim); font-size: 12px; line-height: 1.55; }
    .guide-meta b { color: var(--gold-glow); }
    .guide-lock-pill { display: inline-flex; align-items: center; align-self: flex-start; min-height: 24px; padding: 0 9px; border: 1px solid var(--gold-dim); border-radius: 999px; color: var(--gold); background: rgba(201,168,76,0.08); font-size: 10px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
    .guide-lock { display: grid; grid-template-columns: 46px 1fr; align-items: center; gap: 14px; margin-bottom: 22px; border-style: dashed; }
    .guide-lock-icon { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid var(--gold-dim); border-radius: 6px; color: var(--gold); background: rgba(201,168,76,0.08); font-weight: 900; font-size: 22px; }
    .guide-lock-title { color: var(--gold-glow); font-size: 15px; font-weight: 800; margin-bottom: 3px; }
    .guide-lock-text { color: var(--text-dim); font-size: 13px; line-height: 1.5; }
    .guide-detail { background: var(--card); border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }
    .guide-detail-hero { min-height: 260px; position: relative; display: flex; align-items: flex-end; padding: 28px; background: #0d0b08; }
    .guide-detail-hero::before { content: ''; position: absolute; inset: 0; background-image: linear-gradient(180deg, transparent, rgba(0,0,0,0.88)), var(--guide-art), url('../assets/bloodline.png'); background-size: cover; background-position: center; }
    .guide-detail-hero > div { position: relative; z-index: 1; max-width: 760px; }
    .guide-detail-title { color: #fff; font-size: 34px; line-height: 1.08; font-weight: 900; margin-top: 8px; }
    .guide-detail-meta { color: var(--text-dim); font-size: 12px; margin-top: 12px; }
    .guide-detail-content { padding: 28px; display: grid; gap: 18px; color: var(--text); font-size: 15px; line-height: 1.75; }
    .guide-detail-content h3 { color: var(--gold); font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; font-size: 14px; letter-spacing: 0.12em; text-transform: uppercase; margin-top: 4px; }
    .guide-detail-content ul { padding-left: 20px; display: grid; gap: 8px; }
    .guide-rich-section { display: grid; gap: 12px; }
    .guide-rich-table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: 6px; background: rgba(0,0,0,0.18); }
    .guide-rich-table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: 13px; line-height: 1.45; }
    .guide-rich-table th, .guide-rich-table td { padding: 10px 12px; border-bottom: 1px solid rgba(255,255,255,0.08); text-align: left; vertical-align: top; }
    .guide-rich-table th { color: var(--gold-glow); background: rgba(201,168,76,0.08); font-size: 11px; letter-spacing: 0.07em; text-transform: uppercase; }
    .guide-rich-table tr:last-child td { border-bottom: 0; }
    .guide-rich-image { max-width: min(100%, 860px); border: 1px solid var(--border); border-radius: 6px; background: #070706; object-fit: contain; justify-self: start; }
    .guide-art-metin { --guide-art: radial-gradient(circle at 72% 32%, rgba(255,80,40,0.55), transparent 18%), linear-gradient(135deg, #42130f, #13110d 55%, #0d0b08); }
    .guide-art-yang { --guide-art: radial-gradient(circle at 25% 35%, rgba(201,168,76,0.62), transparent 20%), linear-gradient(135deg, #2b2112, #12100c 60%, #080706); }
    .guide-art-pet { --guide-art: radial-gradient(circle at 76% 22%, rgba(82,210,170,0.45), transparent 18%), linear-gradient(135deg, #0e3028, #11100e 62%, #090807); }
    .guide-art-dungeon { --guide-art: radial-gradient(circle at 18% 18%, rgba(120,95,210,0.55), transparent 21%), linear-gradient(135deg, #1b1738, #11100e 58%, #070607); }
    .guide-art-market { --guide-art: radial-gradient(circle at 70% 40%, rgba(201,168,76,0.58), transparent 22%), linear-gradient(135deg, #30240f, #14110c 60%, #080706); }
    .guide-art-newbie { --guide-art: radial-gradient(circle at 50% 22%, rgba(224,184,90,0.5), transparent 18%), linear-gradient(135deg, #2b1c13, #11100e 62%, #070607); }
    .char-layout { display: grid; grid-template-columns: minmax(330px, 340px) minmax(280px, 1fr); gap: 28px; align-items: start; }
    .char-equipment { background: linear-gradient(180deg, #15100b, #070604); border: 1px solid #5d4c30; border-radius: 3px; padding: 6px; width: 100%; box-sizing: border-box; box-shadow: inset 0 0 0 1px #070604, inset 0 0 26px rgba(0,0,0,0.85), 0 8px 28px rgba(0,0,0,0.35); }
    .char-board { width: 148px; height: 176px; display: grid; grid-template-columns: repeat(4, 32px); grid-template-rows: repeat(6, 25px); gap: 5px; justify-content: center; align-content: center; position: relative; background: radial-gradient(circle at 50% 45%, rgba(135,107,70,0.1), transparent 36%), linear-gradient(135deg, #18110b, #0b0805 58%, #050403); border: 1px solid #1d1710; box-shadow: inset 0 0 22px rgba(0,0,0,0.9); }
    .char-companion-slots { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 16px; }
    .char-companion-slot { min-height: 58px; display: grid; grid-template-columns: 38px 1fr; align-items: center; gap: 10px; background: #0d0b08; border: 1px solid var(--border); border-radius: 6px; color: var(--text); text-align: left; padding: 9px 10px; cursor: pointer; }
    .char-companion-slot:hover { border-color: var(--gold-dim); color: var(--gold); }
    .char-companion-icon { width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid var(--gold-dim); border-radius: 5px; color: var(--gold); background: rgba(201,168,76,0.08); font-weight: 700; }
    .char-companion-slot b { display: block; font-size: 12px; line-height: 1.2; }
    .char-companion-slot small { display: block; color: var(--text-dim); font-size: 10px; margin-top: 2px; line-height: 1.25; }
    .char-slot, .char-deco-slot { width: 32px; height: 25px; background: linear-gradient(135deg, #15100a, #080604); border: 1px solid #7a653f; border-radius: 2px; display: flex; flex-direction: column; align-items: center; justify-content: center; transition: all 0.15s; gap: 0; position: relative; box-shadow: inset 0 0 0 1px #070604, inset 0 0 10px rgba(0,0,0,0.82), 0 0 0 1px rgba(0,0,0,0.9); clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 7px, 100% calc(100% - 7px), calc(100% - 8px) 100%, 8px 100%, 0 calc(100% - 7px), 0 7px); }
    .char-slot { cursor: pointer; z-index: 2; }
    .char-deco-slot { pointer-events: none; opacity: 0.72; z-index: 1; }
    .char-slot:hover { border-color: #c9a84c; background: linear-gradient(135deg, #21170d, #0b0805); filter: brightness(1.18); }
    .char-slot.filled { border-color: rgba(226,198,104,0.85); background: radial-gradient(circle at 50% 48%, rgba(201,168,76,0.08), transparent 62%), #0a0805; }
    .char-slot-icon { width: 24px; height: 22px; display: flex; align-items: center; justify-content: center; font-size: 15px; color: rgba(198,181,145,0.55); }
    .char-slot.filled .char-slot-icon { color: var(--text); }
    .char-slot-label { display: none; }
    .char-slot-level { position: absolute; bottom: 0; right: 3px; font-size: 8px; color: var(--gold); font-weight: 700; text-shadow: 0 1px 2px #000; }
    .char-silhouette { grid-column: 1 / 4; grid-row: 2 / 5; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; pointer-events: none; opacity: 0.72; z-index: 0; }
    .char-silhouette-inner { width: 88px; height: 92px; position: relative; filter: drop-shadow(0 1px 2px #000); }
    .char-silhouette-inner::before { content: ''; position: absolute; left: 50%; top: 2px; width: 20px; height: 22px; border: 2px solid rgba(157,143,113,0.76); border-radius: 50%; transform: translateX(-50%); background: rgba(9,7,5,0.45); }
    .char-silhouette-inner::after { content: ''; position: absolute; left: 50%; top: 26px; width: 42px; height: 52px; border: 2px solid rgba(157,143,113,0.76); border-top: 0; border-radius: 10px 10px 18px 18px; transform: translateX(-50%); box-shadow: -27px 10px 0 -24px rgba(157,143,113,0.76), 27px 10px 0 -24px rgba(157,143,113,0.76), -12px 47px 0 -9px rgba(157,143,113,0.76), 12px 47px 0 -9px rgba(157,143,113,0.76); }
    .slot-helmet { grid-column: 1; grid-row: 1; }
    .slot-armour { grid-column: 2; grid-row: 1; }
    .deco-top-extra { grid-column: 3; grid-row: 1; }
    .slot-weapon { grid-column: 4; grid-row: 1; }
    .deco-mid-left { grid-column: 1; grid-row: 2; }
    .slot-earrings { grid-column: 4; grid-row: 2; }
    .slot-shield { grid-column: 1; grid-row: 3; }
    .slot-necklace { grid-column: 4; grid-row: 3; }
    .slot-belt { grid-column: 1; grid-row: 5; }
    .slot-acc1 { grid-column: 3; grid-row: 4; }
    .slot-acc2 { grid-column: 4; grid-row: 4; }
    .deco-lower-left { grid-column: 2; grid-row: 5; }
    .deco-lower-right { grid-column: 4; grid-row: 5; }
    .deco-mid-right { grid-column: 3; grid-row: 5; }
    .deco-bottom-left { grid-column: 1; grid-row: 6; }
    .slot-shoes { grid-column: 2; grid-row: 6; }
    .deco-bottom-mid { grid-column: 3; grid-row: 6; }
    .slot-acc3 { grid-column: 4; grid-row: 6; }
    .deco-bottom-right { display: none; }
    .char-board { width: 163px; height: 187px; display: block; margin: 0 auto; background: url('../assets/character-equipment-frame.png') center / 100% 100% no-repeat; border: 0; box-shadow: none; }
    .char-silhouette, .char-deco-slot { display: none; }
    .char-slot { position: absolute; width: 31px; height: 31px; background: transparent; border: 0; border-radius: 0; box-shadow: none; clip-path: none; }
    .char-slot:hover { outline: 1px solid rgba(226,198,104,0.7); outline-offset: -2px; background: rgba(201,168,76,0.08); filter: none; }
    .char-slot.filled { background: transparent; border: 0; }
    .char-slot-icon { width: 28px; height: 28px; opacity: 0; pointer-events: none; }
    .char-slot.filled .char-slot-icon { opacity: 1; }
    .char-slot-level { right: 1px; bottom: -1px; font-size: 9px; }
    .slot-helmet { left: var(--char-slot-helmet-left, 43px); top: var(--char-slot-helmet-top, 5px); }
    .slot-armour { left: var(--char-slot-armour-left, 43px); top: var(--char-slot-armour-top, 41px); }
    .slot-weapon { left: var(--char-slot-weapon-left, 7px); top: var(--char-slot-weapon-top, 77px); }
    .slot-earrings { left: var(--char-slot-earrings-left, 125px); top: var(--char-slot-earrings-top, 150px); }
    .slot-shield { left: var(--char-slot-shield-left, 125px); top: var(--char-slot-shield-top, 77px); }
    .slot-necklace { left: var(--char-slot-necklace-left, 125px); top: var(--char-slot-necklace-top, 41px); }
    .slot-belt { left: var(--char-slot-belt-left, 7px); top: var(--char-slot-belt-top, 113px); }
    .slot-acc1 { left: var(--char-slot-acc1-left, 84px); top: var(--char-slot-acc1-top, 113px); }
    .slot-acc2 { left: var(--char-slot-acc2-left, 125px); top: var(--char-slot-acc2-top, 113px); }
    .slot-shoes { left: var(--char-slot-shoes-left, 43px); top: var(--char-slot-shoes-top, 150px); }
    .slot-acc3 { left: var(--char-slot-acc3-left, 125px); top: var(--char-slot-acc3-top, 113px); }
    .char-worth-card { background: var(--card); border: 1px solid var(--border); border-radius: 8px; padding: 18px; margin-bottom: 18px; }
    .char-worth-value { color: var(--gold-glow); font-size: 26px; font-weight: 700; margin-top: 4px; }
    .char-worth-note { color: var(--text-dim); font-size: 11px; margin-top: 6px; line-height: 1.5; }
    .char-summary-item { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--border); }
    .char-summary-item:last-child { border-bottom: none; }
    .char-summary-icon { width: 36px; height: 36px; border-radius: 5px; background: #0d0b08; border: 1px solid var(--border); display: flex; align-items: center; justify-content: center; font-size: 18px; flex-shrink: 0; }
    .char-summary-info { flex: 1; }
    .char-summary-name { font-size: 13px; font-weight: 500; color: var(--text); }
    .char-summary-slot { font-size: 11px; color: var(--text-dim); margin-top: 2px; text-transform: uppercase; letter-spacing: 0.05em; }
    .char-summary-level { background: #0d0b08; border: 1px solid var(--border); border-radius: 4px; color: var(--gold); font-size: 12px; font-weight: 600; padding: 5px 8px; outline: none; }
    .char-custom-card { margin-bottom: 0; }
    .char-skill-grid { display: grid; gap: 8px; }
    .char-custom-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; border-bottom: 1px solid var(--border); padding: 8px 0; }
    .char-custom-row:last-child { border-bottom: none; }
    .char-custom-row.muted { opacity: 0.48; }
    .character-editor-layout { grid-template-columns: 260px minmax(320px, 1fr) !important; }
    .character-layout-editor-card { display: grid; gap: 14px; justify-items: start; }
    .character-layout-editor-board { width: 163px; height: 187px; position: relative; background: url('../assets/character-equipment-frame.png') center / 100% 100% no-repeat; image-rendering: pixelated; }
    .layout-editor-slot { position: absolute; width: 31px; height: 31px; display: grid; place-items: center; border: 1px solid rgba(226,198,104,0.7); background: rgba(0,0,0,0.34); color: var(--gold); font-size: 10px; font-weight: 800; cursor: grab; user-select: none; touch-action: none; }
    .layout-editor-slot.dragging { cursor: grabbing; z-index: 10; outline: 2px solid var(--gold); background: rgba(201,168,76,0.18); }
    .character-layout-row { display: grid; grid-template-columns: minmax(90px, 1fr) 70px 70px; gap: 8px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--border); }
    .character-layout-row:last-child { border-bottom: 0; }
    .character-layout-row b { color: var(--text); font-size: 12px; }
    .character-layout-row input { min-width: 0; }
    @media (max-width: 820px) { header { min-height: 64px; padding: 10px 12px; gap: 10px; flex-wrap: wrap; } nav { order: 3; flex: 1 0 100%; max-width: none; width: 100%; justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto; padding-bottom: 2px; } .header-actions { margin-left: auto; } .settings-panel { top: 116px; right: 12px; } .chat-widget { right: 12px; bottom: 74px; width: min(330px, calc(100vw - 24px)); } .support-tab { left: 12px; right: 12px; bottom: 12px; transform: none; min-width: 0; max-width: none; width: auto; min-height: 0; gap: 10px; padding: 10px 12px; } .support-tab:hover { transform: translateY(-2px); } .support-tab-kicker { display: none; } .support-tab-text { flex: 1; font-size: 12px; text-align: left; } .support-tab-action { padding: 8px 10px; font-size: 10px; } .price-health-grid, .auction-layout, .daily-layout, .material-editor-layout { grid-template-columns: 1fr !important; } #editor-equipment-panel .editor-layout > div:nth-child(3), #editor-pet-panel .editor-layout > div:nth-child(3) { position: static; max-height: none; } #editor-equipment-panel .editor-layout > div:nth-child(3) .card, #editor-pet-panel .editor-layout > div:nth-child(3) .card { max-height: none; } #material-editor-list { max-height: none; } .daily-head, .daily-progress-head { display: grid; } .char-layout { grid-template-columns: 1fr; } .char-board { width: 148px; height: 176px; grid-template-columns: repeat(4, 32px); grid-template-rows: repeat(6, 25px); gap: 5px; } .char-slot, .char-deco-slot { width: 32px; height: 25px; } }
    @media (max-width: 820px) { .char-board { width: 163px; height: 187px; } .char-slot { width: 31px; height: 31px; } }
    .slot-picker-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,0.6); z-index: 999; }
    .slot-picker-modal { position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); background: var(--card); border: 1px solid var(--border); border-radius: 10px; padding: 24px; z-index: 1000; width: 320px; max-height: 80vh; overflow-y: auto; }
    .slot-picker-title { font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; font-size: 14px; color: var(--gold); letter-spacing: 0.1em; margin-bottom: 16px; }
    .slot-picker-item { display: flex; align-items: center; gap: 12px; padding: 10px; border-radius: 6px; cursor: pointer; transition: background 0.15s; border: 1px solid transparent; }
    .slot-picker-item:hover { background: rgba(201,168,76,0.06); border-color: var(--gold-dim); }
    .slot-picker-item.selected { background: rgba(201,168,76,0.1); border-color: var(--gold); }
    .slot-picker-item-icon { width: 36px; height: 36px; border-radius: 4px; background: #0d0b08; border: 1px solid var(--border); display: flex; align-items: center; justify-content: center; }
    .slot-picker-item-name { font-size: 13px; color: var(--text); }
    .slot-picker-item-level { font-size: 11px; color: var(--text-dim); }
    .talisman-layout { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 24px; align-items: start; }
    .talisman-total-value { color: var(--gold-glow); font-size: 24px; font-weight: 800; margin-top: 12px; }
    .talisman-total-note, .muted-small { color: var(--text-dim); font-size: 12px; line-height: 1.45; margin-top: 5px; }
    .talisman-material-row { display: grid; grid-template-columns: 34px 1fr; gap: 10px; align-items: center; padding: 9px 0; border-bottom: 1px solid var(--border); }
    .talisman-material-row:last-child { border-bottom: 0; }
    .talisman-material-row b { display: block; color: var(--text); font-size: 13px; }
    .talisman-material-row small { display: block; color: var(--text-dim); font-size: 11px; margin-top: 2px; }
    .talisman-table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: 8px; background: var(--card); }
    .talisman-table { width: 100%; min-width: 980px; border-collapse: collapse; font-size: 12px; }
    .talisman-table th, .talisman-table td { min-width: 56px; padding: 9px 8px; border-right: 1px solid rgba(255,255,255,0.07); border-bottom: 1px solid rgba(255,255,255,0.07); text-align: center; vertical-align: middle; }
    .talisman-table th:first-child { position: sticky; left: 0; z-index: 2; min-width: 86px; text-align: left; color: var(--gold); background: #14100b; }
    .talisman-table thead th { color: var(--gold-glow); background: rgba(201,168,76,0.08); font-weight: 800; }
    .talisman-cell-mat { display: inline-grid; grid-template-columns: 28px auto; align-items: center; gap: 4px; color: var(--gold); font-weight: 800; }
    .talisman-editor-levels { display: grid; gap: 10px; max-height: 620px; overflow: auto; padding-right: 4px; }
    .talisman-editor-level { border: 1px solid var(--border); border-radius: 8px; padding: 10px; background: rgba(0,0,0,0.16); }
    .talisman-editor-level-head { display: grid; grid-template-columns: 46px 1fr; gap: 10px; align-items: center; margin-bottom: 8px; }
    .talisman-editor-level-head b { color: var(--gold); }
    .talisman-editor-mats { display: grid; gap: 6px; margin-bottom: 8px; }
    .talisman-editor-mat { display: grid; grid-template-columns: minmax(140px, 1fr) 88px 34px; gap: 6px; align-items: center; }
    .talisman-editor-mat .btn { min-height: 34px; padding: 0; }
    @media (max-width: 820px) { .talisman-layout { grid-template-columns: 1fr; } .talisman-editor-mat { grid-template-columns: 1fr 78px 34px; } }
    ::-webkit-scrollbar { width: 6px; }
    ::-webkit-scrollbar-track { background: var(--bg); }
    ::-webkit-scrollbar-thumb { background: var(--border); border-radius: 3px; }
    ::-webkit-scrollbar-thumb:hover { background: var(--gold-dim); }

    /* Friendly visual pass */
    :root {
      --bg: #11110f;
      --surface: #181713;
      --card: #201e19;
      --border: #3a372f;
      --gold: #d5b65e;
      --gold-dim: #947a38;
      --gold-glow: #f0ce73;
      --text: #e5dfd1;
      --text-dim: #9a9283;
      --green: #6bc58a;
      --red: #d46b67;
      --info: #69aec0;
    }
    body { line-height: 1.45; }
    body::before {
      background: url('../assets/lirin_bloodline_mark.png') right -110px top 150px / clamp(560px, 48vw, 860px) auto no-repeat;
      opacity: .055;
      mix-blend-mode: screen;
      filter: saturate(.45) contrast(1.08);
    }
    header {
      padding: 12px 28px;
      min-height: 82px;
      background: rgba(24,23,19,.97);
      border-bottom-color: #403b31;
      box-shadow: 0 8px 26px rgba(0,0,0,.2);
    }
    .logo { font-size: 22px; letter-spacing: .04em; text-shadow: none; }
    nav { gap: 7px; max-width: 1040px; }
    .nav-btn {
      min-height: 36px;
      padding: 8px 11px;
      background: #14130f;
      border-color: #302e28;
      border-radius: 6px;
      color: #a9a194;
      font-family: inherit;
      font-size: 11px;
      font-weight: 650;
      letter-spacing: 0;
      text-transform: none;
    }
    .nav-btn:hover { color: var(--text); border-color: #665a3b; background: #1c1a15; }
    .nav-btn.active { color: #17150f; border-color: var(--gold); background: var(--gold); box-shadow: 0 3px 12px rgba(213,182,94,.16); }
    .language-select, .settings-btn, .logout-btn { min-height: 36px; border-radius: 6px; font-family: inherit; letter-spacing: 0; text-transform: none; }
    .settings-btn { background: #14130f; }
    main { max-width: 1260px; padding: 44px 28px 96px; }
    .page-title { color: #f0dfac; font-size: 30px; letter-spacing: 0; margin-bottom: 4px; }
    .page-subtitle { max-width: 720px; margin-bottom: 26px; color: #a69e90; font-size: 14px; letter-spacing: 0; line-height: 1.55; }
    .section-title { margin-bottom: 14px; color: #d8bd71; font-family: inherit; font-size: 13px; font-weight: 750; letter-spacing: .02em; text-transform: none; }
    .section-title::after { background: var(--border); }
    .card, .char-worth-card, .auction-card, .daily-category-card { border-color: #403c33; box-shadow: 0 10px 28px rgba(0,0,0,.13); }
    .chapter-strip {
      width: fit-content;
      margin-bottom: 14px;
      padding: 5px;
      gap: 5px;
      border: 1px solid var(--border);
      border-radius: 8px;
      background: #181713;
    }
    .chapter-btn {
      min-width: 132px;
      min-height: 38px;
      padding: 8px 18px;
      border-color: transparent;
      border-radius: 6px;
      background: transparent;
      color: var(--text-dim);
      font-size: 12px;
    }
    .chapter-btn:hover { border-color: #4a463c; background: #201e19; }
    .chapter-btn.active { color: #18150e; border-color: var(--gold); background: var(--gold); box-shadow: 0 3px 12px rgba(213,182,94,.18); }
    .chapter-btn:nth-child(2).active { color: #071416; border-color: var(--info); background: var(--info); box-shadow: 0 3px 12px rgba(105,174,192,.18); }
    .tab-strip { gap: 8px; margin-bottom: 24px; }
    .tab-btn { min-height: 36px; padding: 7px 14px; border-radius: 6px; background: #171611; font-weight: 650; }
    .tab-btn:hover { background: #211f1a; }
    .tab-btn.active { color: var(--gold-glow); border-color: #796536; background: rgba(213,182,94,.11); box-shadow: inset 0 0 0 1px rgba(213,182,94,.08); }
    .upgrade-layout { grid-template-columns: 360px minmax(0, 1fr); gap: 28px; }
    .item-select-btn {
      min-height: 50px;
      padding: 9px 11px;
      border-color: #3b3830;
      border-radius: 7px;
      background: #191813;
      font-size: 13px;
    }
    .item-select-btn:hover { color: var(--text); border-color: #77683f; background: #242119; transform: translateY(-1px); }
    .item-select-btn.active { color: #f0d98d; border-color: var(--gold); background: #2a2518; box-shadow: inset 3px 0 0 var(--gold); }
    .item-select-icon { width: 32px; height: 32px; }
    .item-select-level { padding: 3px 7px; border-radius: 4px; background: #11100d; color: #aaa292; font-size: 10px; }
    .counter, .field-input, .field-select, .select-wrap select, .mat-price-input, .tbl-pi { border-radius: 6px; background: #14130f; }
    .counter button { width: 36px; height: 38px; }
    .counter input { height: 38px; background: #181713; }
    .upgrade-step { border-radius: 8px; background: #181713; }
    .step-active { border-color: #655a3c; background: #1e1c16; }
    .step-mat-chip { border-radius: 6px; background: #12110e; }
    .btn { min-height: 38px; border-radius: 6px; letter-spacing: 0; }
    .btn-gold { color: #17150f; border-color: var(--gold); background: var(--gold); }
    .btn-gold:hover { color: #11100d; background: var(--gold-glow); }
    .home-card { background: #1d1b17; border-color: #3d3931; }
    .home-card:hover { background: #242119; box-shadow: 0 10px 26px rgba(0,0,0,.18); }
    .home-card-title { color: #ead18a; font-family: inherit; font-size: 14px; font-weight: 750; letter-spacing: 0; }
    .support-tab { background: rgba(30,28,23,.97); border-color: #494438; }
    .chat-widget { border-color: #5c5135; box-shadow: 0 18px 50px rgba(0,0,0,.42); }
    body.guest-mode input:disabled,
    body.guest-mode select:disabled,
    body.guest-mode textarea:disabled,
    body.guest-mode button:disabled { opacity: .72; }
    @media (max-width: 820px) {
      header { padding: 10px 12px; }
      main { padding: 30px 16px 100px; }
      .page-title { font-size: 26px; }
      body::before { background-position: center top 180px; background-size: 520px auto; opacity: .035; }
      .chapter-strip { width: 100%; }
      .chapter-btn { min-width: 0; flex: 1; }
      .upgrade-layout { grid-template-columns: 1fr; gap: 22px; }
      .material-craft-ingredient { grid-template-columns: minmax(0, 1fr) 72px 38px; }
    }

    /* Dojang betting */
    .dojang-head { display: flex; align-items: start; justify-content: space-between; gap: 18px; }
    .dojang-login-note { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 20px; padding: 14px 16px; border: 1px solid #4f4733; border-radius: 8px; background: rgba(213,182,94,.07); }
    .dojang-login-note div { display: grid; gap: 2px; }
    .dojang-login-note b { color: var(--gold-glow); font-size: 13px; }
    .dojang-login-note span { color: var(--text-dim); font-size: 12px; }
    .dojang-wallet { display: grid; grid-template-columns: repeat(3, minmax(150px, 1fr)) auto; gap: 1px; margin-bottom: 16px; overflow: hidden; border: 1px solid var(--border); border-radius: 8px; background: var(--border); }
    .dojang-wallet-stat, .dojang-wallet-actions { padding: 15px 17px; background: var(--card); }
    .dojang-wallet-stat { display: grid; gap: 3px; }
    .dojang-wallet-stat span { color: var(--text-dim); font-size: 10px; font-weight: 700; text-transform: uppercase; }
    .dojang-wallet-stat strong { color: var(--gold-glow); font-size: 17px; }
    .dojang-wallet-actions { display: flex; align-items: center; gap: 8px; }
    .dojang-withdraw { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(160px, .7fr) auto; gap: 12px; align-items: end; margin-bottom: 12px; }
    .dojang-filter-row { display: flex; gap: 8px; margin: 22px 0 14px; }
    .dojang-match-list, .dojang-admin-list { display: grid; gap: 12px; }
    .dojang-match { padding: 0; overflow: hidden; }
    .dojang-match-top { display: flex; justify-content: space-between; gap: 16px; padding: 13px 16px; border-bottom: 1px solid var(--border); background: rgba(0,0,0,.12); }
    .dojang-match-meta { color: var(--text-dim); font-size: 11px; }
    .dojang-state { align-self: start; padding: 4px 7px; border: 1px solid var(--border); border-radius: 4px; color: var(--text-dim); font-size: 9px; font-weight: 800; text-transform: uppercase; }
    .dojang-state.open { border-color: rgba(107,197,138,.55); color: var(--green); }
    .dojang-state.live { border-color: rgba(212,107,103,.6); color: var(--red); }
    .dojang-state.settled { color: var(--gold); }
    .dojang-versus { display: grid; grid-template-columns: 1fr 68px 1fr; align-items: stretch; }
    .dojang-player { display: grid; gap: 7px; padding: 20px 18px; }
    .dojang-player.side-b { text-align: right; }
    .dojang-player-name { color: var(--text); font-size: 19px; font-weight: 800; }
    .dojang-player-pool { color: var(--text-dim); font-size: 11px; }
    .dojang-player-pool strong { color: var(--gold); }
    .dojang-odds { color: var(--info); font-size: 12px; font-weight: 750; }
    .dojang-vs { display: grid; place-items: center; color: var(--gold-dim); font-family: Georgia, serif; font-size: 18px; font-weight: 800; }
    .dojang-bet-row { display: grid; grid-template-columns: minmax(120px, 1fr) auto auto; gap: 8px; padding: 12px 16px; border-top: 1px solid var(--border); }
    .dojang-own-bet { padding: 9px 16px; border-top: 1px solid var(--border); color: var(--text-dim); font-size: 11px; }
    .dojang-own-bet b { color: var(--gold-glow); }
    .dojang-winner { color: var(--green); }
    .dojang-admin-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(280px, .8fr); gap: 20px; }
    .dojang-admin-form, .dojang-admin-credit { display: grid; gap: 12px; }
    .dojang-admin-row { display: grid; grid-template-columns: minmax(220px, 1fr) auto; gap: 12px; align-items: center; padding: 13px 14px; border: 1px solid var(--border); border-radius: 7px; background: var(--card); }
    .dojang-admin-row-title { color: var(--text); font-weight: 750; }
    .dojang-admin-row-meta { color: var(--text-dim); font-size: 11px; }
    .dojang-admin-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
    .dojang-admin-actions .btn { min-height: 32px; padding: 6px 9px; font-size: 10px; }
    @media (max-width: 820px) {
      .dojang-head, .dojang-login-note { align-items: stretch; flex-direction: column; }
      .dojang-wallet { grid-template-columns: 1fr 1fr; }
      .dojang-wallet-actions { grid-column: 1 / -1; }
      .dojang-withdraw, .dojang-admin-grid { grid-template-columns: 1fr; }
      .dojang-versus { grid-template-columns: 1fr 42px 1fr; }
      .dojang-player { padding: 16px 12px; }
      .dojang-player-name { font-size: 15px; }
      .dojang-bet-row { grid-template-columns: 1fr 1fr; }
      .dojang-bet-row input { grid-column: 1 / -1; }
      .dojang-admin-row { grid-template-columns: 1fr; }
      .dojang-admin-actions { justify-content: flex-start; }
    }