:root{--ranz-charcoal: #3c4b5d;--ranz-charcoal-dark: #2c3546;--ranz-charcoal-light: #7d8c9d;--ranz-yellow: #fcb613;--ranz-red: #be4039;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#0f172a;background-color:#f0f2f5}body{margin:0}.app-root{min-height:100vh;display:flex;justify-content:center;padding:32px 16px;box-sizing:border-box}.app-shell{width:100%;max-width:1100px;background:#fff;border-radius:16px;box-shadow:0 12px 30px #0f172a26;padding:28px 24px 32px;box-sizing:border-box;border-top:4px solid var(--ranz-charcoal)}.app-header{display:flex;gap:16px;align-items:flex-start;margin-bottom:24px}.app-header-logo{height:56px;width:auto}.app-title{font-size:1.75rem;font-weight:700;margin:0;color:var(--ranz-charcoal)}.app-subtitle{margin-top:6px;font-size:.9rem;color:#4b5563}.app-section{border:1px solid #e5e7eb;border-radius:12px;padding:16px 16px 18px;margin-bottom:16px;transition:box-shadow .2s ease}.app-section:hover{box-shadow:0 1px 4px #3c4b5d14}.app-section-title{font-size:1rem;font-weight:600;margin:0 0 8px}.app-section-help{font-size:.85rem;color:#6b7280;margin:0 0 10px}.grid-two{display:grid;grid-template-columns:1fr;gap:10px}@media (min-width: 768px){.grid-two{grid-template-columns:1fr 1fr}}.label{display:block;font-size:.82rem;font-weight:500;margin-bottom:4px}.input,.select,.textarea{width:100%;box-sizing:border-box;padding:6px 8px;font-size:.85rem;border-radius:6px;border:1px solid #d1d5db;transition:all .15s ease}.input:focus,.select:focus,.textarea:focus{outline:2px solid var(--ranz-charcoal);outline-offset:1px;border-color:transparent}.textarea{resize:vertical}.role-card{border-radius:10px;border:1px solid #e5e7eb;padding:10px;margin-bottom:10px}.role-title{font-size:.9rem;font-weight:600;margin:0 0 6px}.table{width:100%;border-collapse:collapse;font-size:.78rem}.table th,.table td{border:1px solid #e5e7eb;padding:4px 6px;text-align:left}.table thead{background-color:#f3f4f6}.button-row{display:flex;gap:8px;margin-top:6px}.button-primary{padding:6px 12px;border-radius:999px;border:none;background-color:var(--ranz-charcoal);color:#fff;font-size:.85rem;cursor:pointer;transition:all .15s ease}.button-primary:hover{background-color:var(--ranz-charcoal-dark)}.button-primary:active{transform:scale(.98)}.button-primary:focus-visible{outline:2px solid var(--ranz-yellow);outline-offset:2px}.button-secondary{padding:6px 12px;border-radius:999px;border:1px solid #d1d5db;background-color:#fff;font-size:.85rem;cursor:pointer;transition:all .15s ease}.button-secondary:hover{background-color:#f9fafb}.button-secondary:active{transform:scale(.98)}.json-panel{margin-top:18px;background-color:#020617;color:#e5e7eb;border-radius:12px;padding:12px;font-size:.76rem;overflow-x:auto}.json-title{margin:0 0 4px;font-weight:600}.json-subtitle{margin:0 0 8px;font-size:.75rem;color:#9ca3af}