*,:before,:after{box-sizing:border-box}[hidden]{display:none!important}body{font-family:var(--cwz-font-body,system-ui, -apple-system, sans-serif);background:var(--cwz-bg,#f2f4f7);color:var(--cwz-text,#1a1a1a);margin:0;padding:40px 20px 80px;line-height:1.6}#choiwaza-header{margin-bottom:32px}#choiwaza-footer{margin-top:48px}.page-title{font:700 22px var(--cwz-font-body,sans-serif);color:var(--cwz-text-strong,#1a1a1a);text-align:center;margin:0 0 6px}.page-lead{font:400 13px/1.7 var(--cwz-font-body,sans-serif);color:var(--cwz-text-dim,#555);text-align:center;margin:0 0 24px}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.tool-error{border:1px solid var(--cwz-danger,#d64545);background:var(--cwz-danger-bg,#fdecec);color:var(--cwz-danger,#b23434);border-radius:8px;margin:12px 0 0;padding:10px 14px;font-size:13px}.actions{flex-wrap:wrap;gap:8px;margin-top:24px;display:flex}.input-row{align-items:center;gap:10px;display:flex}.input-row .cwz-search-box{flex:1;min-width:0}.picker{border:1px solid var(--cwz-border,#ddd);background:var(--cwz-card-bg,#fff);cursor:pointer;border-radius:8px;width:52px;height:40px;padding:2px}.input-error{border:1px solid var(--cwz-danger,#d64545);background:var(--cwz-danger-bg,#fdecec);color:var(--cwz-danger,#b23434);word-break:break-word;border-radius:8px;margin:12px 0 0;padding:10px 14px;font-size:13px}.input-error:empty{display:none}.result-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin-top:24px;display:grid}.swatch{border:1px solid var(--cwz-border,#ddd);background-image:conic-gradient(var(--cwz-border,#ccc) 25%, var(--cwz-card-bg,#fff) 0 50%, var(--cwz-border,#ccc) 0 75%, var(--cwz-card-bg,#fff) 0);background-size:16px 16px;border-radius:10px;height:140px;overflow:hidden}.swatch-color{width:100%;height:100%}.swatch-note,.note{color:var(--cwz-text-dim,#555);margin:10px 0 0;font-size:12px}.output-list{flex-direction:column;gap:8px;display:flex}.output-row{align-items:center;gap:8px;display:flex}.output-label{font:700 12px var(--cwz-font-body,sans-serif);color:var(--cwz-text-dim,#555);flex:0 0 34px}.code-output{border:1px solid var(--cwz-border,#ddd);background:var(--cwz-card-bg,#fff);min-width:0;color:var(--cwz-text,#1a1a1a);font:400 13px var(--cwz-font-mono,monospace);border-radius:8px;flex:1;padding:8px 10px}.copy-btn{flex-shrink:0}@media (max-width:420px){.output-row{flex-wrap:wrap}.output-label{flex-basis:100%}}