:root{--bg:#f4f5f7;--panel:#fff;--panel-soft:#f8fbff;--accent:#1d4f91;--accent-soft:#e9f0fb;--text:#1f2933;--muted:#52606d;--border:#cbd2d9;--error:#c53030;--error-bg:#fff5f5;--success:#276749;--success-bg:#f0fff4;--warning:#b7791f;--warning-bg:#fffaf0;--shadow:0 1px 2px #1f293314, 0 2px 8px #1f29330f;--sans:system-ui, "Segoe UI", Roboto, sans-serif;--mono:ui-monospace, Consolas, monospace}*,:before,:after{box-sizing:border-box;margin:0;padding:0}button{font:inherit;line-height:inherit}html{background:var(--bg);color:var(--text);font:16px/1.5 var(--sans);-webkit-font-smoothing:antialiased}a{color:var(--accent);text-decoration:none}a:hover,a:focus{text-decoration:underline}#root{max-width:1200px;margin:0 auto;padding:0 1rem}h1{color:var(--accent);margin-bottom:1.25rem;font-size:2rem;font-weight:400}h2{color:#123b6d;background:var(--accent-soft);border-left:4px solid var(--accent);margin-bottom:1rem;padding:.25rem .75rem;font-size:1.125rem;font-weight:400}h3{color:#123b6d;margin-bottom:.75rem;font-size:1rem;font-weight:400}p{margin-bottom:.75rem}.text-error{color:var(--error)}.mono{font-family:var(--mono)}.hero{color:#fff;background:linear-gradient(120deg,#1d4f91f0,#123b6df5);border-radius:2px;padding:2rem 1rem}.hero-inner{max-width:1200px;margin:0 auto}.hero h1{color:#fff;margin-bottom:.5rem}.hero .button-row{margin-top:1.5rem}.hero .ghost-button{color:#fff;background:0 0;border-color:#fff}.navbar{background:var(--panel);border-bottom:1px solid var(--border);margin:0 -1rem;padding:1rem}.navbar nav{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1.5rem;max-width:1200px;margin:0 auto;display:flex}.navbar ul{flex-wrap:wrap;align-items:center;gap:1.5rem;list-style:none;display:flex}.navbar a{color:var(--accent);font-weight:600}.navbar a.current{color:var(--text)}.navbar .link-button{color:var(--accent);cursor:pointer;background:0 0;border:none;padding:0;font-weight:600}.navbar .link-button:hover{text-decoration:underline}.layout{flex-direction:column;gap:1rem;padding:1.5rem 0;display:flex}.panel{background:var(--panel);border:1px solid var(--border);border-radius:2px;padding:1rem 1.5rem}.button,.ghost-button{border:1px solid var(--accent);cursor:pointer;border-radius:2px;padding:.5rem 1rem;font-size:1rem;font-weight:600;text-decoration:none;display:inline-block}.button{background:var(--accent);color:#fff}.ghost-button{color:var(--accent);background:#fff}.button:hover,.button:focus,.ghost-button:hover,.ghost-button:focus{text-decoration:none}.button.danger{background:var(--error);border-color:var(--error);color:#fff}.button.danger:hover{background:#9b2c2c}.button:disabled,.ghost-button:disabled{opacity:.6;cursor:not-allowed}.button-row{flex-wrap:wrap;gap:.75rem;margin-top:1rem;display:flex}.badge{border:1px solid var(--border);border-radius:2px;padding:.2rem .5rem;font-size:.875rem;font-weight:600;display:inline-block}.badge.success{background:var(--success-bg);color:var(--success);border-color:var(--success)}.badge.warning{background:var(--warning-bg);color:var(--warning);border-color:var(--warning)}.badge.danger{background:var(--error-bg);color:var(--error);border-color:var(--error)}.chip{background:var(--accent-soft);color:var(--accent);border:1px solid var(--border);border-radius:2px;padding:.2rem .5rem;font-size:.875rem}.chip-row{flex-wrap:wrap;gap:.5rem;display:flex}.alert{border:1px solid var(--border);border-radius:2px;margin-bottom:1rem;padding:1rem}.alert.danger{background:var(--error-bg);border-color:var(--error);color:var(--error)}.alert.success{background:var(--success-bg);border-color:var(--success);color:var(--success)}.alert ul{margin-top:.5rem;padding-left:1.2rem}.code-block{background:var(--panel-soft);border:1px solid var(--border);color:var(--text);white-space:pre-wrap;font-family:var(--mono);border-radius:2px;padding:1rem;overflow-x:auto}.form-grid{gap:1rem;display:grid}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;display:grid}.full-width{grid-column:1/-1}input[type=text],input[type=email],input[type=number],select,textarea{border:1px solid var(--border);width:100%;color:var(--text);font:inherit;background:#fff;border-radius:2px;padding:.5rem 1rem}textarea{resize:vertical;min-height:10rem}textarea.code-input{font-family:var(--mono)}label{margin-bottom:.375rem;font-weight:600;display:block}.required{color:var(--error)}.hint{color:var(--muted);margin-top:.375rem;font-size:.875rem;display:block}input:focus,select:focus,textarea:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 2px #1d4f9133}input.invalid,textarea.invalid{border-color:var(--error);box-shadow:0 0 0 2px #c5303033}.field-error{color:var(--error);margin-top:.25rem;font-size:.875rem;display:block}.field-success{color:var(--success);margin-top:.25rem;font-size:.875rem;display:block}.radio-group{gap:.5rem;display:flex}.radio-card{border:1px solid var(--border);cursor:pointer;border-radius:2px;align-items:center;gap:.5rem;margin-bottom:0;padding:.5rem 1rem;font-weight:400;display:flex}.radio-card:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}table{border-collapse:collapse;width:100%}th{text-align:left;border-bottom:2px solid var(--border);padding:.5rem .5rem .5rem 0;font-weight:600}td{border-bottom:1px solid var(--border);padding:.5rem .5rem .5rem 0}.table-actions{white-space:nowrap;gap:.5rem;display:flex}.detail-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;display:grid}.detail-item{border:1px solid var(--border);background:#fff;border-radius:2px;padding:1rem}.detail-item strong{color:var(--accent);margin-bottom:.25rem;display:block}.detail-grid+.detail-item,.detail-item+.code-block{margin-top:1rem}.snippet-list{margin:0;padding:0;list-style:none}.snippet-list li{border-bottom:1px solid var(--border);margin-bottom:1rem;padding-bottom:1rem}.snippet-list li:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}.snippet-meta{color:var(--muted);margin:.25rem 0;font-size:.875rem}.snippet-list .chip-row{margin-top:.25rem}.snippet-list .button{margin-top:.5rem}.pagination{justify-content:center;gap:.25rem;margin-top:1rem;display:flex}.pagination button,.pagination .current{border:1px solid var(--border);color:var(--accent);cursor:pointer;background:#fff;border-radius:2px;padding:.25rem .5rem;text-decoration:none}.pagination .current{background:var(--accent);color:#fff;cursor:default}.pagination button:disabled{color:var(--muted);cursor:not-allowed}.card{border:1px solid var(--border);border-radius:2px;padding:1rem}.card.soft{background:var(--panel-soft);border-color:#0000}.render-preview{border:1px solid var(--border);background:#fff;border-radius:2px;margin-top:1rem;padding:1rem;overflow-x:auto}.render-preview svg{max-width:100%;height:auto}@media (width<=700px){#root{padding:0 .75rem}.grid-2,.detail-grid{grid-template-columns:1fr}.button,.ghost-button{text-align:center}.button-row{flex-direction:column-reverse;align-items:stretch}.navbar ul{flex-direction:column;align-items:flex-start;gap:.5rem}}