.converter-panel { padding: clamp(20px,3vw,32px); border: 1px solid var(--line-2); border-radius: var(--radius); background: var(--surface); max-width: 860px; }
.converter-balances { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; padding-bottom: 24px; border-bottom: 1px solid var(--line); }
.converter-stat { display: grid; gap: 8px; }
.converter-stat > span,.converter-destination > span { color: var(--muted); font-size: 14px; }
.converter-stat > strong { font-size: clamp(32px,4vw,48px); letter-spacing: -1.5px; line-height: 1.1; }
.converter-stat > small { color: var(--muted); }
.converter-destination { padding-left: 24px; border-left: 1px solid var(--line); }
.converter-destination .loyalty-box { margin-top: 12px; }
.converter-tier { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: 22px 0; color: var(--accent-ink); }
.converter-tier > span { margin-left: auto; color: var(--muted); font-size: 13px; }
.converter-form { display: grid; gap: 12px; margin: 22px 0; }
.converter-form label { font-size: 14px; font-weight: 700; }
.converter-entry { display: flex; gap: 10px; }
.converter-entry input,.loyalty-admin input[type="number"],.loyalty-admin input[type="password"],.loyalty-review input { width: 100%; min-width: 0; padding: 12px 14px; color: var(--text); background: var(--bg); border: 1px solid var(--line-2); border-radius: var(--radius-sm); }
.converter-entry .btn { flex-shrink: 0; }
.converter-preview { color: var(--accent-ink); font-size: clamp(20px,2.7vw,28px); font-weight: 800; }
.converter-after { min-height: 18px; font-size: 12px; color: var(--muted); }
.converter-form > .btn { justify-self: start; }
.converter-daily { display: grid; gap: 10px; padding-top: 20px; border-top: 1px solid var(--line); }
.converter-daily b { font-size: 13px; }
.converter-daily small { color: var(--muted); }
.converter-daily progress { width: 100%; height: 6px; border: 0; border-radius: 4px; overflow: hidden; background: var(--surface-3); accent-color: var(--accent); }
.converter-daily progress::-webkit-progress-bar { background: var(--surface-3); }
.converter-daily progress::-webkit-progress-value { background: var(--accent); }
.converter-rules,.converter-history { margin-top: 30px; }
.converter-rules h2,.converter-history h2 { font-size: 20px; margin-bottom: 18px; }
.loyalty-tiers { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
.loyalty-tier { position: relative; padding: 22px 18px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.loyalty-tier.is-current { border-color: var(--accent); box-shadow: inset 0 3px var(--accent); }
.loyalty-tier h3 { font-size: 14px; margin-bottom: 18px; }
.loyalty-tier strong { display: block; color: var(--accent-ink); font-size: 28px; }
.loyalty-tier.tier-2 strong { color: #67d8ff; }
.loyalty-tier.tier-3 strong { color: var(--gold); }
.loyalty-tier > span { font-size: 14px; color: var(--muted); }
.loyalty-tier p { font-size: 13px; margin-top: 16px; }
.loyalty-tier small { display: inline-block; color: var(--accent-ink); margin-top: 12px; font-size: 11px; }
.converter-rules > .muted { font-size: 12px; margin-top: 16px; }
.loyalty-notice { padding: 14px 16px; margin: 18px 0; border-radius: var(--radius-sm); background: var(--accent-soft); color: var(--muted); font-size: 14px; line-height: 1.6; }
.loyalty-notice.is-warning { color: #ffd39c; background: rgba(255,138,31,.08); }
.loyalty-admin { display: grid; gap: 22px; }
.loyalty-admin form { display: grid; gap: 16px; }
.loyalty-admin label { display: grid; gap: 7px; font-size: 13px; }
.loyalty-admin label:has(input[type="checkbox"]) { display: flex; align-items: center; }
.loyalty-admin .admin-table input { max-width: 140px; }
.loyalty-admin .admin-card > .btn,.loyalty-admin .admin-card > a { margin-top: 16px; }
.loyalty-review { display: grid; gap: 18px; }
.site-balance { display: grid; gap: 6px; }
.site-balance small { color: var(--muted); font-size: 14px; }
.site-balance strong,.site-balance__value { font-size: 28px; color: var(--accent-ink); }
.site-shop-preview { display: grid; place-items: center; min-height: 180px; background: var(--surface-2); }
.site-shop-preview img { width: 96px; height: 96px; border-radius: 50%; border: 4px solid var(--frame-color); box-shadow: 0 0 24px color-mix(in srgb,var(--frame-color) 25%,transparent); }
.site-shop-card .shop-card__price { font-size: 14px; }
.site-shop-owned { color: var(--accent-ink); margin-top: 12px; }
html[data-profile-frame="frame-purple"] { --site-frame: #ae78ff; }
html[data-profile-frame="frame-blue"] { --site-frame: #67d8ff; }
html[data-profile-frame="frame-gold"] { --site-frame: #ffcb54; }
html[data-profile-frame^="frame-"] .site-own-avatar { outline: 3px solid var(--site-frame); outline-offset: 2px; border-radius: 50%; }
[data-frame="frame-purple"] { --site-frame: #ae78ff; }
[data-frame="frame-blue"] { --site-frame: #67d8ff; }
[data-frame="frame-gold"] { --site-frame: #ffcb54; }
[data-frame^="frame-"] { outline: 3px solid var(--site-frame); outline-offset: 2px; border-radius: 50%; }
@media(max-width:800px) { .loyalty-tiers { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:500px) { .converter-balances { grid-template-columns: 1fr; gap: 18px; } .converter-destination { padding: 18px 0 0; border-left: 0; border-top: 1px solid var(--line); } .converter-tier > span { margin-left: 0; width: 100%; } .converter-entry { flex-wrap: wrap; } .converter-form > .btn { width: 100%; } .loyalty-tier { padding: 18px 12px; } .loyalty-tier strong { font-size: 25px; } }
