*{box-sizing:border-box}html{color-scheme:light;--bg:#f6f8fc;--surface:#fff;--text:#17263d;--muted:#47576d;--line:#cbd5e3;--link:#1457b7;--soft:#eaf1fc}html[data-theme=dark]{color-scheme:dark;--bg:#101a2a;--surface:#19283e;--text:#eff4fc;--muted:#bfcee2;--line:#43546f;--link:#a4c5ff;--soft:#223750}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.65 system-ui,sans-serif}a{color:var(--link);text-underline-offset:3px}header,main,footer{width:min(1180px,100%);margin:auto;padding:24px}header{display:flex;align-items:center;flex-wrap:wrap;gap:14px;border-bottom:1px solid var(--line)}header .brand{font-size:23px;font-weight:800;text-decoration:none;margin-right:auto}header nav{display:flex;flex-wrap:wrap;gap:16px}.theme{min-height:44px}h1{font-size:clamp(34px,5vw,58px);line-height:1.12;letter-spacing:-1.4px;margin:12px 0 22px}h2{font-size:26px;line-height:1.3}h3{font-size:19px}.eyebrow{font-size:12px;font-weight:800;color:var(--link);letter-spacing:1.8px;text-transform:uppercase}.intro{max-width:820px;padding:30px 0}.intro p,.muted{color:var(--muted)}.workspace{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr);gap:24px;align-items:start}.panel{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:24px;min-width:0}.panel h2:first-child{margin-top:0}label{display:block;font-size:14px;font-weight:650;margin:16px 0 7px}input:not([type=checkbox]),textarea,select{width:100%;max-width:100%;font:inherit;padding:11px 12px;background:var(--bg);color:var(--text);border:1px solid var(--line);border-radius:8px}input[type=color]{height:48px}textarea{resize:vertical;min-height:110px}button,.button{font:inherit;border:1px solid var(--line);padding:10px 16px;border-radius:8px;background:var(--soft);color:var(--text);cursor:pointer;min-height:44px}.primary{background:#0b57d0;color:white;border-color:#0b57d0}button:disabled{opacity:.55;cursor:not-allowed}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:16px 0}.row label{margin:0}.row input[type=checkbox]{width:18px;height:18px;flex-shrink:0}.status{min-height:28px;overflow-wrap:anywhere}.error{color:#ab2633}html[data-theme=dark] .error{color:#ffabb4}.good{color:#17653f}html[data-theme=dark] .good{color:#8ce1b6}.notice{background:var(--soft);border:1px solid var(--line);padding:16px;border-radius:10px;font-size:14px}.output{width:100%;min-height:210px;font:13px/1.6 ui-monospace,Consolas,monospace;white-space:pre;overflow:auto}.table-wrap{max-width:100%;overflow:auto;margin:18px 0}table{border-collapse:collapse;width:100%;font-size:14px}td,th{text-align:left;padding:10px;border-bottom:1px solid var(--line);vertical-align:top;overflow-wrap:anywhere}table input,table select{min-width:115px!important}pre,code{overflow-wrap:anywhere}pre{white-space:pre-wrap;word-break:break-word;background:var(--bg);padding:14px;border-radius:8px;max-width:100%}.record{border-top:1px solid var(--line);padding:18px 0}.record h3{margin:0 0 8px}.guide{max-width:900px;padding:35px 0}.guide li{margin:9px 0}summary{cursor:pointer;font-weight:700;padding:14px 0}details{border-bottom:1px solid var(--line)}.related{display:flex;flex-wrap:wrap;gap:14px;padding-block:20px;border-block:1px solid var(--line);margin-block:28px}.drop{border:2px dashed var(--line);border-radius:12px;padding:22px;text-align:center}.drop.drag{border-color:var(--link);background:var(--soft)}.preview-image{display:block;max-width:100%;height:auto;border-radius:12px;border:1px solid var(--line)}.tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:24px}.tabs [aria-pressed=true]{background:#0b57d0;color:#fff}.skip{position:absolute;top:-100px}.skip:focus{top:0;background:var(--surface);padding:14px;z-index:5}:is(a,input,button,textarea,select,summary):focus-visible{outline:3px solid var(--link);outline-offset:3px}footer{color:var(--muted);border-top:1px solid var(--line);font-size:14px}[hidden]{display:none!important}@media(max-width:760px){header,main,footer{padding:18px}.workspace{grid-template-columns:1fr}.panel{padding:18px}.intro{padding:22px 0}header nav{font-size:14px}.output{font-size:12px}h1{letter-spacing:-.8px}}
