button:disabled { cursor: wait; opacity: .7; }
.settings-form textarea{width:100%;box-sizing:border-box;padding:11px;border:1px solid #343a4e;border-radius:10px;background:#0c101b;color:#fff;resize:vertical}
.refresh-action { display: flex; gap: 12px; align-items: center; }
.refresh-action small { max-width: 320px; margin: 0; text-align: right; }
.refresh-feedback { display: grid; grid-template-columns: 1fr auto; gap: 8px 16px; padding: 17px 20px; margin-bottom: 16px; border: 1px solid #6550a8; border-radius: 16px; background: #17152a; }
.refresh-feedback span { display: block; color: #aeb4c7; margin-top: 4px; }
.refresh-feedback.success { border-color: #277b63; background: #10271f; }
.refresh-feedback.error { border-color: #a3485d; background: #2b131a; }
.refresh-track { grid-column: 1 / -1; height: 7px; border-radius: 9px; background: #282b3c; overflow: hidden; }
.refresh-track i { display: block; width: 0; height: 100%; background: linear-gradient(90deg,#7548ff,#ef5d97); transition: width .35s; }
.template-hidden { opacity: .52; filter: grayscale(.55); }
.income { color: #65d6a6; }.expense { color: #ff718d; }#ledger-dialog { width: min(720px, 92vw); max-height: 82vh; overflow: auto; }#ledger-list p,#ip-list p { padding: 11px; border-bottom: 1px solid #2b3040; }#close-ledger { float: right; }
.cards { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 9px; }
.cards article { position: relative; grid-template-columns: 64px 1fr; gap: 9px; padding: 9px; cursor: grab; }
.cards article:active { cursor: grabbing; }
.template-sort-group { margin: 0 0 18px; }
.template-sort-group h3 { display: flex; gap: 10px; align-items: baseline; margin: 8px 0; }
.template-sort-group h3 small { color: #858da3; font-size: 11px; font-weight: 400; }
.template-dragging { opacity: .35; outline: 2px dashed #9b66ff; }
.cards .hot-action { position: absolute; z-index: 3; top: 5px; right: 5px; width: auto; min-height: 0; margin: 0; padding: 4px 7px; border: 1px solid #4a465b; border-radius: 999px; background: rgba(17,20,31,.9); color: #777e91; font-size: 10px; }
.cards .hot-action.active { border-color: #ff718d; background: linear-gradient(135deg,#ff773d,#e9328c); color: #fff; box-shadow: 0 2px 9px rgba(239,69,112,.35); }
.cards img { width: 64px; height: 86px; }
.template-preview-trigger,.template-preview-static{position:relative;width:64px;height:86px;margin:0;padding:0;overflow:hidden;border:0;border-radius:9px;background:#090b13}.cards .template-preview-trigger{width:64px;margin:0;padding:0}.template-preview-trigger img,.template-preview-static img{display:block;width:100%;height:100%;object-fit:cover}.template-preview-trigger span{position:absolute;left:50%;top:50%;display:grid;width:30px;height:30px;place-items:center;transform:translate(-50%,-50%);border:1px solid rgba(255,255,255,.7);border-radius:50%;background:rgba(8,10,17,.72);color:#fff;font-size:13px;box-shadow:0 4px 14px rgba(0,0,0,.4);transition:transform .18s,background .18s}.template-preview-trigger:hover span,.template-preview-trigger:focus-visible span{transform:translate(-50%,-50%) scale(1.12);background:#7548ff}.template-preview-trigger:focus-visible{outline:2px solid #a982ff;outline-offset:2px}
.template-preview-dialog{width:min(900px,calc(100vw - 32px));max-height:calc(100vh - 32px);padding:22px}.template-preview-dialog::backdrop{background:rgba(3,5,11,.82)}.template-preview-dialog>button{float:right}.template-preview-dialog h2{margin:5px 0 14px}.template-preview-dialog video{display:block;width:100%;max-height:calc(100vh - 145px);border-radius:13px;background:#000}
.template-info { min-width: 0; display: flex; flex-direction: column; }
.template-info > b,.template-info > small { overflow-wrap: anywhere; }
.template-info > small { font-size: 11px; line-height: 1.35; }
.template-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; margin-top: auto; padding-top: 6px; }
.cards .template-actions button { width: auto; min-width: 0; min-height: 30px; margin: 0; padding: 5px 3px; font-size: 11px; white-space: nowrap; }
.template-actions .visibility-action { color: #ff93a9; border-color: #6c3b4b; }
.template-hidden .template-actions .visibility-action { color: #7ee4ba; border-color: #356a58; }
.template-actions .recommended-action { color: #8f96aa; border-color: #444b63; }
.template-actions .recommended-action.active { color: #fff; border-color: #5968ff; background: linear-gradient(135deg,#315db8,#7548ff); }
.composition-template-panel{margin:14px 0 24px;padding:14px;border:1px solid #51436f;border-radius:14px;background:#151425}.composition-template-panel>h3{margin:0 0 4px}.composition-template-panel>p{color:#a9a5b6}.composition-template-status{display:block;margin:5px 0;line-height:1.55}.composition-preview-upload{display:grid;gap:5px;margin:8px 0;color:#d9ccff;font-size:12px}.composition-preview-upload input{max-width:100%}
.composition-upload-progress{margin:8px 0;color:#d9ccff;font-size:12px}.composition-upload-progress span{display:block;margin-bottom:5px}.composition-upload-progress b{display:block;height:8px;overflow:hidden;border-radius:999px;background:#29243d}.composition-upload-progress-bar{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#7c4dff,#e346c7);transition:width .2s ease}
.template-settings-dialog { width: min(430px, 92vw); border: 1px solid #4d436b; border-radius: 16px; background: #111522; color: #fff; }
.template-settings-dialog::backdrop { background: rgba(4,6,12,.72); }
.template-settings-dialog form { display: grid; gap: 13px; }
.template-settings-dialog label { display: grid; gap: 6px; color: #aeb4c7; }
.template-settings-dialog select,.template-settings-dialog input { width: 100%; box-sizing: border-box; padding: 9px; border: 1px solid #3a4054; border-radius: 9px; background: #171c2b; color: #fff; }
.template-settings-dialog menu { display: flex; justify-content: flex-end; gap: 8px; margin: 4px 0 0; padding: 0; }
.tr button.danger { color: #ff93a9; border-color: #6c3b4b; }
@media (max-width: 520px) { .cards { grid-template-columns: repeat(auto-fill, minmax(205px, 1fr)); }.template-actions { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.code-presets { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; color: #9da4b8; }
.code-presets button { border: 1px solid #51436f; border-radius: 999px; padding: 7px 15px; background: #211a34; color: #fff; }
.generated-batches { display: grid; gap: 12px; margin: 16px 0 26px; }
.code-batch { overflow: hidden; border: 1px solid #3b4054; border-radius: 14px; background: #0d111c; }
.code-batch header { position: static; display: flex; gap: 12px; align-items: center; justify-content: space-between; padding: 12px 14px; background: #171c2b; border: 0; }
.code-batch header div:last-child { display: flex; gap: 7px; }
.code-batch button { border: 1px solid #444b63; border-radius: 8px; padding: 7px 10px; background: #252b3e; color: #fff; }
.code-batch button.danger { border-color: #6c3b4b; color: #ff93a9; }
.code-batch.batch-revoked { opacity: .62; }
.expiry-hint { margin: -8px 0 8px; }
.code-batch pre { max-height: 210px; margin: 0; padding: 14px; overflow: auto; color: #8fe0b8; font: 13px/1.65 ui-monospace, monospace; white-space: pre-wrap; }
.code-status-list,.batch-status-list { overflow-x: auto; border: 1px solid #343a4e; border-radius: 10px; background: #111522; }
.batch-status-dialog { width: min(880px, calc(100vw - 32px)); max-height: min(720px, calc(100vh - 48px)); box-sizing: border-box; }
.batch-status-dialog .batch-status-list { max-height: 560px; overflow: auto; }
.batch-status-dialog > button { float: right; }
.code-status-head,.code-status-row { display: grid; grid-template-columns: minmax(150px,1.4fr) 60px 72px minmax(90px,1fr) minmax(155px,1.25fr); gap: 10px; align-items: center; min-width: 650px; padding: 7px 10px; }
.code-status-head { position: sticky; top: 0; color: #8f96aa; background: #1a1f2e; font-size: 12px; }
.code-status-row { border-top: 1px solid #292f40; font-size: 12px; }
.code-status-row b { font-family: ui-monospace, monospace; }
.code-status-row small { margin: 0; font-size: 11px; }
.code-status-row.redeemed > span:nth-child(3) { color: #65d6a6; }.code-status-row.unused > span:nth-child(3) { color: #f2bd68; }.code-status-row.inactive > span:nth-child(3) { color: #ff718d; }
@media (max-width: 700px) { .code-toolbar { flex-direction: column; }.code-toolbar input,.code-toolbar button { width: 100%; min-width: 0; }.code-batch header { align-items: flex-start; flex-direction: column; } }
.dashboard-panel > h2 { margin: 0 0 5px; }
.dashboard-panel > p { margin: 0 0 18px; color: #9299ac; }
.dashboard-panel .refresh-feedback { margin-bottom: 18px; }
.dashboard-panel .stats { margin-bottom: 22px; }
.dashboard-panel > h3 { margin: 4px 0 12px; }
.dashboard-attention { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 10px; }
.dashboard-attention article { min-width: 0; padding: 15px; border: 1px solid #30364a; border-radius: 13px; background: #0d111c; }
.dashboard-attention b { display: block; font-size: 25px; }
.dashboard-attention span { display: block; margin-top: 5px; color: #dce0ec; font-size: 13px; }
.dashboard-attention small { font-size: 11px; }
.dashboard-attention .attention-queued { border-color: #665227; }
.dashboard-attention .attention-running { border-color: #315f87; }
.dashboard-attention .attention-failed { border-color: #713548; }
.user-panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 14px; }
.user-panel-heading h2,.user-panel-heading p { margin: 0 0 5px; }
.user-panel-heading .toolbar { margin: 0; }
.user-table { min-width: 920px; overflow-x: auto; }
.user-table .tr { grid-template-columns: minmax(140px,1fr) 70px minmax(105px,.8fr) minmax(180px,1.5fr) minmax(340px,2.4fr); padding: 12px 10px; }
.user-table .tr > span { min-width: 0; }
.user-table .tr > span:nth-child(4) { color: #aeb4c7; font-size: 13px; }
.user-table .user-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.user-table .user-actions button { padding: 7px 9px; font-size: 12px; }
.user-pagination { display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 18px; }
.user-pagination button { border: 1px solid #3a4054; border-radius: 9px; padding: 8px 14px; background: #171c2b; color: #fff; }
.user-detail-dialog { width: min(680px,calc(100vw - 32px)); }
.user-detail-dialog > button { float: right; }
.user-detail-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; clear: both; }
.user-detail-grid > div { min-width: 0; padding: 13px; border: 1px solid #30364a; border-radius: 11px; background: #0d111c; }
.user-detail-grid > div:last-child { grid-column: 1 / -1; }
.user-detail-grid span { display: block; margin-bottom: 6px; color: #8f96aa; font-size: 12px; }
.user-detail-grid b { overflow-wrap: anywhere; }
.category-mode-settings { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; margin-bottom: 8px; padding: 12px; overflow-x: auto; border: 1px solid #30364a; border-radius: 12px; background: #0d111c; }
.category-mode-settings > b { flex: 0 0 100%; }
.category-mode-settings label { display: flex; align-items: center; justify-content: flex-start; gap: 6px; }
.category-mode-settings select { width: 100%; min-width: 0; padding: 8px; border: 1px solid #3a4054; border-radius: 9px; background: #171c2b; color: #fff; }
.category-mode-settings input,.beta-controls input[type="number"] { width: 100%; min-width: 0; box-sizing: border-box; padding: 8px; border: 1px solid #3a4054; border-radius: 9px; background: #171c2b; color: #fff; }
.category-mode-row { flex: 1 1 100%; display: grid !important; grid-template-columns: minmax(96px,1fr) minmax(132px,.9fr) auto minmax(190px,1.35fr) auto 72px auto 72px auto 64px; gap: 8px 10px !important; min-width: 900px; }
.category-mode-row .category-name { overflow: hidden; color: #f2f4fa; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.category-mode-row > span:not(.category-name) { color: #aeb4c7; white-space: nowrap; }
.category-mode-feedback { min-height: 18px; margin: 0 0 12px; color: #79d9b0; font-size: 13px; }
.beta-controls { display: flex; flex-wrap: wrap; gap: 12px 20px; align-items: center; margin-bottom: 16px; padding: 14px; border: 1px solid #554476; border-radius: 12px; background: #171329; }
.beta-controls label { display: flex; gap: 8px; align-items: center; }
.beta-controls small { flex: 1 1 100%; margin: 0; }
.beta-controls select { padding: 8px; border: 1px solid #3a4054; border-radius: 9px; background: #171c2b; color: #fff; }
@media (max-width: 700px) { .category-mode-settings { gap: 8px; overflow-x: visible; }.category-mode-settings label { flex: 1 1 100%; width: 100%; }.category-mode-row { grid-template-columns: minmax(88px,.8fr) minmax(0,1.2fr); gap: 8px 10px !important; min-width: 0; padding: 10px 0; border-top: 1px solid #262c3d; }.category-mode-row:first-of-type { border-top: 0; }.category-mode-settings select { margin-left: 0; }.category-mode-row .category-name { align-self: center; }.category-mode-row input { width: 100%; } }
.purchase-settings-form { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; max-width: 760px; }
.purchase-settings-form label { display: grid; gap: 6px; color: #aeb4c7; }
.purchase-settings-form input:not([type="checkbox"]) { width: 100%; box-sizing: border-box; }
.purchase-settings-form img { grid-column: 1 / -1; width: min(100%,420px); max-height: 420px; border-radius: 12px; object-fit: contain; background: #090b12; }
.purchase-settings-form > button,.purchase-settings-form > p { grid-column: 1 / -1; }
@media (max-width: 700px) { .purchase-settings-form { grid-template-columns: 1fr; } }
@media (max-width: 700px) { .refresh-action small { display: none; } }
#login[open] { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; border: 0; border-radius: 0; background: radial-gradient(circle at 50% 20%, #2b165b 0, transparent 38%), #090b13; }
#login form { width: min(92vw, 380px); padding: 30px; border: 1px solid #343a4e; border-radius: 20px; background: #111522; box-shadow: 0 24px 70px #0009; }
@media (max-width: 700px) {
  body { overflow-x: hidden; }
  header { position: static; flex-wrap: wrap; gap: 10px; padding: 12px 14px; }
  header > div:first-child { min-width: 0; }
  header b { font-size: 19px; }
  .refresh-action { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); width: 100%; gap: 8px; }
  .refresh-action button { width: 100%; min-width: 0; padding: 10px 7px; }
  main { width: 100%; padding: 14px 10px 28px; }
  .stats { gap: 8px; }
  .stats article { min-width: 0; padding: 12px; border-radius: 13px; }
  .stats b { font-size: 23px; }
  .stats span { font-size: 12px; }
  nav { width: 100%; margin: 14px 0; padding-bottom: 5px; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; }
  nav button { flex: 0 0 auto; padding: 9px 12px; white-space: nowrap; }
  .panel { min-width: 0; padding: 12px; border-radius: 14px; }
  .toolbar { flex-direction: column; gap: 8px; }
  .toolbar input,.toolbar select,.toolbar button { width: 100%; min-width: 0; }
  .dashboard-panel { padding: 12px; }
  .dashboard-attention { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .dashboard-attention article { padding: 12px; }
  .user-panel-heading { display: block; }
  .user-panel-heading .toolbar { margin-top: 12px; }
  .user-table { min-width: 0; overflow: visible; }
  .user-table .tr { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 12px; }
  .user-table .tr.head { display: none; }
  .user-table .tr > span { display: grid; gap: 3px; }
  .user-table .tr > span::before { content: attr(data-label); color: #858da3; font-size: 11px; }
  .user-table .tr > span:first-child,.user-table .user-actions { grid-column: 1 / -1; }
  .user-table .tr > span:first-child::before,.user-table .user-actions::before { display: none; }
  .user-table .user-actions { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .user-detail-grid { grid-template-columns: 1fr; }
  .user-detail-grid > div:last-child { grid-column: auto; }
  .tr { display: grid; grid-template-columns: 1fr; gap: 8px; margin-bottom: 10px; padding: 12px; border: 1px solid #2d3345; border-radius: 12px; background: #151a28; }
  .tr span:last-child { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
  .tr span:last-child button { min-width: 0; padding: 9px 4px; }
  .cards { grid-template-columns: 1fr; }
  .cards article { grid-template-columns: 70px minmax(0, 1fr); }
  .template-sort-group h3 { align-items: flex-start; flex-direction: column; gap: 2px; }
  .code-presets { flex-wrap: wrap; }
  .code-batch header div:last-child { flex-wrap: wrap; }
  .code-batch header div:last-child button { flex: 1 1 42%; }
  .beta-controls { align-items: stretch; flex-direction: column; gap: 10px; }
  .beta-controls label { justify-content: space-between; }
  .beta-controls select { max-width: 58%; }
  dialog:not(#login) { width: calc(100vw - 20px); max-width: none; max-height: calc(100vh - 20px); padding: 18px; overflow: auto; }
  dialog:not(#login) form { min-width: 0; }
  .template-settings-dialog menu { display: grid; grid-template-columns: 1fr 1fr; }
}