.cleaner-main { min-width:0; max-width:1160px; margin-inline:auto; }
.cleaner-tool { min-width:0; }
.cleaner-tool [hidden] { display:none !important; }
.cleaner-tool .tool-title { margin-bottom:12px; }
.cleaner-tool .tool-lead { margin-bottom:20px; }
.cleaner-tool .cleaner-grid { display:grid; grid-template-columns:290px minmax(0,1fr); gap:24px; }
.cleaner-tool fieldset { min-width:0; border:0; }
.cleaner-tool legend,.cleaner-tool .input-heading > label { font-weight:700; margin-bottom:10px; font-size:.95rem; }
.cleaner-tool .operation-cards { display:grid; gap:6px; }
.cleaner-tool .operation-card { display:flex; gap:9px; align-items:center; padding:9px 12px; border:1px solid var(--border); border-radius:var(--radius-sm); cursor:pointer; font-size:.88rem; background:#fff; }
.cleaner-tool .operation-card:has(input:checked) { border-color:var(--primary); background:#edf8fb; color:#255e76; font-weight:700; }
.cleaner-tool input[type="radio"],.cleaner-tool input[type="checkbox"] { flex:none; width:16px; height:16px; accent-color:#287fb8; }
.cleaner-tool .option-panel { margin-top:14px; padding:12px; background:#f3f8fc; border:1px solid #d6e6ee; border-radius:var(--radius-sm); font-size:.85rem; }
.cleaner-tool .option-panel legend { float:left; width:100%; font-size:.85rem; margin-bottom:8px; }
.cleaner-tool .option-panel label { display:flex; align-items:center; gap:6px; margin:6px 0; }
.cleaner-tool .check-options { display:flex; flex-wrap:wrap; gap:0 12px; clear:both; }
.cleaner-tool .input-panel { min-width:0; scroll-margin-top:90px; }
.cleaner-tool .input-heading { display:flex; gap:8px; justify-content:space-between; align-items:center; margin-bottom:8px; }
.cleaner-tool .input-heading > label { margin:0; }
.cleaner-tool textarea,.cleaner-tool input[type="text"] { display:block; width:100%; min-width:0; max-width:100%; box-sizing:border-box; border:1px solid var(--border); border-radius:var(--radius-sm); padding:12px; color:var(--dark); background:#fff; font:16px/1.65 var(--font-mono); }
.cleaner-tool textarea { resize:vertical; min-height:240px; height:310px; }
.cleaner-tool textarea[aria-invalid="true"] { border-color:#b42318; }
.cleaner-tool button { position:static; min-height:44px; padding:9px 16px; border:1px solid var(--primary); border-radius:var(--radius-sm); background:var(--primary); color:#fff; cursor:pointer; font:inherit; font-weight:600; }
.cleaner-tool button:hover { background:var(--primary-hover); }
.cleaner-tool button.secondary { background:#fff; color:#22627a; border-color:#c7dce6; }
.cleaner-tool button.small-button { font-size:.8rem; min-height:34px; padding:5px 10px; }
.cleaner-tool button:focus-visible,.cleaner-tool input:focus-visible,.cleaner-tool textarea:focus-visible,.cleaner-tool a:focus-visible { outline:3px solid #1565c0; outline-offset:3px; }
.cleaner-tool .muted { color:#5d6b75; font-size:.8rem; line-height:1.7; }
.cleaner-tool #input-count { margin-top:8px; }
.cleaner-tool #convert-button { margin-top:16px; width:100%; }
.cleaner-tool .field-error { color:#a61919; font-size:.88rem; margin-top:10px; overflow-wrap:anywhere; }
.cleaner-tool .field-error:empty { display:none; }
.cleaner-tool .privacy-notice { font-size:.8rem; color:#526574; padding:12px; margin-top:12px; background:#f3f8fc; border-radius:var(--radius-sm); }
.cleaner-tool .result-card { margin-top:24px; padding:24px; background:#edf8fb; border:1px solid #b5dae5; border-radius:var(--radius); scroll-margin-top:90px; }
.cleaner-tool .result-card h2 { margin:0 0 12px; font-size:1.25rem; }
.cleaner-tool .result-count { margin:8px 0 14px; font-size:.9rem; font-weight:600; }
.cleaner-tool .result-card label { display:block; font-size:.85rem; margin-bottom:6px; }
.cleaner-tool .result-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:12px; }
.cleaner-tool .copy-status { min-height:1.7em; font-size:.85rem; color:#255e76; margin-top:8px; }
.cleaner-tool .content-section { margin-top:40px; min-width:0; line-height:1.8; }
.cleaner-tool .content-section h2 { font-size:1.25rem; line-height:1.5; margin:0 0 16px; }
.cleaner-tool .content-section h3 { font-size:.95rem; margin:0 0 6px; }
.cleaner-tool .content-card,.cleaner-tool .explanation-card { padding:24px; border:1px solid #d6e6ee; border-radius:var(--radius); background:#fff; box-shadow:var(--shadow-card); }
.cleaner-tool .explanation-card { background:#f3f8fc; }
.cleaner-tool .capability-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.cleaner-tool .capability-grid > div,.cleaner-tool .comparison-grid > div { min-width:0; padding:14px; border:1px solid #d6e6ee; border-radius:var(--radius-sm); background:#fff; }
.cleaner-tool .capability-grid p,.cleaner-tool .comparison-grid p { font-size:.88rem; }
.cleaner-tool .before-after,.cleaner-tool .comparison-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:16px; }
.cleaner-tool .before-after > div { min-width:0; }
.cleaner-tool .before-after span { font-size:.82rem; font-weight:700; color:#255e76; }
.cleaner-tool pre { white-space:pre-wrap; overflow-wrap:anywhere; padding:12px; margin:8px 0; background:#fff; border:1px solid #d6e6ee; border-radius:var(--radius-sm); font: .85rem/1.7 var(--font-mono); }
.cleaner-tool .faq-list { border:1px solid #d6e6ee; border-radius:var(--radius); overflow:hidden; }
.cleaner-tool .faq-list dt + dd + dt { border-top:1px solid #d6e6ee; }
.cleaner-tool .faq-question { display:flex; justify-content:space-between; gap:12px; width:100%; padding:14px 18px; color:var(--dark); background:#fff; border:0; border-radius:0; text-align:left; font-size:.93rem; }
.cleaner-tool .faq-question:hover,.cleaner-tool .faq-question[aria-expanded="true"] { background:#f0f7fb; }
.cleaner-tool .faq-question:focus-visible { outline-offset:-4px; }
.cleaner-tool .faq-indicator::before { content:'+'; }
.cleaner-tool .faq-question[aria-expanded="true"] .faq-indicator::before { content:'−'; }
.cleaner-tool .faq-answer { margin:0; padding:4px 18px 18px; background:#f0f7fb; font-size:.93rem; }
.cleaner-tool .related-tools { display:flex; flex-wrap:wrap; gap:12px; }
.cleaner-tool .related-tools a { padding:12px 16px; border:1px solid var(--border-soft); border-radius:var(--radius-sm); background:#fff; }
@media (max-width:1050px) and (min-width:769px) { .cleaner-tool .cleaner-grid { grid-template-columns:280px minmax(0,1fr); gap:16px; } }
@media (max-width:768px) {
    .cleaner-main .breadcrumb-wrapper { padding-top:0; }
    .cleaner-tool .tool-title { font-size:1.25rem; margin-bottom:10px; }
    .cleaner-tool .tool-lead { font-size:.85rem; line-height:1.6; margin-bottom:12px; }
    .cleaner-tool .cleaner-grid { grid-template-columns:minmax(0,1fr); gap:8px; }
    .cleaner-tool .operation-menu legend { margin-bottom:6px; }
    .cleaner-tool .operation-cards { grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px; }
    .cleaner-tool .operation-card { padding:3px 5px; font-size:.75rem; min-height:30px; gap:5px; }
    .cleaner-tool .option-panel { margin-top:8px; padding:8px; }
    .cleaner-tool .option-panel legend { margin-bottom:4px; }
    .cleaner-tool .check-options { gap:2px 8px; font-size:.8rem; }
    .cleaner-tool .check-options label { margin:0; }
    .cleaner-tool textarea { height:240px; min-height:180px; }
    .cleaner-tool .content-card,.cleaner-tool .explanation-card,.cleaner-tool .result-card { padding:16px; }
    .cleaner-tool .capability-grid,.cleaner-tool .comparison-grid,.cleaner-tool .before-after { grid-template-columns:minmax(0,1fr); }
    .cleaner-tool .content-section h2 { font-size:1.1rem; }
    .cleaner-tool .result-actions { flex-direction:column; }
}
