#panel-code-checker .checker-body { overflow:auto; padding:24px; background:var(--bg); }
#panel-code-checker .checker-layout { width:min(100%,1440px); margin:0 auto; display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); align-items:start; gap:20px; }
#panel-code-checker .checker-card { min-width:0; padding:24px; border:1px solid var(--border); border-radius:18px; background:var(--surface); box-sizing:border-box; }
#panel-code-checker h2 { margin:6px 0 8px; color:var(--text); font-size:22px; line-height:1.2; letter-spacing:-.03em; }
#panel-code-checker p { margin:0; }
#panel-code-checker .checker-heading p { color:var(--text2); font-size:13px; line-height:1.5; }
#panel-code-checker .checker-eyebrow { color:var(--text2); font-size:10px; font-weight:750; letter-spacing:.09em; }
#panel-code-checker .checker-section-title { display:grid; grid-template-columns:24px 1fr; gap:2px 9px; align-items:center; margin:25px 0 12px; }
#panel-code-checker .checker-section-title > span { grid-row:span 2; display:grid; place-items:center; width:24px; height:24px; border-radius:8px; background:rgba(10,132,255,.16); color:var(--accent); font-size:12px; font-weight:750; }
#panel-code-checker .checker-section-title strong { color:var(--text); font-size:15px; }
#panel-code-checker .checker-section-title small { color:var(--text2); font-size:11px; }
#panel-code-checker .checker-saved-wlids { display:grid; gap:8px; }
#panel-code-checker .checker-empty { padding:15px; border:1px dashed var(--border); border-radius:12px; color:var(--text2); font-size:12px; }
#panel-code-checker .checker-saved-row { display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:54px; padding:8px 12px; border:1px solid var(--border); border-radius:12px; background:var(--surface2); }
#panel-code-checker .checker-saved-row:has(input:checked) { border-color:rgba(10,132,255,.55); background:rgba(10,132,255,.07); }
#panel-code-checker .checker-saved-row label { display:flex; align-items:center; gap:11px; flex:1; min-width:0; cursor:pointer; }
#panel-code-checker .checker-saved-row input[type=checkbox] { width:17px; height:17px; flex:none; accent-color:var(--accent); }
#panel-code-checker .checker-saved-row label span { display:grid; gap:3px; min-width:0; }
#panel-code-checker .checker-saved-row strong { font-size:13px; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#panel-code-checker .checker-saved-row small { color:var(--text2); font:11px ui-monospace,SFMono-Regular,Menlo,monospace; }
#panel-code-checker .checker-saved-remove { padding:7px 8px; border:0; background:none; color:var(--text2); font-size:11px; cursor:pointer; }
#panel-code-checker .checker-save-wlid { display:grid; grid-template-columns:minmax(0,.55fr) minmax(0,1.45fr) auto; gap:8px; align-items:end; margin-top:12px; }
#panel-code-checker .checker-save-wlid label,#panel-code-checker .checker-bulk label { display:grid; gap:5px; min-width:0; color:var(--text2); font-size:11px; }
#panel-code-checker .checker-save-wlid .checker-add { margin:0; height:42px; white-space:nowrap; }
#panel-code-checker .checker-bulk { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.75fr); gap:8px; align-items:end; margin-bottom:12px; }
#panel-code-checker .checker-bulk textarea { width:100%; min-height:96px; resize:vertical; padding:11px 12px; border:1px solid var(--border); border-radius:10px; background:var(--surface2); color:var(--text); font:13px ui-monospace,SFMono-Regular,Menlo,monospace; box-sizing:border-box; }
#panel-code-checker .checker-bulk textarea:focus { outline:2px solid rgba(10,132,255,.5); outline-offset:1px; }
#panel-code-checker .checker-bulk .checker-add { grid-column:1/-1; justify-self:start; margin:0; }
#panel-code-checker .checker-secondary-add { margin-top:12px; }
#panel-code-checker .checker-rows { display:grid; gap:9px; }
#panel-code-checker .checker-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr) 34px; gap:8px; align-items:end; }
#panel-code-checker .checker-row--wlid { grid-template-columns:minmax(0,1fr) 34px; }
#panel-code-checker .checker-row--code { grid-template-columns:minmax(0,1.3fr) minmax(0,.8fr) 34px; }
#panel-code-checker .checker-row label { min-width:0; display:grid; gap:5px; color:var(--text2); font-size:11px; }
#panel-code-checker :is(input,select) { width:100%; min-width:0; height:42px; padding:0 12px; border:1px solid var(--border); border-radius:10px; background:var(--surface2); color:var(--text); font:inherit; font-size:13px; box-sizing:border-box; }
#panel-code-checker :is(input,select):focus { outline:2px solid rgba(10,132,255,.5); outline-offset:1px; }
#panel-code-checker .checker-remove { width:34px; height:42px; border:1px solid var(--border); border-radius:10px; background:var(--surface2); color:var(--text2); font-size:21px; cursor:pointer; }
#panel-code-checker .checker-add { margin-top:9px; padding:9px 13px; border:1px solid var(--border); border-radius:10px; background:var(--surface2); color:var(--text); font-size:12px; font-weight:700; cursor:pointer; }
#panel-code-checker .checker-actions { display:flex; gap:9px; margin-top:25px; }
#panel-code-checker .checker-actions button,#panel-code-checker .checker-answer button { min-height:42px; padding:0 17px; border:1px solid var(--border); border-radius:10px; background:var(--surface2); color:var(--text); font-weight:700; cursor:pointer; }
#panel-code-checker .checker-actions .checker-primary,#panel-code-checker .checker-answer button { border-color:var(--accent); background:var(--accent); color:white; }
#panel-code-checker .checker-actions button:disabled { opacity:.5; cursor:default; }
#panel-code-checker .checker-error { min-height:18px; margin-top:9px; color:var(--red); font-size:12px; }
#panel-code-checker .checker-results { position:sticky; top:0; display:grid; gap:16px; }
#panel-code-checker .checker-results-head h2 { margin-bottom:0; }
#panel-code-checker .checker-live { padding:14px; border:1px solid var(--border); border-radius:11px; background:var(--surface2); color:var(--text2); font-size:12px; line-height:1.5; }
#panel-code-checker .checker-live[data-state="running"],#panel-code-checker .checker-live[data-state="waiting"] { border-color:rgba(10,132,255,.45); color:var(--text); }
#panel-code-checker .checker-answer { display:grid; gap:8px; }
#panel-code-checker .checker-answer[hidden] { display:none; }
#panel-code-checker .checker-answer label { color:var(--text); font-size:12px; font-weight:650; }
#panel-code-checker .checker-answer > div { display:flex; gap:8px; }
#panel-code-checker .checker-results-list { display:grid; gap:9px; }
#panel-code-checker .checker-result { display:grid; gap:7px; padding:12px 14px; border:1px solid var(--border); border-radius:11px; background:var(--surface2); }
#panel-code-checker .checker-result-top { display:flex; justify-content:space-between; gap:10px; align-items:center; }
#panel-code-checker .checker-result code { color:var(--text); font:650 12px ui-monospace,SFMono-Regular,Menlo,monospace; overflow-wrap:anywhere; }
#panel-code-checker .checker-result strong { font-size:11px; white-space:nowrap; }
#panel-code-checker .checker-result[data-status="available"] strong { color:var(--green); }
#panel-code-checker .checker-result[data-status="redeemed"] strong,#panel-code-checker .checker-result[data-status="invalid"] strong { color:var(--red); }
#panel-code-checker .checker-result[data-status="unsupported"] strong { color:#e5ad55; }
#panel-code-checker .checker-result p { color:var(--text2); font-size:11px; }
#panel-code-checker .checker-result small { color:var(--text2); font-size:10px; }
#panel-code-checker .checker-history { display:grid; gap:8px; }
#panel-code-checker .checker-history summary { color:var(--text); cursor:pointer; font-size:12px; font-weight:700; }
#panel-code-checker .checker-history details { padding:11px 12px; border:1px solid var(--border); border-radius:10px; }
#panel-code-checker .checker-history details > div { display:grid; gap:8px; margin-top:12px; }
@media (max-width:950px) { #panel-code-checker .checker-layout { grid-template-columns:1fr; } #panel-code-checker .checker-results { position:static; } }
@media (max-width:768px) { #panel-code-checker .checker-body { overflow:visible; padding:12px 12px 88px; } #panel-code-checker .checker-card { padding:17px; } #panel-code-checker .checker-row,#panel-code-checker .checker-row--code { grid-template-columns:minmax(0,1fr) 34px; } #panel-code-checker .checker-row label:first-child { grid-column:1; } #panel-code-checker .checker-row label:nth-child(2) { grid-column:1; } #panel-code-checker .checker-remove { grid-column:2; grid-row:1/3; align-self:stretch; height:auto; } #panel-code-checker .checker-row--wlid .checker-remove { grid-row:1; } }
@media (max-width:768px) { #panel-code-checker .checker-save-wlid,#panel-code-checker .checker-bulk { grid-template-columns:1fr; } #panel-code-checker .checker-save-wlid .checker-add,#panel-code-checker .checker-bulk .checker-add { justify-self:start; grid-column:1; } }