/* Jann's KCR design (Demo-start.dc.html, 9 Oct 2026): ICATT red, Outfit headings, Figtree body. */
:root{--red:#E50000;--red-dark:#B30000;--line:#EDEDED;--peach:#FDECD8}
body{margin:0;background:#FFFFFF;color:#000000;font-family:Figtree,'Segoe UI',sans-serif;font-weight:300}
a{color:var(--red)}a:hover{color:var(--red-dark)}
.page{min-height:100vh;display:flex;flex-direction:column}
.wrap{max-width:1280px;margin:0 auto;box-sizing:border-box;width:100%}
header{background:#FFFFFF;border-bottom:1px solid var(--line)}
header .wrap{padding:20px 32px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.logo{display:flex;align-items:center;gap:16px;text-decoration:none}
.logo svg{fill:var(--red)}
.kcr-nav{display:flex;flex-wrap:wrap;gap:28px;font-family:Outfit,sans-serif;font-weight:500;font-size:16px}
.kcr-nav a{color:#000000;text-decoration:none}
.kcr-nav a[aria-current=page]{color:var(--red)}
.kcr-nav a:hover{color:var(--red) !important}
main{flex:1}
main .wrap{padding:48px 32px 64px}
.columns{display:flex;flex-wrap:wrap;align-items:flex-start;gap:32px}
footer{background:#000000;color:#FFFFFF}
footer .wrap{padding:28px 32px;display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;font-size:15px}
footer span{font-family:Outfit,sans-serif;font-weight:500}
footer a{color:#FFFFFF}
.kcr-btn{align-self:flex-start;box-sizing:border-box;text-decoration:none;display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:14px 26px;background:var(--red);color:#FFFFFF;font-family:Outfit,sans-serif;font-weight:500;font-size:17px;border:0;border-radius:0;cursor:pointer}
.kcr-btn:hover{filter:brightness(0.9);color:#FFFFFF}
.kcr-btn:disabled{filter:grayscale(1);cursor:wait}
.settings{flex:1 1 340px;min-width:0;background:#FFFFFF;border-top:6px solid var(--red);padding:32px;box-sizing:border-box;display:flex;flex-direction:column;gap:22px}
.settings h1{margin:0;font-family:Outfit,sans-serif;font-weight:700;font-size:26px;line-height:1.15}
.settings h2{margin:6px 0 -10px;font-family:Outfit,sans-serif;font-weight:700;font-size:18px}
.field{display:flex;flex-direction:column;gap:8px}
.field label{font-family:Outfit,sans-serif;font-weight:500;font-size:15px}
.kcr-input{height:48px;box-sizing:border-box;padding:0 14px;font-family:Figtree,sans-serif;font-size:17px;color:#000000;background:#FFFFFF;border:1px solid #767676;border-radius:0}
.kcr-input:disabled{color:#464646;background:#EFEFEF;border-color:#C4C4C4}
.kcr-input:focus{outline:3px solid var(--red);outline-offset:1px}
.kcr-input[aria-invalid=true]{border:2px solid var(--red)}
.field-error,.field-warning{color:var(--red-dark);font-size:14px;font-weight:400}
.status{font-size:15px;line-height:1.5;font-weight:400;margin:0}
.status.error{color:var(--red-dark)}
.kcr-md{flex:2 1 560px;min-width:0;height:640px;overflow-y:auto;background:#FFFFFF;border:1px solid #D8D8D8;padding:32px 36px;box-sizing:border-box}
.kcr-md.free{height:auto;overflow:visible;border:0;padding:0;max-width:860px}
.kcr-md h1{font-family:Outfit,sans-serif;font-weight:800;font-size:30px;line-height:1.1;margin:0 0 20px}
.kcr-md h2{font-family:Outfit,sans-serif;font-weight:700;font-size:21px;margin:32px 0 12px}
.kcr-md p,.kcr-md li{font-size:16px;line-height:1.6;margin:0 0 12px}
.kcr-md ol{padding-left:22px;margin:0 0 12px}
.kcr-md strong{font-weight:600}
.kcr-md table{border-collapse:collapse;width:100%;min-width:560px;font-size:15px;line-height:1.5}
.kcr-md th{font-family:Outfit,sans-serif;font-weight:700;text-align:left;background:#000;color:#fff;padding:10px 12px}
.kcr-md td{padding:10px 12px;border-bottom:1px solid #E2E2E2;vertical-align:top}
.kcr-md tr:nth-child(even) td{background:var(--peach)}
.hero{border-top:6px solid var(--red);padding:40px 0 8px;max-width:760px;display:flex;flex-direction:column;gap:24px}
.hero h1{margin:0;font-family:Outfit,sans-serif;font-weight:800;font-size:44px;line-height:1.05}
.hero p{margin:0;font-size:19px;line-height:1.6}
@media (max-width:600px){header .wrap,main .wrap,footer .wrap{padding-left:16px;padding-right:16px}.kcr-md{padding:24px 20px}.hero h1{font-size:34px}}
.role{border:0;margin:0;padding:0;min-width:0}
.role legend{padding:0;margin-bottom:10px;font-family:Outfit,sans-serif;font-weight:700;font-size:17px}
.role .field label{font-size:14px}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:480px){.pair{grid-template-columns:1fr}}
.pair .kcr-input{width:100%}
.kcr-input::placeholder{color:#8A8A8A;opacity:1}
.intro{margin:0;font-size:16px;line-height:1.5}
.intro strong{font-weight:600}