@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--red:#c91834;--ink:#172821;--muted:#66746c;--line:#dce3dc;--paper:#f5f6f1;--green:#236344}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:15px 'DM Sans',Arial,sans-serif}aside{position:fixed;width:238px;height:100vh;background:#142c24;color:#fff;padding:34px 24px;display:flex;flex-direction:column}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;color:white;font:800 25px Manrope,Arial;letter-spacing:3px}.brand small{display:block;font:10px Arial;letter-spacing:1.7px;margin-top:6px}.mark{background:var(--red);border:2px solid #fff;border-radius:50% 50% 45% 45%;width:44px;height:50px;display:grid;place-items:center;font:700 31px Georgia;letter-spacing:0}.side-label{font-size:10px;letter-spacing:1.5px;color:#9eb5a8;margin:42px 0 18px}nav button{display:block;width:100%;text-align:left;border:0;background:transparent;color:#c4d0ca;padding:14px;border-radius:8px;margin:5px 0;font-size:14px}nav button.active{background:#2c463b;color:#fff}nav button:hover{background:#263f34}.sidefoot{margin-top:auto;font:500 28px Manrope;line-height:1.35}.sidefoot p{font:12px Arial;color:#98ada1;margin-top:24px}.shell{margin-left:238px}header{padding:22px 38px;background:#fff;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:12px;align-items:center;color:var(--muted);font-size:13px}.mode{display:flex;align-items:center;gap:12px}.demo{padding:10px 38px;background:#ebe9df;font-size:10px;letter-spacing:1px;font-weight:bold}.demo span{font-weight:400;letter-spacing:0;font-size:12px;margin-left:16px}main{max-width:1350px;margin:auto;padding:38px}h1{font:800 38px Manrope,Arial;letter-spacing:-1.3px;margin:8px 0 12px}h2{font:800 22px Manrope;margin:0 0 14px}h3{font:700 18px Manrope;margin:0 0 8px}p{line-height:1.6}.eyebrow{color:var(--red);font-size:11px;letter-spacing:1.5px;font-weight:700}.muted,small{color:var(--muted)}.hero{display:flex;justify-content:space-between;align-items:center;gap:30px;margin-bottom:28px}.hero p{margin:0;max-width:630px;color:var(--muted)}.hero .illustration{height:115px;width:180px;background:#e2e8db;position:relative;border:2px solid white;outline:1px solid #d1dacb;border-radius:8px;flex-shrink:0}.illustration:before{content:'';position:absolute;inset:14px;border:1px solid #b7c7b3}.illustration:after{content:'V';position:absolute;left:66px;top:32px;background:var(--red);color:white;border-radius:50%;height:48px;width:48px;display:grid;place-items:center;font:30px Georgia}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:28px}.stat{border:1px solid var(--line);border-radius:12px;background:white;padding:20px}.stat b{display:block;font:800 32px Manrope;margin:8px 0}.stat small{font-size:12px}.grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px}.panel,.card{border:1px solid var(--line);border-radius:12px;background:white;padding:24px;margin-bottom:16px}.panel.soft{background:#eaf0e6}.bar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:20px}.filters{display:flex;gap:8px;flex-wrap:wrap}.filters select,.filters input{max-width:180px}.cardhead{display:flex;gap:14px;align-items:flex-start;justify-content:space-between}.datebox{background:#f0f3ed;border-radius:8px;text-align:center;padding:10px;min-width:65px;color:var(--green);font-size:12px}.datebox b{display:block;font:800 25px Manrope}.matchtitle{flex:1}.matchtitle small{font-size:11px}.meta{display:flex;gap:16px;flex-wrap:wrap;margin:14px 0;font-size:13px;color:var(--muted)}.badge{border-radius:30px;padding:6px 10px;font-size:11px;font-weight:700;display:inline-block;background:#eef0ed;color:#526057}.badge.red{color:#a41a2e;background:#fce8eb}.badge.green{color:#236344;background:#e6f2e8}.badge.amber{color:#85520a;background:#fff1d5}.roles{border-top:1px solid var(--line);margin-top:16px}.role{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid #edf0eb;font-size:13px}.role:last-child{border:0}.role small{display:block;margin-top:4px}.role .buttons{display:flex;flex-wrap:wrap;gap:5px}button,.btn{font:600 13px 'DM Sans',Arial;cursor:pointer;border:1px solid var(--line);background:white;color:var(--ink);padding:10px 14px;border-radius:7px;text-decoration:none;display:inline-block}button:hover,.btn:hover{border-color:#a8b7ac;background:#f2f4ef}button.primary,.btn.primary{background:var(--red);color:white;border-color:var(--red)}button.dark{background:var(--ink);color:white}button:disabled{opacity:.5;cursor:not-allowed}button.small{padding:7px 10px;font-size:12px}select,input,textarea{border:1px solid #cfd8ce;background:white;padding:10px;border-radius:6px;font:14px Arial;color:var(--ink)}textarea{width:100%;min-height:110px}label.field{display:block;margin:14px 0}label.field input,label.field select{display:block;width:100%;margin-top:6px}input[type=checkbox]{accent-color:var(--red)}.note{border-left:3px solid #d8ad4d;background:#fff9e8;padding:12px 16px;font-size:12px;line-height:1.6;margin:14px 0}.good{border-color:var(--green);background:#edf4e9}.mini{font-size:12px;line-height:1.7}.listline{padding:12px 0;border-bottom:1px solid var(--line)}.listline:last-child{border:0}footer{padding:24px 38px;color:var(--muted);border-top:1px solid var(--line);font-size:11px;display:flex;justify-content:space-between}dialog{border:0;border-radius:16px;max-width:620px;width:94%;padding:28px;color:var(--ink);box-shadow:0 20px 100px #0003}dialog::backdrop{background:#0c201b99}.close{float:right;border:0;font-size:24px;padding:0 6px}#toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:var(--ink);color:white;border-radius:9px;padding:15px 24px;display:none;max-width:90%;z-index:100}table{width:100%;border-collapse:collapse;font-size:12px}th,td{padding:12px 8px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}th{color:var(--muted)}.scroll{overflow:auto}.calendar{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}.day{background:#fff;border:1px solid var(--line);border-radius:8px;min-height:160px;padding:10px}.day button{width:100%;font-size:11px;text-align:left;padding:8px;margin:5px 0}.log{font:12px monospace;word-break:break-word}.steps{counter-reset:steps}.step{padding:15px 0;border-bottom:1px solid var(--line)}.step b{color:var(--red)}:focus-visible{outline:3px solid #d69c37;outline-offset:3px}@media(max-width:1100px){.grid{grid-template-columns:1fr}.hero .illustration{display:none}aside{width:200px}.shell{margin-left:200px}.calendar{grid-template-columns:repeat(3,1fr)}}@media(max-width:750px){aside{position:static;width:100%;height:auto;padding:18px}.brand{font-size:20px}.mark{width:33px;height:37px;font-size:22px}.side-label,.sidefoot{display:none}nav{display:flex;overflow:auto;margin-top:14px;gap:5px}nav button{white-space:nowrap;width:auto;padding:10px}.shell{margin:0}header{padding:16px;flex-direction:column;align-items:flex-start}.demo{padding:10px 16px}.demo span{display:block;margin:5px 0 0}main{padding:24px 16px}h1{font-size:31px}.stats{grid-template-columns:repeat(2,1fr);gap:8px}.stat{padding:14px}.card,.panel{padding:18px}.cardhead{flex-wrap:wrap}.cardhead>.badge{margin-left:79px}.role{align-items:flex-start}.role .buttons{max-width:150px;justify-content:flex-end}.calendar{grid-template-columns:repeat(2,1fr)}footer span{display:none}}

