:root{font-family:Inter,system-ui,-apple-system,'Segoe UI',Arial,sans-serif;color:#213c2d;background:#f3f3eb;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,textarea{font:inherit}button{cursor:pointer}.hidden{display:none!important}.shell{max-width:850px;min-height:100vh;display:flex;flex-direction:column;margin:auto;padding:0 28px}.top{height:100px;border-bottom:1px solid #d6ddcf;display:flex;justify-content:space-between;align-items:center}.brand{display:flex;align-items:center;gap:13px}.brand-symbol{display:grid;place-items:center;height:42px;width:42px;border-radius:10px;background:#deebdc;color:#2f6342;font-size:33px}.brand strong{display:block;font-size:26px;font-weight:860;letter-spacing:.15em;line-height:1.15}.brand-dot{color:#83ab76}.brand small{display:block;color:#688473;font-size:9px;font-weight:780;letter-spacing:.09em}.brand-rule{color:#9ba99e;margin:0 4px}main{flex:1}.view{padding:26px 0 50px}.intro{padding:40px 0 30px}.intro.less{padding:28px 0}.intro.compact{padding:20px 0}.overline{font-size:10px;font-weight:800;letter-spacing:.16em;color:#5c8265;display:flex;align-items:center;gap:8px}.overline-line{height:2px;background:#86ad7d;width:22px}.intro h1{font-size:clamp(36px,7vw,54px);line-height:1.1;letter-spacing:-.055em;font-weight:820;margin:12px 0}.intro h1 em{font-style:normal;color:#78a06e}.intro p{color:#718176;font-size:14px;line-height:1.7;margin:7px 0;max-width:530px}.white-card{background:#fff;border:1px solid #e0e6da;border-radius:18px;box-shadow:0 8px 26px #173d2908}.login-card{padding:32px;max-width:560px}.card-heading{display:flex;align-items:center;gap:12px;margin-bottom:22px}.card-heading h2{margin:0;font-size:18px;letter-spacing:-.025em}.card-heading p{margin:3px 0 0;font-size:12px;color:#7b897b}.small-icon{height:40px;width:40px;border-radius:10px;display:grid;place-items:center;font-size:23px;background:#e5efdf;color:#386247}.field{margin-bottom:21px}label{display:block;font-weight:750;font-size:12px;margin-bottom:8px;color:#2b4b38}label b{color:#bf6748}input:not([type=radio]):not([type=checkbox]):not([type=file]),textarea{width:100%;padding:13px 14px;border:1px solid #ccd7ca;border-radius:10px;outline:none;min-height:47px;color:#263a2c;background:#fff;font-size:14px}input:focus,textarea:focus{border-color:#548866!important;box-shadow:0 0 0 3px #c2dfc2aa}textarea{resize:vertical;line-height:1.5}.login-card form>label{margin:18px 0 7px}.login-card form input{margin-bottom:10px}.action{background:#1e4b35;color:#fff;border:1px solid #1e4b35;display:flex;align-items:center;justify-content:space-between;border-radius:10px;font-weight:740;padding:15px 18px;width:100%;min-height:52px;font-size:14px}.action:hover{background:#2e6246}.action span{font-size:21px;font-weight:300}.action:disabled,.outline:disabled{cursor:wait;opacity:.6}.login-card .action{margin-top:17px}.fine-print{font-size:12px;color:#88978a;line-height:1.6;margin-top:15px}.login-card .fine-print{text-align:center}.tile-stack{display:grid;gap:12px}.tile{width:100%;display:flex;align-items:center;gap:16px;text-align:left;background:#fff;border:1px solid #e0e6dc;border-radius:17px;padding:17px 20px;min-height:103px;color:#203a29;box-shadow:0 6px 20px #204b2b07}.tile:hover{border-color:#9ab99c;transform:translateY(-1px)}.tile-icon{height:62px;width:62px;background:#e7f0e3;display:grid;place-items:center;color:#275a3a;font-size:32px;border-radius:13px;flex-shrink:0}.tile-main{flex:1;display:grid;gap:7px}.tile-main strong{font-size:16px;letter-spacing:-.02em}.tile-main small{font-size:12px;line-height:1.5;color:#718476}.tile-arrow{font-size:21px;color:#78957b}.admin-tile{background:#f8fbf6}.section-title{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:36px 0 14px}.section-title h2{margin:0;font-size:18px;letter-spacing:-.03em}.text-button,.back{border:0;background:transparent;color:#3b7952;font-size:12px;font-weight:720;padding:10px 0}.back{font-size:13px}.list-card{padding:12px 19px}.list-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 0;border-bottom:1px solid #edf0eb}.list-row:last-child{border:0}.list-row strong{font-size:13px;display:block;margin-bottom:4px}.list-row small{color:#77887b;font-size:11px;display:block;line-height:1.5}.list-row a{font-size:12px;color:#326d46;font-weight:740;text-decoration:none;white-space:nowrap}.muted{font-size:12px;color:#8c998d;line-height:1.5}.form-card{padding:30px}.form-mark{margin-bottom:21px;border-radius:9px;padding:11px 13px;background:#edf4e9;color:#436b50;font-size:11px;font-weight:760;letter-spacing:.05em}.duo{display:grid;grid-template-columns:1fr 1fr;gap:14px}.work-result{background:#e9f3e6;padding:16px 17px;border-radius:11px;margin:0 0 21px;display:flex;align-items:center;justify-content:space-between;gap:15px}.work-result span{font-size:12px;color:#567660;font-weight:720}.work-result span small{font-size:11px;color:#789681;display:block;font-weight:500;margin-top:4px}.work-result strong{font-size:20px;color:#255838;white-space:nowrap}.error-text{font-size:12px;color:#ae4a37;min-height:0;line-height:1.5}.error-text:empty{display:none}.radio-line{display:flex;flex-wrap:wrap;gap:12px}.radio-line label{border-radius:10px;border:1px solid #d8e1d5;background:#f6f9f4;padding:13px 15px;min-width:125px;margin:0;font-size:12px;display:flex;gap:8px;align-items:center}.radio-line input,.checkline input{accent-color:#2a5b3b}.checkline{display:flex;align-items:center;gap:10px;font-weight:640}.muted-note{font-size:12px;background:#f0f5ec;color:#607465;padding:13px;border-radius:10px;line-height:1.6;margin:0 0 20px}.upload{display:grid;gap:5px;justify-items:center;align-content:center;min-height:135px;border-radius:14px;border:1.5px dashed #9dbba0;background:#f7fbf5;cursor:pointer}.upload span{font-size:29px;color:#3f7954}.upload strong{font-size:13px}.upload small{font-size:10px;color:#7a907c;text-align:center;padding:0 15px}.hidden-input{position:absolute;width:1px;height:1px;opacity:0}.previews{display:flex;gap:9px;flex-wrap:wrap;margin-top:10px}.previews img{width:85px;height:85px;border-radius:10px;object-fit:cover}.admin-actions{display:flex;gap:10px}.outline{display:inline-flex;justify-content:center;align-items:center;text-decoration:none;gap:8px;padding:12px 14px;border:1px solid #c8d7c8;border-radius:10px;background:transparent;color:#345941;font-size:12px;font-weight:750}.outline.small{padding:10px 13px}.admin-actions>*{flex:1}.approval{display:flex;gap:7px;margin-top:6px;flex-wrap:wrap}.approval button{font-size:11px;border:1px solid #cedbcb;background:#f3f7f2;border-radius:7px;padding:6px 9px;color:#3c6f4c}.status{font-size:11px;color:#8c927f}.toast{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);width:min(94vw,520px);background:#204932;color:#fff;padding:17px 20px;border-radius:12px;box-shadow:0 13px 33px #1437244a;font-size:13px;line-height:1.5;z-index:3}footer{padding:24px 0 30px;text-align:center;color:#93a194;font-size:10px;letter-spacing:.04em}.footer-mid{margin:0 8px}@media(max-width:500px){.shell{padding:0 17px}.top{height:85px}.brand strong{font-size:22px}.brand small{font-size:8px}.brand-symbol{width:37px;height:37px;font-size:27px}.intro{padding:27px 0}.intro h1{font-size:38px}.form-card,.login-card{padding:20px}.tile{padding:14px;gap:12px}.tile-icon{width:54px;height:54px;font-size:27px}.tile-main strong{font-size:14px}.tile-main small{font-size:11px}.duo{gap:10px}.work-result strong{font-size:16px}.admin-actions{flex-wrap:wrap}}
@media(prefers-reduced-motion:no-preference){.tile{transition:transform .16s,border-color .16s}}


/* FreyTec Branding & Smartphone Layout Update (November 2026) */
html,body{max-width:100%}
.shell{width:100%;max-width:740px;min-width:0;padding:0 24px}
main,.view,.white-card,.form-card,.login-card,.tile-stack,.tile,.tile-main,.duo,.field{min-width:0;max-width:100%}
.top{height:auto;min-height:85px;padding:15px 0;position:relative;justify-content:center}
.top .brand-logo{display:flex;align-items:center;justify-content:center;gap:0;min-width:0}
.brand-logo img{display:block;width:176px;max-width:100%;height:auto;object-fit:contain}
.top #logout{position:absolute;right:0;top:50%;transform:translateY(-50%)}
.login-intro{padding-top:25px;padding-bottom:28px}
.customer-brand{display:flex;justify-content:center;align-items:center;max-width:100%;padding:4px 0 24px;margin:0 auto 25px;border-bottom:1px solid #d6ddcf}
.customer-brand img{display:block;width:158px;max-width:50%;height:auto;object-fit:contain}
.login-card{max-width:520px;margin:0 auto;padding:28px}
.form-card{padding:26px}
.duo{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.field input:not([type=radio]):not([type=checkbox]):not([type=file]),.field textarea,.login-card input{display:block;min-width:0;max-width:100%}
.list-row>div{min-width:0;overflow-wrap:anywhere}
.tile-main{min-width:0;overflow-wrap:anywhere}
@media(max-width:680px){
 .shell{padding:0 16px}
 .top{min-height:76px;padding:12px 0}
 .brand-logo img{width:155px}
 .login-intro{padding-top:18px;padding-bottom:23px}
 .customer-brand{padding:0 0 20px;margin:0 auto 22px}
 .customer-brand img{width:142px;max-width:54%}
 .duo{grid-template-columns:minmax(0,1fr);gap:0}
 .form-card,.login-card{padding:18px 16px}
 .white-card,.tile{width:100%}
 .field input:not([type=radio]):not([type=checkbox]):not([type=file]),.field textarea,.login-card input{font-size:16px}
 .form-mark{overflow-wrap:anywhere}
 .list-row{flex-wrap:wrap;align-items:flex-start}
}
@media(max-width:430px){
 .top{justify-content:flex-start}
 .brand-logo img{width:140px}
 .top #logout{position:static;transform:none;margin-left:auto}
 .customer-brand img{width:132px}
 .intro h1{font-size:clamp(31px,8.6vw,37px)}
 .tile{padding:13px;gap:10px}
 .tile-icon{width:46px;height:46px;font-size:25px}
 .tile-main strong{font-size:13px}
 .tile-main small{font-size:11px}
 .tile-arrow{font-size:18px}
 .work-result{flex-wrap:wrap;gap:8px}
 .work-result strong{white-space:normal}
 .admin-actions{flex-direction:column}
}
@media(max-width:350px){
 .shell{padding:0 10px}
 .brand-logo img{width:127px}
 .top #logout{padding:9px 8px}
 .tile-icon{width:42px;height:42px}
}