/* Activate uses a wider workspace while keeping every control in the same flow. */ #panel-redeem.active { grid-template-columns:minmax(20px,1fr) minmax(350px,400px) minmax(550px,880px) minmax(20px,1fr); column-gap:24px; } #panel-redeem .redeem-panel-body, #panel-redeem .redeem-composer { scrollbar-gutter:stable; } #panel-redeem .redeem-overview, #panel-redeem .redeem-composer, #panel-redeem .redeem-servers { border-radius:22px; } #panel-redeem .redeem-overview { gap:24px; padding:30px; } #panel-redeem .redeem-overview-intro h2 { font-size:32px; } #panel-redeem .redeem-overview-intro p, #panel-redeem .redeem-form-intro p { max-width:55ch; font-size:14px; line-height:1.55; } #panel-redeem .redeem-overview-intro p { min-height:44px; } #panel-redeem .redeem-form-intro h2 { font-size:27px; } #panel-redeem .redeem-composer { padding:32px 36px 36px; } #panel-redeem .redeem-form-section-heading strong { font-size:16px; } #panel-redeem .redeem-form-section-heading span { width:29px; height:29px; border-radius:9px; } #panel-redeem .redeem-fields { gap:14px; } #panel-redeem #redeem-account-step { grid-template-columns:minmax(0,1fr); } #panel-redeem #redeem-account-step .redeem-fields { grid-template-columns:minmax(0,1fr); } #panel-redeem label, #panel-redeem .redeem-region-field { gap:7px; font-size:13px; } #panel-redeem input, #panel-redeem select, #panel-redeem textarea { min-height:48px; padding:10px 13px; border-radius:12px; font-size:14px; } #panel-redeem .redeem-status-panel { gap:14px; padding:18px; border-radius:16px; } #panel-redeem .redeem-idle-status strong { font-size:15px; } #panel-redeem .redeem-idle-status small { font-size:13px; } #panel-redeem .redeem-last-result { font-size:13px; line-height:1.45; } #panel-redeem .redeem-flow-help { border-top:1px solid var(--border); padding-top:17px; color:var(--text2); font-size:12px; line-height:1.5; } #panel-redeem .redeem-flow-help summary { width:fit-content; color:var(--accent); cursor:pointer; font-weight:650; } #panel-redeem .redeem-flow-help ol { display:grid; gap:8px; margin:12px 0 0; padding-left:19px; } #panel-redeem .redeem-flow-help li { padding-left:3px; } #panel-redeem .redeem-success-preview { width:100%; justify-items:stretch; } #panel-redeem .redeem-success-preview a { position:relative; width:100%; max-width:none; border-radius:13px; } #panel-redeem .redeem-success-preview a::after { content:'Увеличить снимок ↗'; position:absolute; right:9px; bottom:9px; padding:7px 10px; border-radius:8px; background:rgba(7,10,16,.82); color:#fff; font-size:11px; line-height:1; } #panel-redeem .redeem-success-preview img { display:block; width:100%; max-width:none; max-height:270px; object-fit:contain; } #panel-redeem .redeem-success-preview figcaption { font-size:11px; line-height:1.4; } #panel-redeem .redeem-game-key, #panel-redeem .redeem-game-key:only-child { grid-template-columns:65px minmax(0,1fr) 48px; grid-template-rows:auto auto; align-items:center; gap:9px 11px; padding:13px 0; border:0; border-bottom:1px solid var(--border); border-radius:0; background:transparent; } #panel-redeem .redeem-game-key:last-child { border-bottom:0; } #panel-redeem .redeem-game-key:only-child { grid-template-columns:65px minmax(0,1fr); } #panel-redeem .redeem-game-key-number { grid-column:1; grid-row:1/3; padding-top:0; align-self:center; text-align:left; } #panel-redeem .redeem-game-key input { grid-column:2; grid-row:1; min-width:0; } #panel-redeem .redeem-game-key .redeem-key-region-button { grid-column:2; grid-row:2; } #panel-redeem .redeem-game-key .redeem-key-remove { grid-column:3; grid-row:1; display:grid; place-items:center; width:48px; height:48px; min-height:48px; padding:0; align-self:center; color:var(--text2); } #panel-redeem .redeem-game-key .redeem-key-remove svg { display:block; width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; } #panel-redeem .redeem-game-key .redeem-key-remove:hover { color:var(--text); } #panel-redeem .redeem-game-key .redeem-key-region-button { min-height:48px; padding:9px 12px; } #panel-redeem .redeem-game-key .redeem-key-region-button.is-empty { grid-template-rows:1fr; } #panel-redeem .redeem-game-key .redeem-key-region-button.is-empty .redeem-key-region-placeholder { align-self:center; } #panel-redeem .redeem-game-key .redeem-key-region-button.is-empty .redeem-key-region-chevron { grid-row:1; align-self:center; } #panel-redeem .redeem-key-region-name { font-size:13px; font-weight:650; } #panel-redeem .redeem-key-region-button small { font-size:11px; line-height:1.35; } #panel-redeem .redeem-actions { padding-top:20px; } #panel-redeem .redeem-actions #redeem-submit { min-height:48px; padding:10px 22px; font-size:14px; } #panel-redeem .redeem-region-list { right:0; bottom:calc(100% + 8px); width:min(490px,calc(100vw - 24px)); max-height:min(550px,70vh); padding:9px; border-radius:16px; box-shadow:0 22px 60px rgba(0,0,0,.42); } #panel-redeem .redeem-region-list button, .redeem-key-region-menu button { grid-template-columns:9px 28px minmax(0,1fr); min-height:58px; column-gap:12px; padding:10px 12px; border-radius:10px; } #panel-redeem .redeem-region-list button { font-size:14px; } #panel-redeem .redeem-region-list button small, .redeem-key-region-menu small { font-size:11px; line-height:1.4; } #panel-redeem .redeem-region-option-flag, .redeem-key-region-menu .redeem-key-region-flag { font-size:21px; } #panel-redeem .redeem-region-state--mismatch, #panel-redeem .redeem-region-state--unverified, .redeem-key-region-dot--mismatch, .redeem-key-region-dot--unverified { background:#ffb84d; box-shadow:0 0 0 3px rgba(255,184,77,.13); opacity:1; } #panel-redeem .redeem-region-search, .redeem-key-region-menu .redeem-region-search { position:sticky; top:-9px; z-index:1; min-height:46px; margin-bottom:7px; padding:11px 13px; border-radius:10px; font-size:13px; } #panel-redeem .redeem-region-group, .redeem-key-region-menu .redeem-region-group { padding:13px 12px 7px; font-size:11px; } .redeem-key-region-menu { padding:9px; border-radius:16px; box-shadow:0 22px 60px rgba(0,0,0,.42); } .redeem-key-region-menu button { font-size:14px; } #panel-redeem .redeem-servers { width:min(1300px,100%); gap:17px; padding:25px; border-radius:20px; } #panel-redeem .redeem-tasks-heading h2, #panel-redeem .redeem-history-heading h2 { font-size:25px; letter-spacing:-.035em; } #panel-redeem .redeem-job { padding:22px 24px; border-radius:18px; } #panel-redeem .redeem-task-progress { padding:21px 23px; border-radius:16px; } #panel-redeem .redeem-task-current { font-size:13px; } #panel-redeem .redeem-task-updates p { font-size:12px; } #panel-redeem .redeem-job-proof a { cursor:zoom-in; } #panel-redeem .redeem-job--has-proof .redeem-job-proof img { object-fit:contain; background:var(--surface2); } #panel-redeem .redeem-job--has-proof:has(> .redeem-job-failure) .redeem-job-failure, #panel-redeem .redeem-job--has-proof:has(> .redeem-job-confirmation) .redeem-job-confirmation { grid-column:1/-1; grid-row:2; align-self:start; margin:0 0 14px; } #panel-redeem .redeem-job--has-proof:has(> .redeem-job-failure) .redeem-job-proof, #panel-redeem .redeem-job--has-proof:has(> .redeem-job-confirmation) .redeem-job-proof { grid-row:3; } #panel-redeem .redeem-job--has-proof:has(> .redeem-job-failure) .redeem-delivery, #panel-redeem .redeem-job--has-proof:has(> .redeem-job-confirmation) .redeem-delivery { grid-row:3; } #panel-redeem .redeem-job--has-proof:has(> .redeem-job-failure) .redeem-job-details, #panel-redeem .redeem-job--has-proof:has(> .redeem-job-confirmation) .redeem-job-details { grid-row:4; } #panel-redeem .redeem-job--has-proof:not(:has(> .redeem-delivery)) .redeem-job-proof { grid-column:1/-1; } #panel-redeem .redeem-job--has-proof:not(:has(> .redeem-delivery)) .redeem-job-proof a { max-width:none; } #panel-redeem .redeem-job--manual-activation .redeem-job-proof { justify-items:stretch; } #panel-redeem .redeem-job-proof img { width:100%; height:auto; max-height:none; object-fit:fill; } #panel-redeem .redeem-job-proof a.is-pending { display:grid; place-items:center; min-height:180px; cursor:pointer; } #panel-redeem .redeem-job-proof a.is-pending::after { content:'Загрузить снимок'; padding:10px 15px; border:1px solid var(--border); border-radius:10px; background:var(--surface); color:var(--text); font-size:13px; font-weight:650; line-height:1.3; } #panel-redeem .redeem-history-sentinel { padding:17px; color:var(--text2); font-size:12px; text-align:center; } #panel-redeem .redeem-event-image-load { grid-column:2; justify-self:start; min-width:max-content; max-width:100%; min-height:34px; padding:7px 10px; border:1px solid var(--border); border-radius:9px; background:var(--surface); color:var(--accent); font-size:11px; line-height:1.2; white-space:nowrap; overflow-wrap:normal; cursor:pointer; } #panel-redeem .redeem-job-origin { display:inline-flex; align-items:center; padding:3px 7px; border:1px solid var(--border); border-radius:6px; color:var(--text2); font-size:10px; font-weight:650; } #panel-redeem .redeem-manual-timeline-note { margin:0 0 10px; color:var(--text2); font-size:12px; line-height:1.45; } #panel-redeem .redeem-job-failure, #panel-redeem .redeem-job-confirmation { max-width:100%; font-size:12px; line-height:1.5; } #panel-redeem .redeem-job-failure { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; } #panel-redeem .redeem-job-proof img[hidden], #panel-redeem .redeem-success-preview img[hidden] { display:none !important; } #panel-redeem .redeem-job-proof a[aria-busy="true"] { min-height:160px; background:linear-gradient(110deg,var(--surface2),var(--surface3,var(--border)),var(--surface2)); } #panel-redeem .redeem-server-overview { padding:15px 17px; border-radius:13px; } #panel-redeem .redeem-server-overview strong { font-size:14px; } #panel-redeem .redeem-server-filters { gap:9px; } #panel-redeem .redeem-server-filters button { min-height:38px; padding:8px 14px; border-radius:10px; font-size:12px; } #panel-redeem .redeem-provider-summary { gap:8px; } #panel-redeem .redeem-provider-chip { min-height:30px; padding:5px 10px; border-radius:9px; font-size:11px; } #panel-redeem .redeem-provider-chip b { font-size:11px; } #panel-redeem .redeem-servers-list { grid-template-columns:repeat(auto-fit,minmax(min(100%,285px),1fr)); gap:12px; } #panel-redeem .redeem-server-card { min-height:116px; padding:14px; border-radius:14px; } #panel-redeem .redeem-server-details strong { font-size:13px; } #panel-redeem .redeem-server-meta { font-size:10px; } #panel-redeem .redeem-server-card--review { border-color:rgba(255,184,77,.4); } #panel-redeem .redeem-server-card--slow .redeem-server-indicator { color:#ffbc65; } #panel-redeem .redeem-server-site-check { color:var(--text2); font-size:11px; line-height:1.4; overflow-wrap:anywhere; } #panel-redeem .redeem-server-duplicate { color:#ffbc65; font-size:11px; line-height:1.4; } #panel-redeem .redeem-server-help { padding:0 2px; color:var(--text2); font-size:12px; line-height:1.5; } #panel-redeem .redeem-server-help summary { width:fit-content; color:var(--accent); cursor:pointer; } #panel-redeem .redeem-server-help p { max-width:75ch; margin:8px 0 0; } #panel-redeem .redeem-proof-dialog { position:fixed; width:min(84vw,880px); max-width:calc(100vw - 32px); max-height:86vh; max-height:86dvh; margin:auto; padding:0; overflow:hidden; border:1px solid var(--border); border-radius:12px; background:var(--surface); color:var(--text); box-shadow:0 18px 60px rgba(0,0,0,.35); } #panel-redeem .redeem-proof-dialog::backdrop { background:rgba(0,0,0,.60); } #panel-redeem .redeem-proof-dialog-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 14px; border-bottom:1px solid var(--border); } #panel-redeem .redeem-proof-dialog-head > div:first-child { display:grid; gap:3px; } #panel-redeem .redeem-proof-dialog-head strong { font-size:14px; } #panel-redeem .redeem-proof-dialog-head span { color:var(--text2); font-size:11px; } #panel-redeem .redeem-proof-dialog-actions { display:flex; gap:8px; } #panel-redeem .redeem-proof-dialog-actions button { min-height:34px; padding:6px 11px; border:1px solid var(--border); border-radius:9px; background:var(--surface2); color:var(--text); font-size:12px; white-space:nowrap; } #panel-redeem .redeem-proof-dialog-stage { display:flex; align-items:center; justify-content:center; padding:8px; max-height:calc(86vh - 76px); max-height:calc(86dvh - 76px); overflow:auto; background:var(--bg,var(--surface)); } #panel-redeem .redeem-proof-dialog img { display:block; width:auto; height:auto; max-width:100%; max-height:calc(86vh - 94px); max-height:calc(86dvh - 94px); object-fit:contain; border-radius:3px; } #panel-redeem .redeem-proof-dialog.is-zoomed .redeem-proof-dialog-stage { display:block; } #panel-redeem .redeem-proof-dialog.is-zoomed img { max-width:none; max-height:none; } #panel-redeem .redeem-proof-dialog-stage-note { margin:0; padding:42px 16px; color:var(--text2); font-size:13px; text-align:center; } #panel-redeem .redeem-proof-dialog [hidden] { display:none!important; } #panel-redeem .redeem-history-delete-actions { display:flex; align-items:center; gap:6px; } #panel-redeem .redeem-history-delete,#panel-redeem .redeem-history-delete-cancel { min-height:29px; padding:5px 9px; border:1px solid var(--border); border-radius:8px; background:transparent; color:var(--text2); font-size:11px; box-shadow:none; } #panel-redeem .redeem-history-delete:hover { border-color:#c05a5a; color:#ef8f8f; } #panel-redeem .redeem-history-delete[data-confirm="true"] { border-color:#c05a5a; background:rgba(190,60,60,.12); color:#ffaaaa; } #panel-redeem .redeem-history-delete-cancel[hidden] { display:none; } #panel-redeem .redeem-job-badge--expired { background:rgba(255,179,64,.12); color:#ffbc65; } #panel-redeem .redeem-job--expired .redeem-job-failure { border-color:rgba(255,179,64,.22); background:rgba(255,179,64,.07); color:#ffbc65; } #panel-redeem .redeem-retry-before-key { align-self:flex-start; min-height:34px; margin:0 0 14px; padding:7px 13px; border:1px solid rgba(10,132,255,.38); border-radius:9px; background:rgba(10,132,255,.12); color:#76b9ff; font-size:12px; font-weight:700; cursor:pointer; } #panel-redeem .redeem-retry-before-key:hover { background:rgba(10,132,255,.2); } @media(max-width:650px) { #panel-redeem .redeem-proof-dialog { width:calc(100vw - 24px); max-width:calc(100vw - 24px); } #panel-redeem .redeem-proof-dialog-head { flex-wrap:wrap; gap:8px; padding:10px; } #panel-redeem .redeem-proof-dialog-head strong { font-size:13px; } #panel-redeem .redeem-proof-dialog-actions { margin-left:auto; gap:6px; } #panel-redeem .redeem-proof-dialog-stage { max-height:calc(86dvh - 116px); padding:5px; } #panel-redeem .redeem-proof-dialog img { max-height:calc(86dvh - 128px); } } @media(pointer:coarse) { #panel-redeem .redeem-proof-dialog-actions button { min-height:44px; } } @media(max-width:1100px) { #panel-redeem.active { display:flex; flex-direction:column; } #panel-redeem .redeem-overview { padding:22px; } #panel-redeem .redeem-composer { padding:24px; } } @media(max-width:768px) { #panel-redeem .redeem-overview { padding:17px; } #panel-redeem .redeem-overview-intro { display:none; } #panel-redeem .redeem-composer { padding:18px; } #panel-redeem .redeem-game-key { grid-template-columns:minmax(0,1fr) 48px; } #panel-redeem .redeem-game-key:only-child { grid-template-columns:minmax(0,1fr); } #panel-redeem .redeem-game-key-number { grid-column:1; grid-row:1; padding-top:0; } #panel-redeem .redeem-game-key input { grid-column:1/-1; grid-row:2; } #panel-redeem .redeem-game-key .redeem-key-region-button { grid-column:1/-1; grid-row:3; } #panel-redeem .redeem-game-key .redeem-key-remove { grid-column:2; grid-row:1; } #panel-redeem .redeem-job--has-proof:has(> .redeem-job-failure) .redeem-delivery, #panel-redeem .redeem-job--has-proof:has(> .redeem-job-confirmation) .redeem-delivery { grid-row:4; } #panel-redeem .redeem-job--has-proof:has(> .redeem-job-failure) .redeem-job-details, #panel-redeem .redeem-job--has-proof:has(> .redeem-job-confirmation) .redeem-job-details { grid-row:5; } #panel-redeem .redeem-region-list { position:fixed; left:8px; right:8px; bottom:8px; width:auto; max-height:min(70vh,570px); } #panel-redeem .redeem-servers { padding:16px; } #panel-redeem .redeem-job { padding:16px; } #panel-redeem .redeem-task-progress { padding:16px; } #panel-redeem .redeem-servers-head { align-items:flex-start; flex-direction:column; } #panel-redeem .redeem-servers-refresh-actions { width:100%; justify-content:flex-start; } } /* Shared visual language across the form, running tasks, server checks, and history. */ #panel-redeem .redeem-overview, #panel-redeem .redeem-composer, #panel-redeem .redeem-servers, #panel-redeem .redeem-job { border:1px solid var(--border); border-radius:18px; background:var(--surface); box-shadow:0 12px 36px rgba(0,0,0,.09); } #panel-redeem .redeem-overview, #panel-redeem .redeem-composer { border-radius:20px; } #panel-redeem .redeem-status-panel, #panel-redeem .redeem-task-progress, #panel-redeem .redeem-server-overview { border:1px solid var(--border); border-radius:14px; background:var(--surface2); } #panel-redeem .redeem-task-progress { border-color:rgba(var(--accent-rgb),.24); background:rgba(var(--accent-rgb),.055); } #panel-redeem .redeem-tasks-heading, #panel-redeem .redeem-history-heading { align-items:baseline; margin:6px 0 15px; } #panel-redeem .redeem-tasks-heading h2, #panel-redeem .redeem-history-heading h2 { font-size:26px; line-height:1.15; letter-spacing:-.04em; } #panel-redeem .redeem-job-details summary { min-height:34px; } #panel-redeem .redeem-server-card { border-color:var(--border); background:var(--surface2); transition:border-color .15s ease, transform .15s ease; } #panel-redeem .redeem-server-card--exit-match { border-color:rgba(46,204,113,.26); } #panel-redeem .redeem-server-card--review { border-color:rgba(255,184,77,.4); } #panel-redeem .redeem-provider-chip { background:var(--surface2); } #panel-redeem .redeem-job-proof a[aria-busy="true"]::after, #panel-redeem .redeem-success-preview a[aria-busy="true"]::after { content:'Загружаем снимок…'; } #panel-redeem .redeem-job-proof a.is-unavailable, #panel-redeem .redeem-success-preview a.is-unavailable { display:grid; place-items:center; min-height:140px; cursor:pointer; } #panel-redeem .redeem-job-proof a.is-unavailable::after, #panel-redeem .redeem-success-preview a.is-unavailable::after { content:'Повторить загрузку ↻'; } @media(max-width:600px) { #panel-redeem .panel-header { display:grid; grid-template-columns:38px minmax(0,1fr); grid-template-rows:38px 40px; gap:6px 8px; padding:8px 12px 10px; min-height:0; } #panel-redeem .panel-header > .back-btn { grid-column:1; grid-row:1; } #panel-redeem .panel-title { grid-column:2; grid-row:1; } #panel-redeem .redeem-header-tabs { grid-column:1/-1; grid-row:2; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); width:100%; min-width:0; max-width:none; margin:0; overflow:visible; } #panel-redeem .redeem-header-tabs .pill-btn { flex:auto; width:auto; min-width:0; padding:0 3px; font-size:11px; } #panel-redeem .redeem-tasks-heading h2, #panel-redeem .redeem-history-heading h2 { font-size:23px; } #panel-redeem .redeem-server-card { min-height:105px; } #panel-redeem .redeem-task-steps { overflow:visible; grid-template-columns:repeat(5,minmax(0,1fr)); padding-bottom:0; } #panel-redeem .redeem-task-steps li { min-width:0; padding:0 1px; } #panel-redeem .redeem-task-steps li > span:last-child { display:none; } #panel-redeem .redeem-task-steps li:not(:last-child)::after { left:calc(50% + 16px); right:calc(-50% + 16px); } #panel-redeem .redeem-task-step-marker { width:24px; height:24px; } .redeem-key-region-menu { border-radius:18px 18px 12px 12px; box-shadow:0 16px 50px rgba(0,0,0,.58); } } /* Keep the account details steady while switching subscription scenarios. */ #panel-redeem .redeem-recovery-slot[hidden] { display:none !important; } #panel-redeem .redeem-recovery-slot { min-height:120px; margin-top:3px; } #panel-redeem .redeem-recovery-choice { gap:7px; margin:0; } #panel-redeem .redeem-recovery-choice > label { color:var(--text); font-size:13px; font-weight:600; } #panel-redeem #redeem-recovery-button { min-height:50px; background:var(--surface2); } #panel-redeem #redeem-recovery-button:disabled { opacity:.72; cursor:default; } #panel-redeem #redeem-recovery-hint { min-height:19px; color:var(--text2); font-size:11px; line-height:1.45; } #panel-redeem .redeem-recovery-chevron { display:grid; place-items:center; width:20px; height:20px; } #panel-redeem .redeem-recovery-chevron svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; transition:transform .16s ease; } #panel-redeem #redeem-recovery-button[aria-expanded="true"] .redeem-recovery-chevron svg { transform:rotate(180deg); } #panel-redeem .redeem-recovery-list { left:auto; right:0; width:min(100%,520px); max-height:min(352px,60vh); gap:2px; padding:7px; border-color:rgba(255,255,255,.13); border-radius:15px; background:var(--surface); box-shadow:0 20px 48px rgba(0,0,0,.42); box-sizing:border-box; } #panel-redeem .redeem-recovery-list-heading { display:grid; gap:2px; padding:8px 10px 9px; } #panel-redeem .redeem-recovery-list-heading strong { color:var(--text); font-size:12px; font-weight:700; } #panel-redeem .redeem-recovery-list-heading small { color:var(--text2); font-size:10px; line-height:1.3; } #panel-redeem .redeem-recovery-option { grid-template-columns:32px minmax(0,1fr) 18px; align-items:center; gap:9px; min-height:51px; padding:7px 9px; border-radius:10px; } #panel-redeem .redeem-recovery-option[aria-selected="true"] { border-color:rgba(var(--accent-rgb),.28); background:rgba(var(--accent-rgb),.1); } #panel-redeem .redeem-recovery-option-icon { display:grid; place-items:center; width:30px; height:30px; border:1px solid var(--border); border-radius:9px; background:var(--surface2); color:var(--text2); font-size:16px; line-height:1; } #panel-redeem .redeem-recovery-option[aria-selected="true"] .redeem-recovery-option-icon { border-color:rgba(var(--accent-rgb),.3); color:var(--accent); } #panel-redeem .redeem-recovery-option-copy { display:grid; gap:3px; min-width:0; } #panel-redeem .redeem-recovery-option-copy strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; } #panel-redeem .redeem-recovery-option-copy small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:10px; } #panel-redeem .redeem-recovery-option-check { color:var(--accent); font-size:15px; font-weight:700; text-align:center; } #panel-redeem .redeem-recovery-list-separator { height:1px; margin:4px 8px; background:var(--border); } @media (max-width:520px) { #panel-redeem .redeem-recovery-list { width:auto; max-height:min(65vh,420px); left:8px; right:8px; } } #panel-redeem #redeem-subscription-new, #panel-redeem #redeem-subscription-existing { min-height:101px; } #panel-redeem #redeem-subscription-route { min-height:34px; } /* Stock activation is its own workflow, with inventory management secondary. */ #panel-redeem .redeem-kind-switch { width:100%; grid-template-columns:repeat(3,minmax(0,1fr)); } #panel-redeem #redeem-form[hidden], #panel-redeem:has([data-redeem-kind="stock"].active) #redeem-form, #panel-redeem .redeem-stock-workspace[hidden], #panel-redeem .redeem-stock-manage[hidden] { display:none !important; } #panel-redeem .redeem-stock-workspace { display:grid; gap:26px; } #panel-redeem .redeem-stock-intro-row { display:flex; align-items:start; justify-content:space-between; gap:15px; } #panel-redeem .redeem-stock-lead { margin:0; max-width:54ch; color:var(--text2); font-size:13px; line-height:1.55; } #panel-redeem #redeem-stock-manage-jump { flex:none; min-height:34px; padding:7px 10px; border:1px solid var(--border); border-radius:9px; background:var(--surface2); color:var(--text); font-size:11px; box-shadow:none; } #panel-redeem #redeem-stock-manage-jump:hover { border-color:var(--accent); } #panel-redeem .redeem-stock-balance { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; } #panel-redeem .redeem-stock-balance > div { display:grid; gap:3px; min-width:0; padding:14px 15px; border:1px solid var(--border); border-radius:14px; background:var(--surface2); } #panel-redeem .redeem-stock-balance span { color:var(--text2); font-size:11px; } #panel-redeem .redeem-stock-balance strong { color:var(--text); font-size:27px; font-weight:680; line-height:1.1; font-variant-numeric:tabular-nums; } #panel-redeem .redeem-stock-balance small { color:var(--text2); font-size:10px; } #panel-redeem .redeem-stock-step { display:grid; gap:13px; padding-top:22px; border-top:1px solid var(--border); } #panel-redeem .redeem-stock-step .redeem-form-section-heading { margin:0 0 3px; } #panel-redeem .redeem-stock-field-label { margin-bottom:-7px; color:var(--text2); font-size:12px; } #panel-redeem .redeem-stock-term-switch { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:4px; padding:4px; border:1px solid var(--border); border-radius:12px; background:var(--surface2); } #panel-redeem .redeem-stock-term-switch button { min-height:38px; padding:7px 4px; border-radius:9px; background:transparent; color:var(--text2); font-size:12px; box-shadow:none; } #panel-redeem .redeem-stock-term-switch button.active { background:var(--accent); color:#fff; } #panel-redeem .redeem-stock-term-help { margin:-4px 0 0; color:var(--text2); font-size:11px; line-height:1.45; } #panel-redeem #redeem-stock-recovery-anchor { min-width:0; } #panel-redeem #redeem-stock-recovery-anchor .redeem-recovery-slot { min-height:0; margin-top:0; } #panel-redeem .redeem-stock-recurring { margin:0; color:var(--text2); } #panel-redeem .redeem-stock-preview { display:grid; gap:7px; min-height:100px; padding:16px 18px; border:1px solid var(--border); border-radius:14px; background:var(--surface2); } #panel-redeem .redeem-stock-preview.is-ready { border-color:rgba(46,204,113,.35); background:rgba(46,204,113,.055); } #panel-redeem .redeem-stock-preview strong { color:var(--green); font-size:13px; } #panel-redeem .redeem-stock-preview p { margin:0; color:var(--text); font-size:12px; line-height:1.5; overflow-wrap:anywhere; } #panel-redeem .redeem-stock-preview:not(.is-ready) p { color:var(--text2); } #panel-redeem .redeem-stock-preview small { color:var(--amber,#e8af53); font-size:11px; } #panel-redeem #redeem-stock-activate { justify-self:start; min-height:44px; padding:10px 17px; font-size:13px; } #panel-redeem #redeem-stock-activate:disabled { opacity:.5; cursor:not-allowed; } #panel-redeem #redeem-inventory-error { margin:0; } #panel-redeem .redeem-stock-run-note { margin:0; color:var(--text2); font-size:11px; line-height:1.45; } #panel-redeem .redeem-stock-manage { border:1px solid var(--border); border-radius:15px; background:var(--surface2); } #panel-redeem .redeem-stock-manage > summary { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:17px 18px; cursor:pointer; list-style:none; } #panel-redeem .redeem-stock-manage > summary::-webkit-details-marker { display:none; } #panel-redeem .redeem-stock-manage > summary > span:first-child { display:grid; gap:4px; } #panel-redeem .redeem-stock-manage > summary strong { color:var(--text); font-size:13px; } #panel-redeem .redeem-stock-manage > summary small { color:var(--text2); font-size:11px; } #panel-redeem .redeem-stock-manage-chevron { color:var(--text2); font-size:20px; line-height:1; transition:transform .16s ease; } #panel-redeem .redeem-stock-manage[open] .redeem-stock-manage-chevron { transform:rotate(180deg); } #panel-redeem .redeem-stock-manage-body { padding:0 18px 18px; } #panel-redeem .redeem-stock-manage-body .redeem-inventory-grid { grid-template-columns:1fr; gap:10px; padding:0; } #panel-redeem .redeem-stock-manage-body .redeem-inventory-block { padding:15px; border-radius:12px; background:var(--surface); } #panel-redeem .redeem-stock-manage-body .redeem-inventory-block textarea { min-height:88px; font-size:13px; } #panel-redeem .redeem-stock-manage-body .redeem-inventory-block > button { min-height:38px; padding:8px 12px; font-size:12px; } #panel-redeem .redeem-stock-manage-body .redeem-inventory-block > button:disabled { opacity:.48; cursor:not-allowed; } #panel-redeem #redeem-stock-manage-feedback { margin:10px 0 0; color:var(--text2); font-size:12px; } #panel-redeem .redeem-stock-manage-body .redeem-inventory-list { grid-template-columns:1fr; gap:10px; margin-top:15px; padding:0; } #panel-redeem .redeem-stock-secondary-list { display:grid; gap:8px; padding:0 18px 18px; } #panel-redeem .redeem-stock-secondary-list > p { margin:0; padding:12px 0 0; color:var(--text2); font-size:12px; } #panel-redeem .redeem-stock-archive-item { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:5px 12px; align-items:center; padding:12px 13px; border:1px solid var(--border); border-radius:10px; background:var(--surface); } #panel-redeem .redeem-stock-archive-item strong { min-width:0; color:var(--text); font-size:12px; overflow-wrap:anywhere; } #panel-redeem .redeem-stock-archive-item span,#panel-redeem .redeem-stock-archive-item small { grid-column:1; color:var(--text2); font-size:11px; overflow-wrap:anywhere; } #panel-redeem .redeem-stock-archive-item button { grid-column:2; grid-row:1/4; min-height:32px; padding:6px 9px; border:1px solid var(--border); border-radius:8px; background:var(--surface2); color:var(--text); font-size:11px; box-shadow:none; } @media(max-width:650px) { #panel-redeem .redeem-kind-switch button { padding:6px 4px; font-size:11px; } #panel-redeem .redeem-stock-intro-row { flex-wrap:wrap; } #panel-redeem .redeem-stock-balance { gap:6px; } #panel-redeem .redeem-stock-balance > div { padding:10px; } #panel-redeem .redeem-stock-balance strong { font-size:22px; } #panel-redeem .redeem-stock-term-switch { grid-template-columns:repeat(3,minmax(0,1fr)); } #panel-redeem .redeem-stock-manage-body .redeem-inventory-grid, #panel-redeem .redeem-stock-manage-body .redeem-inventory-list { grid-template-columns:1fr; } #panel-redeem .redeem-stock-archive-item { grid-template-columns:1fr; } #panel-redeem .redeem-stock-archive-item button { grid-column:1; grid-row:auto; justify-self:start; } } #panel-redeem .redeem-login-route { display:grid; gap:7px; margin-top:16px; color:var(--text); font-size:13px; font-weight:600; } #panel-redeem .redeem-login-route select { width:100%; min-height:46px; padding:0 14px; color:var(--text); background:var(--surface); border:1px solid var(--border); border-radius:12px; font:inherit; } #panel-redeem .redeem-login-route input { width:100%; min-height:46px; padding:0 14px; color:var(--text); background:var(--surface); border:1px solid var(--border); border-radius:12px; font:inherit; } #panel-redeem .redeem-login-route small { color:var(--text2); font-size:11px; font-weight:400; } #panel-redeem .redeem-login-route[hidden] { display:none; } /* Keep the response controls in one task surface, without nested dialogs. */ #panel-redeem #redeem-tasks-feed #redeem-answer-form { background: var(--surface); box-shadow: none; border: 1px solid var(--border); border-radius: 12px; padding: 18px; margin: 16px 0; } #panel-redeem .redeem-prompt-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-top:8px} #panel-redeem #redeem-prompt-label{font-size:14px;line-height:1.5;overflow-wrap:anywhere} #panel-redeem .redeem-answer-help{color:var(--text2);font-size:12px;line-height:1.5;margin:8px 0 16px} #panel-redeem .redeem-answer-row{gap:10px;align-items:stretch} #panel-redeem #redeem-answer{min-height:46px;min-width:0} #panel-redeem #redeem-answer-form[data-prompt-kind="REQUEST_CODE"] #redeem-answer{font-size:20px;letter-spacing:.15em;font-variant-numeric:tabular-nums} #panel-redeem #redeem-answer-form button[type="submit"]{min-height:46px;padding:10px 18px;white-space:nowrap;border-radius:10px;transition:filter .15s,transform .15s} #panel-redeem #redeem-answer-form button[type="submit"]:active{transform:scale(.98)} #panel-redeem #redeem-copy-hidden-email-request{flex-shrink:0;min-height:32px} @media(max-width:600px){#panel-redeem .redeem-prompt-heading{flex-direction:column;gap:8px}#panel-redeem .redeem-answer-row{flex-wrap:wrap}#panel-redeem .redeem-answer-row>input,#panel-redeem .redeem-answer-row>button[type="submit"]{width:100%;flex-basis:100%}} @media(prefers-reduced-motion:reduce){#panel-redeem #redeem-answer-form button[type="submit"]{transition:none}} #panel-redeem .redeem-task-progress { box-shadow: none; } @media (max-width: 1100px) { #panel-redeem.active { overscroll-behavior-y: auto; touch-action: pan-y; } #panel-redeem .redeem-task-progress, #panel-redeem .redeem-job-details { max-height: none; overflow: visible; } } #panel-redeem #redeem-answer::placeholder{font-size:14px;letter-spacing:normal;font-weight:400;} /* Explicit human receipts and recovery guidance share the existing form controls. */ .redeem-manual-confirm-dialog { width:min(560px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); overflow:auto; } .redeem-manual-confirm-dialog h2 { margin:0; } .redeem-manual-confirm-choices { display:grid; gap:10px; padding:14px; border:1px solid var(--border); border-radius:12px; background:var(--surface2); } .redeem-manual-confirm-dialog .inbox-checkbox { display:flex; align-items:flex-start; gap:10px; line-height:1.5; } .redeem-manual-confirm-dialog .inbox-checkbox input { flex:0 0 auto; width:18px; height:18px; margin:2px 0 0; } .redeem-manual-confirm-actions,.redeem-recovery-advice-actions { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:10px; } #panel-redeem .redeem-recovery-advice-actions { justify-content:flex-start; } #panel-redeem .redeem-recovery-advice-actions a { color:var(--accent); font-size:12px; } @media(max-width:600px) { .redeem-manual-confirm-dialog { padding:20px; } .redeem-manual-confirm-actions button { flex:1 1 auto; } } .redeem-manual-confirm-dialog textarea { box-sizing:border-box; width:100%; min-height:88px; resize:vertical; padding:11px 12px; border:1px solid var(--border); border-radius:10px; background:var(--bg); color:var(--text); font:inherit; font-size:13px; line-height:1.5; } .redeem-manual-confirm-dialog textarea:focus-visible { outline:2px solid var(--accent); outline-offset:2px; } /* A stock-owner exception belongs to one explicit launch, with the owner kept visible. */ #panel-redeem .redeem-stock-owner-confirmation { display:grid; gap:10px; margin-top:18px; padding:16px; border:1px solid var(--border); border-radius:14px; background:var(--surface2); min-width:0; } #panel-redeem .redeem-stock-owner-confirmation[hidden] { display:none; } #panel-redeem .redeem-stock-owner-confirmation>strong { font-size:14px; line-height:1.45; overflow-wrap:anywhere; } #panel-redeem .redeem-stock-owner-confirmation p { margin:0; color:var(--text2); font-size:12px; line-height:1.5; overflow-wrap:anywhere; } #panel-redeem .redeem-stock-owner-confirmation .redeem-stock-owner-key-ends { color:var(--text); font-variant-numeric:tabular-nums; } .layout-transfer #panel-redeem .redeem-stock-owner-consent { display:flex; flex-direction:row; align-items:flex-start; gap:10px; padding-top:3px; color:var(--text); font-size:13px; line-height:1.5; cursor:pointer; } .layout-transfer #panel-redeem .redeem-stock-owner-consent input[type=checkbox] { flex:0 0 20px; box-sizing:border-box; width:20px; height:20px; min-width:20px; max-width:20px; min-height:20px; max-height:20px; margin:1px 0 0; padding:0; border-radius:6px; accent-color:var(--accent); } #panel-redeem .redeem-stock-owner-consent span { min-width:0; overflow-wrap:anywhere; } #panel-redeem .redeem-stock-owner-confirmation-footer { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; } #panel-redeem .redeem-stock-owner-confirmation-footer small { color:var(--text2); font-size:11px; line-height:1.5; } #panel-redeem .redeem-stock-owner-cancel { flex:0 0 auto; min-height:36px; padding:8px 13px; border:1px solid var(--border); border-radius:9px; background:transparent; color:var(--text); font-size:12px; } #panel-redeem .redeem-stock-owner-consent input:focus-visible,#panel-redeem .redeem-stock-owner-cancel:focus-visible { outline:2px solid var(--accent); outline-offset:3px; } #panel-redeem .redeem-resume-unconfirmed-note { margin:0; color:var(--text2); font-size:12px; line-height:1.5; } #panel-redeem .redeem-resume-unconfirmed { white-space:normal; text-align:center; } .layout-transfer #panel-redeem .redeem-expiry-acceptance { display:grid; gap:12px; min-width:0; padding:16px; border:1px solid var(--border); border-radius:12px; background:var(--surface2); } .layout-transfer #panel-redeem .redeem-expiry-acceptance p { margin:0; color:var(--text2); font-size:12px; line-height:1.5; } .layout-transfer #panel-redeem .redeem-expiry-acceptance-check { display:flex; flex-direction:row; align-items:flex-start; gap:10px; font-size:13px; line-height:1.5; color:var(--text); cursor:pointer; } .layout-transfer #panel-redeem .redeem-expiry-acceptance-check input[type=checkbox] { flex:0 0 20px; width:20px; height:20px; min-width:20px; max-width:20px; min-height:20px; max-height:20px; margin:1px 0 0; padding:0; border-radius:6px; } .layout-transfer #panel-redeem .redeem-expiry-acceptance-check input[type=checkbox]:checked { border-color:var(--accent); background-color:var(--accent); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m4 10 4 4 8-8' fill='none' stroke='%23132235' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-position:center; background-repeat:no-repeat; background-size:16px; } .layout-transfer #panel-redeem .redeem-expiry-acceptance button { justify-self:start; max-width:100%; white-space:normal; } .layout-transfer #panel-redeem .redeem-expiry-acceptance button[type=submit] { min-height:40px; padding:10px 14px; border-color:var(--accent); background:var(--accent); color:#132235; font-weight:650; } .layout-transfer #panel-redeem .redeem-expiry-acceptance button[type=submit]:disabled { opacity:.45; cursor:not-allowed; } .layout-transfer #panel-redeem .redeem-expiry-acceptance [hidden] { display:none; }