.lolla-row{display:flex;justify-content:space-between;gap:15px;align-items:center;padding:20px 0;border-top:1px solid var(--line)}.lolla-row strong{font-size:21px}.lolla-row small{display:block;margin-top:6px;font-size:12px}.lolla-row .buttons{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}@media(max-width:750px){.lolla-row{align-items:flex-start}.lolla-row .buttons{max-width:160px}}

.profile-photo{display:flex;align-items:center;gap:18px;margin:20px 0}.profile-photo #photoPreview{width:90px;height:90px;flex:0 0 90px;border-radius:50%;overflow:hidden;background:#e8eee3;display:grid;place-items:center;font:700 36px Manrope;color:var(--green)}.profile-photo img{width:100%;height:100%;object-fit:cover}.profile-photo input{max-width:100%;font-size:12px}.profile-photo>div:last-child{min-width:0}.field input[type=checkbox]{display:inline-block;width:auto;margin-right:8px}

.authbox{max-width:620px;margin:0 auto 24px}.brand{font-size:23px;letter-spacing:-1px}.brand>span{color:#ff8059}input[readonly]{background:#eef1eb}.buttons{display:flex;gap:6px;flex-wrap:wrap}.profile-photo{display:flex;gap:20px;align-items:center}.profile-photo #avatar{width:80px;height:80px;flex:0 0 80px;border-radius:50%;overflow:hidden;background:#e7eee3;display:grid;place-items:center;font-size:30px}.profile-photo img{width:100%;height:100%;object-fit:cover}.field input[type=checkbox]{display:inline-block;width:auto;margin-right:8px}#account{display:flex;align-items:center;gap:12px}.field small{font-size:12px}.profile-photo input{max-width:100%;font-size:12px}footer button{padding:4px 8px}

/* Phone forms: readable text, reliable tap targets and bounded file inputs. */
@media(max-width:750px){
 button,.btn,button.small,footer button{min-height:44px}
 input,select,textarea{font-size:16px;min-height:44px;max-width:100%}
 input[type=checkbox]{min-height:22px;min-width:22px;vertical-align:middle}
 nav button{flex-shrink:0;margin:0;min-height:44px}
 .profile-photo{align-items:flex-start;flex-wrap:wrap;gap:12px}
 .profile-photo label{min-width:0;max-width:100%;flex:1 1 180px}
 .profile-photo input[type=file]{width:100%;font-size:16px}
 .cardhead>.badge{margin-left:0}
 .bar>*{min-width:0;max-width:100%}
 .panel,.card{overflow-wrap:anywhere}
 #account{max-width:100%;flex-wrap:wrap}
 dialog{max-height:90dvh;overflow-y:auto;padding:20px}
 .authbox>.bar button{flex:1}
}
