/* CDK customer workspace. Existing progress markup, motion and polling stay in redeem.js/redeem.css. */
:root { --bg:#fff; --surface:#fff; --surface-2:#f5f5f5; --line:#e3e3e3; --ink:#242424; --muted:#666; --accent:#343434; --shadow:none; font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif; }
:root[data-theme=dark] { --bg:#171717; --surface:#202020; --surface-2:#292929; --line:#414141; --ink:#ededed; --muted:#b7b7b7; --accent:#e4e4e4; }
body { padding:0 28px; display:flex; flex-direction:column; line-height:1.65; }
.redeem-header { width:100%; max-width:1060px; min-height:88px; padding:0; margin:0 auto; border-bottom:1px solid var(--line); gap:20px; position:relative; }
.redeem-brand { gap:12px; font-size:16px; letter-spacing:normal; font-weight:600; }
.redeem-brand img { flex-shrink:0; }
.redeem-brand strong { display:block; font-size:17px; line-height:1.35; font-weight:600; }
.redeem-brand small { display:block; color:var(--muted); font-size:12px; line-height:1.5; font-weight:400; margin-top:2px; }
.header-controls { gap:24px; }
.redeem-tabs { position:absolute; left:50%; transform:translateX(-50%); width:260px; padding:5px; border-radius:14px; gap:4px; }
.redeem-tabs button { width:50%; min-height:42px; border-radius:9px; font-size:14px; }
.header-help { color:var(--muted); font-size:13px; }
.theme-controls { background:transparent; border:1px solid var(--line); padding:3px; }
.theme-controls button { width:28px; height:32px; }
.theme-controls [aria-pressed=true] { background:var(--surface-2); box-shadow:none; }
.redeem-layout { display:grid; grid-template-columns:minmax(0,.36fr) minmax(0,.64fr); gap:32px 72px; width:100%; max-width:1060px; padding:0; margin:56px auto 48px; flex:1; align-content:start; }
.customer-intro { grid-column:1; grid-row:1; padding-top:24px; }
.customer-intro img { display:block; margin-bottom:26px; }
.customer-intro h1 { font-size:30px; line-height:1.4; letter-spacing:-.025em; font-weight:650; }
.customer-intro p { max-width:260px; margin-top:20px; color:var(--muted); line-height:2; font-size:14px; }
.customer-main { grid-column:2; grid-row:1 / span 2; min-width:0; }
.customer-main:focus { outline:none; }
.redeem-panel,.lookup-card { border-radius:10px; padding:30px; box-shadow:none; animation:none; }
.redeem-panel h2 { font-size:22px; font-weight:600; line-height:1.5; }
.redeem-description { margin-top:6px; font-size:13px; line-height:1.9; }
/* Keep both the three-step indicator and the result progress component's existing style. */
.redeem-steps { --bg:#f6f7f9; --surface:#fff; --surface-2:#f0f2f5; --line:#e5e7eb; --ink:#0b0e13; --muted:#6b7280; --ok:#16a34a; font-family:Inter,"PingFang SC","Microsoft YaHei",system-ui,sans-serif; }
.redeem-result { --bg:#f6f7f9; --surface:#fff; --surface-2:#f0f2f5; --line:#e5e7eb; --ink:#0b0e13; --muted:#6b7280; --accent:#65a30d; --ok:#16a34a; --warn:#a85c05; --bad:#dc2626; font-family:Inter,"PingFang SC","Microsoft YaHei",system-ui,sans-serif; line-height:1.5; }
:root[data-theme=dark] .redeem-steps,:root[data-theme=dark] .redeem-result { --bg:#0b0e13; --surface:#11151c; --surface-2:#171c24; --line:#1c222c; --ink:#e8eaf0; --muted:#8a93a6; --accent:#c6ff3d; --ok:#4ade80; --warn:#fbbf24; --bad:#fb7185; }
.redeem-panel:not(:has(.redeem-result)) .button { min-height:46px; border-radius:10px; font-size:14px; font-weight:550; box-shadow:none; }
.redeem-panel:not(:has(.redeem-result)) .button-primary { background:var(--accent); border-color:var(--accent); color:var(--bg); }
.redeem-panel:not(:has(.redeem-result)) button:disabled { opacity:1; background:var(--surface-2); border-color:var(--line); color:var(--muted); cursor:not-allowed; }
.key-label { margin-top:20px; }
.key-label>span:first-child { font-size:13px; margin-bottom:8px; }
.key-label>.key-input { display:flex; margin:0; padding:0 14px; border:1px solid #c9c9c9; border-radius:10px; background:var(--surface); }
.key-input input { height:50px; letter-spacing:normal; font:14px/1.65 -apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif; }
.key-input:focus-within,.session-input:focus,.lookup-input:focus { border-color:var(--accent); box-shadow:none; outline:2px solid var(--accent); outline-offset:2px; }
.key-label + .redeem-error + .full-width { margin-top:22px; min-height:48px; }
.session-guide { margin-top:20px; padding:20px; border-radius:10px; background:var(--surface-2); color:var(--muted); font-size:14px; line-height:1.9; }
.session-guide ol { padding-left:22px; }
.session-guide li+li { margin-top:8px; }
.session-link { color:var(--ink); }
.session-input,.lookup-input { border-color:#c9c9c9; background:var(--surface); border-radius:10px; margin-top:8px; }
.session-input { height:190px; }
#session-form>.field { margin-top:24px; font-weight:600; }
.redeem-panel:not(:has(.redeem-result)) .redeem-disclosure { background:transparent; padding:0; margin-top:18px; font-size:13px; }
.redeem-panel:not(:has(.redeem-result)) .redeem-actions { margin-top:24px; gap:12px; }
.redeem-panel:not(:has(.redeem-result)) .redeem-actions>.button { flex:1; }
.customer-help { grid-column:1; grid-row:2; padding-top:18px; margin-top:0; scroll-margin-top:24px; }
.customer-help h2 { font-size:12px; color:var(--muted); font-weight:500; margin-bottom:8px; }
.customer-help details { border-bottom:1px solid var(--line); }
.customer-help summary { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:15px 0; cursor:pointer; list-style:none; font-size:12px; }
.customer-help summary::-webkit-details-marker { display:none; }
.customer-help summary svg { width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:1.2; flex-shrink:0; }
.customer-help details[open] summary svg { transform:rotate(45deg); }
.customer-help details p { margin:0 22px 16px 0; font-size:12px; color:var(--muted); line-height:1.9; }
.customer-footer { width:100%; max-width:1060px; margin:auto auto 0; padding:22px 0; border-top:1px solid var(--line); display:flex; justify-content:space-between; gap:20px; color:var(--muted); font-size:12px; }
.redeem-environment { max-width:1060px; width:100%; }
.lookup-item-head code { white-space:normal; overflow-wrap:anywhere; }
:root[data-theme=dark] .key-label>.key-input,:root[data-theme=dark] .session-input,:root[data-theme=dark] .lookup-input { border-color:#777; }
@media(max-width:900px) { .redeem-layout { gap:28px 36px; grid-template-columns:minmax(0,.36fr) minmax(0,.64fr); } .customer-intro h1 { font-size:26px; } .redeem-tabs { width:230px; } .header-controls { gap:12px; } }
@media(max-width:700px) {
 body { padding:0 20px; }
 .redeem-header { min-height:140px; padding:16px 0 70px; gap:12px; }
 .redeem-tabs { left:0; bottom:16px; width:100%; transform:none; }
 .header-help { display:none; }
 .redeem-brand img { width:32px; height:32px; }
 .redeem-brand strong { font-size:16px; }
 .redeem-layout { display:flex; flex-direction:column; gap:28px; margin:32px auto 40px; }
 .customer-intro { padding:0; }
 .customer-intro img { width:54px; height:54px; margin-bottom:16px; }
 .customer-intro h1 { font-size:26px; }
 .customer-intro p { margin-top:10px; font-size:12px; max-width:none; }
 .customer-main { width:100%; }
 .redeem-panel,.lookup-card { padding:22px 20px; }
 .customer-help { padding-top:8px; }
 .customer-footer { flex-direction:column; gap:6px; }
 .key-input input,.session-input,.lookup-input { font-size:16px; }
 .key-input input::placeholder,.session-input::placeholder,.lookup-input::placeholder { font-size:13px; }
 .session-guide { padding:16px; font-size:13px; }
 .redeem-environment { margin-left:0; margin-right:0; }
}

.session-input-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:24px; }
.session-input-heading .field { margin:0; font-weight:600; }
.session-input-heading .field>span { margin:0; line-height:20px; }
.session-clear { flex-shrink:0; border:1px solid #cbd0d6; border-radius:8px; background:var(--surface-2); padding:6px 12px; color:var(--ink); font-family:inherit; font-size:13px; font-weight:500; line-height:20px; cursor:pointer; box-shadow:0 1px 2px rgb(0 0 0 / 4%); }
.session-clear:hover { border-color:var(--muted); }
.session-clear:focus-visible { outline:2px solid var(--ink); outline-offset:3px; }
:root[data-theme=dark] .session-clear { border-color:var(--line); }

/* Indeterminate progress: never implies a fabricated completion percentage. */
.redeem-result .orbit-motion { animation:turn 2.4s linear infinite; animation-delay:var(--orbit-delay,0s); }
.redeem-result .result-orbit[data-running="true"] { color:var(--ink); }
.redeem-result .orbit-core .orbit-label { font:600 22px/1.4 -apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif; }
.result-elapsed { margin:0 0 20px; color:var(--muted); font-size:14px; font-variant-numeric:tabular-nums; }
.result-elapsed small { display:block; margin-top:5px; font-size:11px; }
.result-query-hint,.result-wait-hint { margin-top:16px; font-size:13px; line-height:1.7; color:var(--muted); }
.result-wait-hint { padding:10px 14px; border-radius:10px; background:var(--surface-2); color:var(--warn); }
@media(prefers-reduced-motion:reduce) { .redeem-result .orbit-motion,.redeem-result .redeem-spinner { animation:none; } }

.session-guide ol { list-style:none; padding:0; counter-reset:session-step; }
.session-guide li { position:relative; padding-left:40px; counter-increment:session-step; }
.session-guide li+li { margin-top:18px; }
.session-guide li::before { content:counter(session-step); position:absolute; left:0; top:0; width:28px; height:28px; border-radius:50%; background:var(--line); color:var(--ink); text-align:center; line-height:28px; font-size:13px; font-weight:600; }
.session-guide li>span { color:var(--ink); }
.session-guide-button { display:flex; align-items:center; justify-content:center; width:250px; max-width:100%; min-height:40px; box-sizing:border-box; margin-top:8px; padding:8px 12px; border:1px solid #b9bec7; border-radius:9px; background:#fff; color:#15191e; font-size:13px; font-weight:600; line-height:1.5; text-decoration:none; text-align:center; }
.session-guide-button:hover { background:#f8f9fa; border-color:#858c96; }
.session-guide-button:focus-visible { outline:2px solid var(--ink); outline-offset:3px; }
.session-guide-hint { margin:6px 0 0; font-size:12px; line-height:1.6; color:var(--muted); }