:root{font-family:Arial,sans-serif;color:#252035;background:#f8f6fc;font-size:16px;line-height:1.5}*{box-sizing:border-box}body{margin:0}a{color:#612cc0}button,input,select{font:inherit}button,.demo-button{min-height:44px;border:1px solid #d4cbe6;border-radius:10px;background:#fff;padding:10px 14px;cursor:pointer;color:#392754;text-decoration:none}button:hover,.demo-button:hover{background:#f4edff}button:disabled{cursor:default;opacity:.6}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #9e74eb;outline-offset:3px}.demo-main{max-width:1160px;margin:0 auto;padding:28px}.demo-header{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}.demo-brand{display:flex;gap:12px;align-items:center;text-decoration:none;color:#252035;font-size:23px;font-weight:750}.demo-brand img{width:52px;height:52px;border-radius:50%}.demo-brand small{display:block;font-size:13px;color:#6d647c;font-weight:400}.demo-intro{margin:36px 0 24px;max-width:830px}.demo-eyebrow{font-size:12px;letter-spacing:.1em;color:#612cc0;font-weight:bold}h1{font-size:32px;line-height:1.2;margin:10px 0 16px}h2{font-size:21px;line-height:1.3;margin:10px 0}.demo-muted,footer{color:#625b6f;font-size:14px}.demo-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.demo-card{background:#fff;border:1px solid #e3dcea;border-radius:16px;padding:22px;min-width:0;display:flex;flex-direction:column;gap:12px}.demo-card p{margin:0}.demo-card label,.demo-login-form label{display:grid;gap:7px;font-weight:600;font-size:14px}.demo-card input,.demo-login-form input,.demo-login-form select{min-width:0;width:100%;border:1px solid #cfc7dc;border-radius:8px;padding:11px 12px;min-height:44px;font-size:16px;color:#252035;background:#fff}.demo-field-actions{display:flex;gap:7px;flex-wrap:wrap}.demo-field-actions button{font-size:13px;padding:8px 10px;flex:1}.demo-card .demo-button{margin-top:auto;text-align:center;background:#612cc0;color:#fff;border-color:#612cc0;font-weight:600}.demo-card .demo-button:hover,.demo-primary:hover{background:#4b1c9e}.demo-chip{font-size:12px;font-weight:600;align-self:flex-start;background:#eee6fb;color:#512699;border-radius:20px;padding:4px 10px}.demo-toolbar{display:flex;gap:12px;margin:22px 0;flex-wrap:wrap}.demo-error{color:#9c1c35;background:#fff0f3;border:1px solid #f1c0ca;padding:13px;border-radius:10px}footer{padding:18px 0;border-top:1px solid #e0d8ec}.demo-login-main{max-width:580px}.demo-login-form{display:grid;gap:18px;background:#fff;border:1px solid #e3dcea;border-radius:16px;padding:25px;margin:24px 0}.demo-primary{background:#612cc0;border-color:#612cc0;color:#fff;font-weight:600}.demo-password-row{display:grid;grid-template-columns:1fr auto;gap:8px}.demo-test-note{border-left:4px solid #8a4ed0;padding:12px 16px;background:#eee6fb}.demo-login-form [hidden],[hidden]{display:none!important}@media(max-width:850px){.demo-cards{grid-template-columns:1fr}.demo-card{max-width:none}}@media(max-width:480px){.demo-main{padding:18px}.demo-header{align-items:flex-start;gap:14px}.demo-intro{margin-top:28px}h1{font-size:27px}.demo-card,.demo-login-form{padding:18px}.demo-header>a:last-child{font-size:14px}.demo-password-row{grid-template-columns:1fr}.demo-toolbar button{flex:1}}
