:root{--color-primary:#1e96f0;--color-deep:#0f69b4;--color-sky:#4bb4f0;--color-charcoal:#1e2d3c;--color-body:#2c3e50;--color-muted:#5a7a9a;--color-surface:#f7f9fc;--color-border:#d8e2ea;--color-canvas:#fff;--color-success:#22c55e;--color-warning:#f59e0b;--color-error:#ef4444;--color-success-bg:#f0fdf4;--color-success-text:#15803d;--color-success-border:#bbf0cb;--color-error-bg:#fef2f2;--color-error-text:#b91c1c;--color-error-border:#fca5a5;--color-warning-bg:#fffbeb;--color-warning-text:#92400e;--color-warning-border:#fcd34d;--color-running-bg:#eff6ff;--color-running-text:#1d4ed8;--color-neutral-bg:#f5f5f5;--color-neutral-text:#737373;--tile-gray-bg:#f3f4f6;--tile-gray-border:#e5e7eb;--tile-gray-dot:#9ca3af;--tile-amber-bg:#fffbeb;--tile-amber-border:#fcd34d;--tile-amber-dot:#f59e0b;--tile-teal-bg:#f0fdfa;--tile-teal-border:#99f6e4;--tile-teal-dot:#14b8a6;--tile-blue-bg:#eff6ff;--tile-blue-border:#bfdbfe;--tile-blue-dot:#3b82f6;--tile-green-bg:#f0fdf4;--tile-green-border:#bbf0cb;--tile-green-dot:#22c55e;--font-heading:"Montserrat", sans-serif;--font-body:"Inter", sans-serif;--font-mono:"Courier New", monospace;--radius-card:8px;--radius-btn:6px;--content-pad:32px;--card-pad:24px;--shadow-card:0 1px 4px #00000012;--color-log-bg:#111827;--color-log-body:#e5e7eb;--color-log-dim:#6b7280;--color-log-ts:#4b5563;--color-log-info:#374151;--color-log-warn:#92400e;--color-log-error:#b91c1c;--color-log-error-bright:#fca5a5;--color-log-error-bg:#450a0a;--transition:.15s ease-out;font-family:var(--font-body);color:var(--color-body);background:var(--color-canvas);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility;font-size:14px;font-weight:400;line-height:1.5}body{background:var(--color-canvas);margin:0}#root{flex-direction:column;min-height:100svh;display:flex}h1{font-family:var(--font-heading);color:var(--color-charcoal);margin:0;font-size:30px;font-weight:700}h2{font-family:var(--font-heading);color:var(--color-charcoal);margin:0;font-size:21px;font-weight:600}h3,h4,h5,h6{font-family:var(--font-heading);color:var(--color-charcoal);margin:0;font-weight:600}p{margin:0}@keyframes dhf-spin{to{transform:rotate(360deg)}}@keyframes dhf-field-pulse-kf{0%{box-shadow:0 0 #f59e0bb3}30%{box-shadow:0 0 0 6px #f59e0b80}60%{box-shadow:0 0 0 10px #f59e0b33}to{box-shadow:0 0 #f59e0b00}}.dhf-field-pulse{animation:1.95s ease-out dhf-field-pulse-kf;border-color:#f59e0b!important}@media (prefers-reduced-motion:reduce){.dhf-field-pulse{animation:none}}.dhf-phase-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;display:grid}.dhf-tile{background:var(--tile-gray-bg);border:1px solid var(--tile-gray-border);border-radius:var(--radius-card);padding:var(--card-pad);cursor:pointer;box-shadow:var(--shadow-card);flex-direction:column;gap:8px;min-height:90px;transition:background .14s ease-out,border-color .14s ease-out,box-shadow .14s ease-out;display:flex;position:relative;overflow:hidden}.dhf-tile:hover{box-shadow:0 2px 8px #0000001f}.dhf-tile[data-state=gray]{background:var(--tile-gray-bg);border-color:var(--tile-gray-border)}.dhf-tile[data-state=amber]{background:var(--tile-amber-bg);border-color:var(--tile-amber-border)}.dhf-tile[data-state=teal]{background:var(--tile-teal-bg);border-color:var(--tile-teal-border)}.dhf-tile[data-state=blue]{background:var(--tile-blue-bg);border-color:var(--tile-blue-border)}.dhf-tile[data-state=green]{background:var(--tile-green-bg);border-color:var(--tile-green-border)}.dhf-tile-dot{border-radius:50%;width:8px;height:8px;transition:background .14s ease-out;position:absolute;top:12px;right:12px}.dhf-tile[data-state=gray] .dhf-tile-dot{background:var(--tile-gray-dot)}.dhf-tile[data-state=amber] .dhf-tile-dot{background:var(--tile-amber-dot)}.dhf-tile[data-state=teal] .dhf-tile-dot{background:var(--tile-teal-dot)}.dhf-tile[data-state=blue] .dhf-tile-dot{background:var(--tile-blue-dot)}.dhf-tile[data-state=green] .dhf-tile-dot{background:var(--tile-green-dot)}.dhf-tile-progress{background:var(--color-border);border-radius:0 0 var(--radius-card) var(--radius-card);height:3px;position:absolute;bottom:0;left:0;right:0;overflow:hidden}.dhf-tile-progress-fill{background:var(--tile-amber-dot);height:100%;transition:width .3s ease-out}.dhf-badge{white-space:nowrap;border-radius:10px;width:fit-content;padding:2px 9px;font-size:11px;font-weight:600;display:inline-block}.dhf-badge-gray{color:#6b7280;background:#f3f4f6}.dhf-badge-amber{color:#b45309;background:#fffbeb}.dhf-badge-teal{color:#0f766e;background:#f0fdfa}.dhf-badge-blue{color:#1d4ed8;background:#eff6ff}.dhf-badge-green{color:var(--color-success);background:#f0fdf4}.dhf-generate-btn{border:1px solid var(--tile-teal-border);border-radius:var(--radius-btn);background:var(--color-primary);color:#fff;font-size:12px;font-weight:600;font-family:var(--font-body);cursor:pointer;transition:background var(--transition);width:fit-content;margin-top:auto;padding:5px 14px}.dhf-generate-btn:hover{background:var(--color-deep)}.dhf-filter-bar{padding:12px var(--content-pad);border-bottom:1px solid var(--color-border);background:var(--color-canvas);align-items:center;gap:6px;display:flex}.dhf-chip{border:1px solid var(--color-border);background:var(--color-canvas);color:var(--color-body);cursor:pointer;transition:all var(--transition);font-size:12px;font-weight:500;font-family:var(--font-body);border-radius:20px;align-items:center;gap:5px;padding:4px 12px;display:flex}.dhf-chip:hover{border-color:var(--color-primary);color:var(--color-primary)}.dhf-chip.active{background:var(--color-charcoal);border-color:var(--color-charcoal);color:#fff;font-weight:600}.dhf-chip-count{opacity:.75;font-size:10px;font-weight:700}.dhf-chip.active .dhf-chip-count{opacity:1}.dhf-phase-header{align-items:center;gap:10px;margin-bottom:12px;display:flex}.dhf-phase-eyebrow{text-transform:uppercase;letter-spacing:.08em;color:var(--color-muted);font-size:10px;font-weight:700}.dhf-phase-title{font-family:var(--font-heading);color:var(--color-charcoal);font-size:15px;font-weight:700}.dhf-phase-count{color:var(--color-muted);background:var(--color-surface);border:1px solid var(--color-border);border-radius:10px;padding:1px 8px;font-size:11px;font-weight:600}.dhf-phase-progress{color:var(--color-muted);align-items:center;gap:8px;margin-left:auto;font-size:11px;display:flex}.dhf-phase-bar{background:var(--color-border);border-radius:4px;width:80px;height:4px;overflow:hidden}.dhf-phase-bar-fill{background:var(--color-success);border-radius:4px;height:100%;transition:width .4s ease-out}.dhf-drawer-scrim{z-index:200;background:#1e2d3c59;animation:.2s ease-out dhf-scrim-in;position:fixed;inset:0}.dhf-drawer{background:var(--color-canvas);z-index:201;flex-direction:column;width:480px;animation:.2s cubic-bezier(.25,.46,.45,.94) dhf-drawer-in;display:flex;position:fixed;top:0;bottom:0;right:0;box-shadow:-4px 0 24px #0000001f}@keyframes dhf-drawer-in{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes dhf-scrim-in{0%{opacity:0}to{opacity:1}}.dhf-drawer-header{border-bottom:1px solid var(--color-border);flex-direction:column;gap:4px;padding:20px 24px 16px;display:flex}.dhf-drawer-header-top{justify-content:space-between;align-items:flex-start;gap:8px;display:flex}.dhf-drawer-meta{font-family:var(--font-mono);color:var(--color-muted);font-size:11px}.dhf-drawer-name{font-family:var(--font-heading);color:var(--color-charcoal);font-size:17px;font-weight:700;line-height:1.3}.dhf-drawer-close{cursor:pointer;color:var(--color-muted);transition:color var(--transition);background:0 0;border:none;border-radius:4px;flex-shrink:0;padding:2px 6px;font-size:18px;line-height:1}.dhf-drawer-close:hover{color:var(--color-charcoal)}.dhf-drawer-body{flex-direction:column;flex:1;gap:24px;padding:20px 24px;display:flex;overflow-y:auto}.dhf-drawer-section-label{text-transform:uppercase;letter-spacing:.08em;color:var(--color-muted);margin-bottom:10px;font-size:10px;font-weight:700}.dhf-drawer-prop-row{gap:12px;margin-bottom:6px;font-size:13px;display:flex}.dhf-drawer-prop-label{color:var(--color-muted);flex-shrink:0;min-width:80px}.dhf-drawer-prop-value{color:var(--color-body);font-weight:500}.dhf-trace-pills{flex-wrap:wrap;gap:6px;display:flex}.dhf-trace-pill{font-family:var(--font-mono);background:var(--color-surface);border:1px solid var(--color-border);color:var(--color-body);border-radius:4px;padding:2px 8px;font-size:11px}.dhf-trace-none{color:var(--color-muted);font-size:12px;font-style:italic}.dhf-drawer-footer{border-top:1px solid var(--color-border);justify-content:flex-end;gap:10px;padding:16px 24px;display:flex}.dhf-drawer-btn{border-radius:var(--radius-btn);font-size:13px;font-weight:600;font-family:var(--font-body);cursor:pointer;transition:all var(--transition);padding:8px 20px}.dhf-drawer-btn-primary{background:var(--color-primary);color:#fff;border:1px solid var(--color-primary)}.dhf-drawer-btn-primary:hover{background:var(--color-deep);border-color:var(--color-deep)}.dhf-drawer-btn-primary:disabled{background:var(--color-border);border-color:var(--color-border);color:var(--color-muted);cursor:not-allowed}.dhf-drawer-btn-secondary{background:var(--color-canvas);color:var(--color-body);border:1px solid var(--color-border)}.dhf-drawer-btn-secondary:hover{border-color:var(--color-primary);color:var(--color-primary)}.dhf-completion-strip{color:var(--color-muted);align-items:center;gap:10px;font-size:12px;display:flex}.dhf-completion-bar{background:var(--color-border);border-radius:4px;width:120px;height:5px;overflow:hidden}.dhf-completion-fill{background:var(--color-success);border-radius:4px;height:100%;transition:width .4s ease-out}.dhf-picker-wrap{padding:60px var(--content-pad);flex-direction:column;align-items:center;gap:24px;display:flex}.dhf-picker-label{font-family:var(--font-heading);color:var(--color-charcoal);font-size:18px;font-weight:600}.dhf-picker-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;width:100%;max-width:800px;display:grid}.dhf-picker-card{background:var(--color-canvas);border:1px solid var(--color-border);border-radius:var(--radius-card);cursor:pointer;box-shadow:var(--shadow-card);transition:all var(--transition);padding:20px}.dhf-picker-card:hover{border-color:var(--color-primary);box-shadow:0 2px 8px #1e96f01f}.dhf-picker-card-name{font-family:var(--font-heading);color:var(--color-charcoal);margin-bottom:4px;font-size:14px;font-weight:700}.dhf-picker-card-meta{color:var(--color-muted);font-size:11px}.dhf-toggle{border:1px solid var(--color-border);border-radius:6px;margin-left:auto;display:flex;overflow:hidden}.dhf-toggle-btn{cursor:pointer;color:var(--color-muted);transition:all var(--transition);background:0 0;border:none;padding:4px 10px;font-size:13px}.dhf-toggle-btn.active{background:var(--color-surface);color:var(--color-charcoal)}