:root{--must-color:#c0392b;--must-bg:#fdedec;--must-border:#e74c3c;--should-color:#d4880f;--should-bg:#fef9e7;--should-border:#f1c40f;--may-color:#27ae60;--may-bg:#eafaf1;--may-border:#2ecc71;--check-color:#2ecc71;--bg:#f8f9fa;--card-bg:#fff;--text:#2c3e50;--text-light:#7f8c8d;--border:#dee2e6;--shadow:0 2px 8px #00000014;--radius:10px}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;line-height:1.4}.header{color:#fff;text-align:center;z-index:100;background:linear-gradient(135deg,#2c3e50 0%,#3498db 100%);padding:.8rem 1.5rem;position:sticky;top:0;box-shadow:0 4px 12px #00000026}.header-actions{gap:.4rem;display:flex;position:absolute;top:.5rem;right:.8rem}.header-icon-button{color:#fff;cursor:pointer;background:#ffffff2e;border:1px solid #ffffff73;border-radius:999px;justify-content:center;align-items:center;width:1.9rem;height:1.9rem;text-decoration:none;transition:background .2s;display:inline-flex}.header-icon-button:hover{background:#ffffff47}.github-link svg{fill:currentColor;width:1rem;height:1rem}.header h1{margin-bottom:.15rem;font-size:1.3rem;font-weight:700}.header p{opacity:.85;font-size:.82rem}.progress-bar-container{background:#fff3;border-radius:20px;max-width:500px;height:8px;margin-top:.5rem;margin-left:auto;margin-right:auto;overflow:hidden}.progress-bar{background:var(--check-color);border-radius:20px;width:0%;height:100%;transition:width .4s}.progress-text{opacity:.9;margin-top:.25rem;font-size:.78rem;font-weight:600}.toolbar{border-bottom:1px solid var(--border);z-index:99;background:#fff;flex-wrap:wrap;justify-content:center;gap:.4rem;padding:.5rem 1rem;display:flex;position:sticky;top:0}.toolbar button{border:1px solid var(--border);color:var(--text);cursor:pointer;background:#fff;border-radius:6px;align-items:center;gap:.3rem;padding:.35rem .7rem;font-size:.76rem;font-weight:500;transition:all .2s;display:flex}.toolbar button:hover{background:#f0f0f0;border-color:#aaa}.toolbar button.danger{color:var(--must-color);border-color:var(--must-border)}.toolbar button.danger:hover{background:var(--must-bg)}.toolbar button .icon{font-size:.85rem}.col-toggle{border:1px solid var(--border);color:var(--text);background:#fff;border-radius:6px;align-items:center;gap:.3rem;padding:.2rem .6rem;font-size:.76rem;font-weight:500;display:flex}.col-toggle-label{color:var(--text-light);margin-right:.1rem}.col-toggle-option{cursor:pointer;border-radius:4px;align-items:center;gap:.2rem;padding:.15rem .35rem;transition:background .15s;display:flex}.col-toggle-option:has(input:checked){color:#2980b9;background:#e8f4fd}.col-toggle-option input[type=radio]{display:none}.container{max-width:1600px;margin:0 auto;padding:.8rem .8rem 2rem}.section-divider{column-span:all;border-bottom:2px solid var(--border);align-items:center;gap:.5rem;margin-top:.5rem;margin-bottom:.5rem;padding-bottom:.35rem;display:flex}.section-divider:first-child{margin-top:0}.cards-grid{columns:380px;column-gap:.5rem}.cards-grid.cols-1{column-count:1;column-width:auto}.cards-grid.cols-2{column-count:2;column-width:auto}.cards-grid.cols-auto{column-count:auto;column-width:380px}.section-header{border-bottom:2px solid var(--border);align-items:center;gap:.5rem;margin-bottom:.5rem;padding-bottom:.35rem;display:flex}.level-badge{letter-spacing:.5px;text-transform:uppercase;color:#fff;border-radius:20px;flex-shrink:0;margin-top:.1rem;padding:.1rem .45rem;font-size:.65rem;font-weight:700;display:none}.level-badge.must{background:var(--must-color)}.level-badge.should{background:var(--should-color)}.level-badge.may{background:var(--may-color)}.flat-mode .section-divider{display:none}.flat-mode .level-badge{display:inline-block}.section-badge{letter-spacing:.5px;text-transform:uppercase;color:#fff;border-radius:20px;flex-shrink:0;padding:.15rem .6rem;font-size:.75rem;font-weight:700;display:inline-block}.section-badge.must{background:var(--must-color)}.section-badge.should{background:var(--should-color)}.section-badge.may{background:var(--may-color)}.section-progress{color:var(--text-light);white-space:nowrap;margin-left:auto;font-size:.75rem;font-weight:600}.principle-card{background:var(--card-bg);border-radius:var(--radius);box-shadow:var(--shadow);break-inside:avoid;border-left:4px solid #0000;margin-bottom:.5rem;transition:border-color .3s,box-shadow .3s;overflow:hidden}.principle-card.must{border-left-color:var(--must-border)}.principle-card.should{border-left-color:var(--should-border)}.principle-card.may{border-left-color:var(--may-border)}.principle-card.complete{border-left-color:var(--check-color)!important}.principle-header{flex-direction:column;align-items:stretch;gap:.25rem;padding:.6rem .9rem;display:flex}.principle-header-main{align-items:flex-start;gap:.5rem;width:100%;display:flex}.principle-heading{flex:1;min-width:0}.principle-code{border-radius:4px;flex-shrink:0;margin-top:.1rem;padding:.1rem .4rem;font-size:.7rem;font-weight:700}.must .principle-code{background:var(--must-bg);color:var(--must-color)}.should .principle-code{background:var(--should-bg);color:var(--should-color)}.may .principle-code{background:var(--may-bg);color:var(--may-color)}.principle-title{flex:1;font-size:.87rem;font-weight:600}.principle-title-row{align-items:center;gap:.35rem;display:flex}.principle-description{color:var(--text-light);font-size:.76rem}.principle-examples-link{font-size:.9rem;line-height:1;text-decoration:none}.principle-examples-link:hover{filter:brightness(.9)}.principle-count{color:var(--text-light);white-space:nowrap;flex-shrink:0;margin-top:.1rem;font-size:.72rem;font-weight:600}.principle-count.done{color:var(--check-color)}.checklist{padding:0 .9rem .6rem;display:block}.check-item{border-top:1px solid #f0f0f0;align-items:flex-start;gap:.5rem;padding:.3rem 0;display:flex}.check-item:first-child{border-top:1px solid var(--border)}.check-item input[type=checkbox]{display:none}.check-item label{cursor:pointer;align-items:flex-start;gap:.5rem;width:100%;font-size:.82rem;line-height:1.4;display:flex}.check-item.checked .checkbox-custom{background:var(--check-color);border-color:var(--check-color);color:#fff;-webkit-print-color-adjust:exact;print-color-adjust:exact}.checkbox-custom{color:#0000;border:2px solid #ccc;border-radius:3px;justify-content:center;align-items:center;width:16px;min-width:16px;height:16px;margin-top:1px;font-size:.65rem;transition:all .2s;display:flex}.check-item input:checked+label .checkbox-custom{background:var(--check-color);border-color:var(--check-color);color:#fff}.check-item input:checked+label .check-text{color:var(--text-light);-webkit-text-decoration:line-through #ccc;text-decoration:line-through #ccc}.check-text{transition:color .2s}.response-ui{width:100%;display:none}#app.mode-responses .check-item>label{display:none}#app.mode-responses .response-ui{display:block}.response-row{align-items:flex-start;gap:.5rem;width:100%;display:flex}.response-row .check-text{flex:1}.response-btns{flex-shrink:0;gap:.3rem;display:flex}.response-btn{border:1px solid var(--border);cursor:pointer;color:var(--text-light);background:#fff;border-radius:4px;padding:.15rem .5rem;font-size:.75rem;font-weight:500;transition:all .15s}.response-btn:hover{background:#f5f5f5;border-color:#aaa}.response-btn.yes-btn.active{background:var(--may-bg);border-color:var(--check-color);color:var(--check-color)}.response-btn.no-btn.active{background:var(--must-bg);border-color:var(--must-border);color:var(--must-color)}.reason-input{border:1px solid var(--border);resize:vertical;width:100%;color:var(--text);background:#fafafa;border-radius:4px;min-height:2.5rem;margin-top:.3rem;padding:.4rem .5rem;font-family:inherit;font-size:.78rem;display:none}.reason-input.visible{display:block}.reason-input:focus{border-color:var(--must-border);background:#fff;outline:none}.reason-counter{text-align:right;color:var(--text-light);margin-top:.2rem;font-size:.7rem;display:none}.reason-counter.visible{display:block}code{color:#c0392b;background:#f0f0f0;border-radius:3px;padding:.1rem .35rem;font-family:SF Mono,Fira Code,Consolas,monospace;font-size:.83em}.toast{color:#fff;z-index:1000;pointer-events:none;background:#2c3e50;border-radius:8px;padding:.8rem 1.5rem;font-size:.9rem;transition:transform .4s;position:fixed;bottom:2rem;left:50%;transform:translate(-50%)translateY(100px);box-shadow:0 4px 20px #0000004d}.toast.show{transform:translate(-50%)translateY(0)}.cookie-consent-banner{border:1px solid var(--border);box-shadow:var(--shadow);z-index:1001;background:#fff;border-radius:8px;align-items:center;gap:.6rem;padding:.6rem .8rem;font-size:.78rem;display:flex;position:fixed;bottom:1rem;left:50%;transform:translate(-50%)}.cookie-consent-banner button{color:#fff;cursor:pointer;background:#3498db;border:1px solid #3498db;border-radius:6px;padding:.3rem .6rem;font-size:.75rem;font-weight:600}.cookie-consent-actions{gap:.4rem;display:flex}.cookie-consent-banner button.secondary{border-color:var(--border);color:var(--text);background:#fff}.cookie-consent-banner.hidden{display:none}.modal-overlay{z-index:200;background:#00000080;justify-content:center;align-items:center;display:none;position:fixed;inset:0}.modal-overlay.show{display:flex}.modal{background:#fff;border-radius:12px;width:90%;max-width:520px;max-height:80vh;padding:2rem;overflow-y:auto;box-shadow:0 20px 60px #0000004d}.modal h2{margin-bottom:1rem;font-size:1.2rem}.modal textarea{border:1px solid var(--border);resize:vertical;border-radius:6px;width:100%;height:80px;margin-bottom:1rem;padding:.7rem;font-family:monospace;font-size:.8rem}.modal-buttons{justify-content:flex-end;gap:.5rem;display:flex}.modal-buttons button{border:1px solid var(--border);cursor:pointer;background:#fff;border-radius:6px;padding:.5rem 1.2rem;font-size:.85rem;transition:all .2s}.modal-buttons button.primary{color:#fff;background:#3498db;border-color:#3498db}.modal-buttons button:hover{opacity:.85}.intro-text{border-radius:var(--radius);box-shadow:var(--shadow);color:var(--text-light);background:#fff;margin-bottom:.8rem;padding:.8rem 1rem;font-size:.82rem;line-height:1.5}.legend{flex-wrap:wrap;gap:.8rem;margin-top:.4rem;display:flex}.legend-item{align-items:center;gap:.3rem;font-size:.76rem;font-weight:600;display:flex}.legend-dot{border-radius:50%;width:10px;height:10px}.legend-dot.must{background:var(--must-color)}.legend-dot.should{background:var(--should-color)}.legend-dot.may{background:var(--may-color)}.version-indicator{color:var(--text-light);opacity:.5;z-index:50;pointer-events:none;font-size:.65rem;position:fixed;bottom:.5rem;left:.5rem}[data-theme=dark]{--bg:#111821;--card-bg:#1b2733;--text:#e3eaf1;--text-light:#aab7c4;--border:#374a5c;--shadow:0 2px 8px #00000059}[data-theme=dark] .toolbar,[data-theme=dark] .toolbar button,[data-theme=dark] .col-toggle,[data-theme=dark] .response-btn,[data-theme=dark] .cookie-consent-banner button.secondary,[data-theme=dark] .modal-buttons button,[data-theme=dark] .reason-input,[data-theme=dark] .cookie-consent-banner,[data-theme=dark] .modal,[data-theme=dark] .intro-text{background:var(--card-bg);color:var(--text);border-color:var(--border)}[data-theme=dark] .toolbar button:hover,[data-theme=dark] .response-btn:hover{background:#263747;border-color:#4a6074}[data-theme=dark] .check-item{border-top-color:#2f4051}[data-theme=dark] code{color:#f5c47a;background:#2d3e4f}[data-theme=dark] .cookie-consent-banner button{background:#2980b9;border-color:#2980b9}[data-theme=dark] .header-icon-button{background:#ffffff3d;border-color:#ffffff8c}[data-theme=dark] .header-icon-button:hover{background:#ffffff59}@media print{.cards-grid,.cards-grid.cols-1,.cards-grid.cols-2,.cards-grid.cols-auto{columns:auto!important;column-count:1!important;column-width:auto!important;column-gap:0!important;display:block!important}.principle-card{box-shadow:none;break-inside:avoid;page-break-inside:avoid;border:1px solid #ddd;width:100%;margin-bottom:.5rem;display:block}.section-divider{break-after:avoid;page-break-after:avoid;break-inside:avoid;page-break-inside:avoid}.check-item{break-inside:avoid;page-break-inside:avoid}.header{position:relative}.toolbar,.toast,.modal-overlay,.cookie-consent-banner{display:none!important}body{background:#fff;padding:0}.container{max-width:100%;padding:0}.intro-text{box-shadow:none;border:1px solid #ddd}.checkbox-custom{color:#0000;-webkit-print-color-adjust:exact;print-color-adjust:exact;border:2px solid #333!important}.check-item.checked .checkbox-custom{color:#333!important;background:#fff!important;border-color:#333!important}.check-item.checked .check-text{color:var(--text);text-decoration:none}.response-btn{-webkit-print-color-adjust:exact;print-color-adjust:exact;color:#999!important;background:#fff!important;border:1px solid #ddd!important}.response-btn.active.yes-btn{color:#27ae60!important;border-color:#27ae60!important}.response-btn.active.no-btn{color:#c0392b!important;border-color:#c0392b!important}.reason-input.visible{background:#fff!important;border:1px solid #ddd!important;display:block!important}.version-indicator{opacity:1;color:#555;font-size:.6rem;position:fixed;bottom:.25rem;left:.25rem}.progress-bar-container,.progress-text{display:none}}@media (width<=600px){.header h1{font-size:1.1rem}.toolbar{gap:.25rem}.toolbar button{padding:.3rem .5rem;font-size:.7rem}.principle-header{padding:.5rem .7rem}.checklist{padding:0 .7rem .5rem}}
