@import url('https://fonts.googleapis.com/css2?family=Inter:wght@500;600;700;800;900&family=Noto+Sans+Thai:wght@500;600;700;800;900&display=swap');
:root{--blue:#0788ff;--cyan:#13c4d7;--violet:#7165ff;--ink:#06142d;--muted:#66758f;--line:#c9e5ff;--glass:rgba(255,255,255,.84);--shadow:0 30px 90px rgba(0,92,190,.13);--r:30px}*{box-sizing:border-box}body{margin:0;font-family:Inter,'Noto Sans Thai',system-ui,sans-serif;color:var(--ink);font-weight:800;background:linear-gradient(120deg,#eaf7ff,#fbfdff 48%,#f1eaff)}a{text-decoration:none;color:inherit}.grid-bg{min-height:100vh;background-image:linear-gradient(rgba(18,133,255,.085) 1px,transparent 1px),linear-gradient(90deg,rgba(18,133,255,.085) 1px,transparent 1px);background-size:38px 38px}.topbar{height:82px;background:rgba(255,255,255,.86);border-bottom:1px solid #d6eaff;display:flex;justify-content:space-between;align-items:center;padding:10px 7vw;position:sticky;top:0;z-index:50;backdrop-filter:blur(22px)}.brand{display:flex;align-items:center;gap:14px;font-size:28px;font-weight:1000;letter-spacing:-1px}.logo{width:54px;height:54px;border-radius:20px;border:1px solid var(--line);background:linear-gradient(145deg,#fff,#ecf7ff);display:grid;place-items:center;box-shadow:0 14px 32px rgba(7,136,255,.12)}.grad{background:linear-gradient(135deg,var(--blue),var(--cyan) 58%,var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent}.nav{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.nav a,.btn,button{border:1px solid #cfe5ff;border-radius:18px;background:rgba(255,255,255,.82);padding:13px 22px;font:inherit;font-weight:950;color:#07152d;box-shadow:0 10px 22px rgba(7,136,255,.05);cursor:pointer;transition:.22s ease}.nav a:hover,.btn:hover,button:hover{transform:translateY(-2px);border-color:#89caff;box-shadow:0 16px 30px rgba(7,136,255,.14)}.primary,.tab.active{background:linear-gradient(135deg,var(--blue),var(--cyan));border-color:transparent;color:#00162c}.wrap{max-width:1460px;margin:54px auto;padding:0 22px}.hero,.panel,.glass{border:1px solid #8fcdff;border-radius:var(--r);background:linear-gradient(130deg,rgba(255,255,255,.96),rgba(226,251,255,.78));box-shadow:var(--shadow);padding:44px}.hero{display:grid;grid-template-columns:1.05fr .95fr;gap:42px;align-items:center}.tag,.badge{display:inline-flex;align-items:center;gap:8px;border-radius:999px;background:linear-gradient(135deg,var(--blue),var(--cyan));padding:10px 17px;font-weight:1000;color:#06142d}.badge.soft{background:#e0fbf4;color:#009b84}.title{font-size:68px;line-height:.98;margin:22px 0;font-weight:1000;letter-spacing:-2px}.subtitle,.muted{color:var(--muted);font-size:18px;line-height:1.75}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{border:1px solid #cfe6ff;border-radius:24px;background:var(--glass);padding:24px;position:relative;overflow:hidden}.card:after{content:'';position:absolute;right:-45px;bottom:-55px;width:170px;height:170px;background:radial-gradient(circle,rgba(18,196,215,.18),transparent 70%)}.iconbox{width:55px;height:55px;border-radius:19px;background:#dcecff;display:grid;place-items:center;font-size:25px;margin-bottom:14px}.formgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.formgrid.three{grid-template-columns:repeat(3,1fr)}.field{margin:12px 0}label{display:block;margin-bottom:8px;font-weight:1000}input,select,textarea{width:100%;border:1px solid #cde5ff;border-radius:17px;background:rgba(255,255,255,.93);padding:15px 16px;font:inherit;color:#07152d;outline:0}textarea{min-height:130px;resize:vertical}input:focus,select:focus,textarea:focus{border-color:#39aaff;box-shadow:0 0 0 5px rgba(7,136,255,.1)}.tabs{display:flex;gap:12px;flex-wrap:wrap;margin:22px 0}.hidden{display:none!important}.layout{display:grid;grid-template-columns:1fr 420px;gap:24px;align-items:start}.preview-stick{position:sticky;top:104px}.paper{background:white;border:1px solid #d7e5f4;border-radius:18px;box-shadow:0 22px 60px rgba(0,0,0,.08);padding:22px;font-family:'Noto Sans Thai',serif;font-weight:600;font-size:12px;color:#111;cursor:zoom-in;max-height:650px;overflow:auto}.paper h4{text-align:center;margin:3px}.paper-table{width:100%;border-collapse:collapse;margin-top:8px}.paper-table th,.paper-table td{border:1px solid #333;padding:5px;vertical-align:top}.paper-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}.paper-sign{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;text-align:center;margin-top:20px}.table{width:100%;border-collapse:separate;border-spacing:0 12px}.table th{text-align:left;color:#5e6e86}.table th,.table td{padding:14px}.table tr:not(:first-child){background:rgba(255,255,255,.82);box-shadow:0 8px 24px rgba(0,92,190,.05)}.table td:first-child{border-radius:16px 0 0 16px}.table td:last-child{border-radius:0 16px 16px 0}.notice{padding:14px 16px;border:1px solid #cde5ff;border-radius:16px;background:#f2f9ff;color:#53627a}.danger{background:#fff1f1;border-color:#ffc9c9;color:#a22424}.ok{background:#edfff7;border-color:#b6f1d7;color:#047857}.settings-grid{display:grid;grid-template-columns:285px 1fr;gap:24px}.side-menu{position:sticky;top:104px;display:grid;gap:12px}.side-menu a{border:1px solid #cfe5ff;border-radius:18px;background:rgba(255,255,255,.84);padding:17px 20px;font-weight:1000}.section-title{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:22px}.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.modal{position:fixed;inset:0;background:rgba(3,12,30,.72);display:none;align-items:center;justify-content:center;z-index:200;padding:24px}.modal.show{display:flex}.modal .paper{max-width:900px;max-height:92vh;cursor:auto}.ai-model-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.divider{height:1px;background:#d7eaff;margin:26px 0}@media(max-width:1100px){.hero,.layout,.settings-grid{grid-template-columns:1fr}.preview-stick,.side-menu{position:static}.title{font-size:48px}.topbar{height:auto}.cards,.stat-grid,.formgrid,.formgrid.three{grid-template-columns:1fr}.nav{justify-content:flex-end}.paper{max-height:none}}
.blueprint{border:1px solid #8dcbff;border-radius:26px;padding:24px;background:rgba(239,250,255,.7)}.bp-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.bp{border:2px solid #8dcbff;border-radius:19px;min-height:98px;display:grid;place-items:center;font-weight:1000;background:rgba(255,255,255,.4)}.code{background:#071326;color:#68ffad;border-radius:18px;padding:18px;font-family:ui-monospace,Consolas,monospace;font-weight:900}.auth{max-width:580px;margin:64px auto}.pill{display:inline-flex;align-items:center;border-radius:999px;padding:10px 16px}.mini-help{font-size:13px;color:#68778f}
/* v1.0.5 Professional UX Upgrade */
.pro-hero{position:relative;overflow:hidden}.pro-hero:before{content:'';position:absolute;inset:-2px;background:radial-gradient(circle at 78% 12%,rgba(19,196,215,.18),transparent 30%),radial-gradient(circle at 16% 92%,rgba(7,136,255,.16),transparent 26%);pointer-events:none}.hero-copy,.engineering-console{position:relative;z-index:1}.pulse-dot{box-shadow:0 0 0 0 rgba(7,136,255,.35);animation:pulse 2.2s infinite}.feature-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:26px}.feature-tile{border:1px solid #cfe6ff;border-radius:24px;background:rgba(255,255,255,.72);padding:22px;min-height:150px;display:flex;flex-direction:column;gap:10px;transition:.25s ease;position:relative;overflow:hidden}.feature-tile:hover{transform:translateY(-7px) scale(1.015);box-shadow:0 24px 55px rgba(7,136,255,.16)}.feature-tile span{width:56px;height:56px;border-radius:20px;background:#dfeeff;display:grid;place-items:center;font-size:24px}.feature-tile small{color:var(--muted);line-height:1.55;font-size:16px}.engineering-console{border:1px solid #8fcdff;border-radius:30px;background:linear-gradient(145deg,rgba(255,255,255,.78),rgba(227,249,255,.62));padding:26px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.45),0 35px 90px rgba(0,92,190,.14)}.console-top{display:flex;justify-content:space-between;align-items:center;font-size:24px;margin-bottom:18px}.console-top span{background:#dcfff4;color:#008b7b;border-radius:999px;padding:10px 16px;font-size:16px}.civil-scene{height:280px;border:2px solid #8dcbff;border-radius:24px;background:linear-gradient(180deg,#f3fcff,#e4f8ff);position:relative;overflow:hidden}.civil-scene:before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(7,136,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(7,136,255,.08) 1px,transparent 1px);background-size:28px 28px}.building{position:absolute;right:56px;bottom:28px;width:180px;height:150px;border:3px solid #0794ff;border-bottom-width:8px;border-radius:18px 18px 8px 8px;background:rgba(255,255,255,.65);display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:18px}.building i{border:2px solid #8dccff;border-radius:8px;background:#fff;animation:windowGlow 3s infinite}.tower-crane{position:absolute;left:34px;bottom:26px;width:260px;height:205px}.mast{position:absolute;left:62px;bottom:0;width:24px;height:190px;background:repeating-linear-gradient(45deg,#0794ff 0 8px,#13c4d7 8px 16px);border-radius:8px}.jib{position:absolute;left:24px;top:16px;width:220px;height:20px;background:linear-gradient(90deg,#0794ff,#13c4d7);border-radius:999px;transform-origin:72px center;animation:craneSwing 4.6s ease-in-out infinite}.counter{position:absolute;left:18px;top:6px;width:60px;height:38px;border-radius:12px;background:#06142d}.hook-line{position:absolute;left:205px;top:34px;width:3px;height:86px;background:#06142d;animation:hookMove 4.6s ease-in-out infinite}.hook{position:absolute;left:193px;top:116px;color:#06142d;animation:hookMove 4.6s ease-in-out infinite}.scan-line{position:absolute;left:-30%;top:0;width:28%;height:100%;background:linear-gradient(90deg,transparent,rgba(19,196,215,.23),transparent);animation:scan 3.2s infinite}.metric-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:14px}.metric-grid div{border:1px solid #cfe6ff;border-radius:18px;background:rgba(255,255,255,.72);padding:15px}.metric-grid small{display:block;color:#63738e}.metric-grid b{font-size:18px}.code-stream{margin-top:14px;background:#071326;color:#68ffad;border-radius:18px;padding:18px;font-family:ui-monospace,Consolas,monospace;min-height:104px;overflow:hidden}.code-stream span{display:block;animation:codeRise 6s linear infinite}.code-stream span:nth-child(2){animation-delay:.7s}.code-stream span:nth-child(3){animation-delay:1.4s}.profile-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:24px}.user-chip{border:1px solid #cfe6ff;background:rgba(255,255,255,.78);border-radius:24px;padding:16px 22px;display:grid;gap:3px}.user-chip small{color:var(--muted)}.member-list{display:grid;gap:18px}.member-card{border:1px solid #cfe6ff;border-radius:26px;background:rgba(255,255,255,.82);padding:22px;box-shadow:0 14px 36px rgba(0,92,190,.07)}.member-head{display:flex;align-items:center;gap:16px;margin-bottom:16px}.member-head p{margin:4px 0 0;color:var(--muted)}.avatar{width:54px;height:54px;border-radius:18px;background:linear-gradient(135deg,var(--blue),var(--cyan));display:grid;place-items:center;color:#06142d;font-weight:1000;font-size:22px}.switch{margin-left:auto;display:flex;align-items:center;gap:10px}.switch input{width:auto}@keyframes pulse{70%{box-shadow:0 0 0 14px rgba(7,136,255,0)}}@keyframes craneSwing{0%,100%{transform:rotate(-1deg)}50%{transform:rotate(4deg)}}@keyframes hookMove{0%,100%{transform:translateX(-4px)}50%{transform:translateX(20px)}}@keyframes scan{to{left:105%}}@keyframes windowGlow{0%,100%{box-shadow:none}50%{box-shadow:0 0 18px rgba(19,196,215,.45)}}@keyframes codeRise{0%{transform:translateY(18px);opacity:0}18%,82%{transform:translateY(0);opacity:1}100%{transform:translateY(-18px);opacity:0}}@media(max-width:1100px){.feature-tiles,.profile-grid,.metric-grid{grid-template-columns:1fr}.civil-scene{height:230px}.building{right:20px;width:140px}.tower-crane{left:10px;transform:scale(.82);transform-origin:left bottom}}


/* v1.0.5 Exact Template Preview + Export UX */
.template-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:12px 0 18px}.template-note{border:1px solid #b9dcff;background:linear-gradient(135deg,#f7fcff,#eaffff);border-radius:18px;padding:14px 18px;color:#53627a;font-weight:800}.exact-preview-wrap{position:relative;background:#fff;border:1px solid #b7c9da;border-radius:16px;padding:10px;box-shadow:0 22px 60px rgba(0,0,0,.08);max-height:720px;overflow:auto}.exact-sheet{position:relative;width:100%;max-width:760px;margin:0 auto;background:#fff}.exact-sheet img.template-img{display:block;width:100%;height:auto;border-radius:4px}.exact-overlay{position:absolute;inset:0;pointer-events:none;font-family:'TH Sarabun New','Sarabun','Noto Sans Thai',sans-serif;color:#000}.ov{position:absolute;font-weight:600;line-height:1;white-space:nowrap;font-size:clamp(10px,1.25vw,17px)}.ov-date{top:14.6%;right:13.5%}.ov-drp{top:18.8%;right:19.0%}.ov-weather{top:22.45%;left:18.2%;font-size:clamp(12px,1.4vw,18px)}.ov-total{top:54.15%;left:24.0%}.ov-reporter{top:76.4%;left:21.5%}.ov-reportdate{top:82.4%;left:21.5%}.ov-job{left:18.2%;font-size:clamp(8px,1.05vw,13px);max-width:30%;overflow:hidden;text-overflow:ellipsis}.ov-jw{left:77.6%;font-size:clamp(8px,1.05vw,13px)}.ov-job-1{top:43.5%}.ov-job-2{top:45.6%}.ov-job-3{top:47.65%}.ov-job-4{top:49.75%}.ov-jw-1{top:43.5%}.ov-jw-2{top:45.6%}.ov-jw-3{top:47.65%}.ov-jw-4{top:49.75%}.export-grade{border:1px solid #b8dcff;border-radius:24px;padding:18px;background:rgba(255,255,255,.82);display:grid;grid-template-columns:64px 1fr;gap:16px;align-items:center}.export-grade .seal{width:64px;height:64px;border-radius:22px;display:grid;place-items:center;background:linear-gradient(135deg,#dff0ff,#dcfff4);font-size:30px}.checklist-line{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:14px}.check-pill{border:1px solid #cce4ff;background:#fff;border-radius:14px;padding:11px 12px;font-weight:900;text-align:center}.paper.template-exact{padding:0;border:0;background:transparent;box-shadow:none;max-height:none}.modal .exact-preview-wrap{max-height:90vh}.modal .exact-sheet{max-width:850px}@media(max-width:900px){.checklist-line{grid-template-columns:1fr 1fr}.ov{font-size:10px}.layout{grid-template-columns:1fr}.preview-stick{position:static}}
/* v1.0.6 project/report management fixes */
.filterbar{display:flex;gap:14px;align-items:center;margin:18px 0 24px}.filterbar select{max-width:420px}.row-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.btn.danger,button.danger{border-color:#ffd0d0;background:#fff1f1;color:#b42318}.project-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.project-card{border:1px solid #cfe6ff;border-radius:22px;background:rgba(255,255,255,.82);padding:20px}.project-card small{display:block;color:#66758f;margin-top:5px}.preview-full{background:#fff;border-radius:22px;max-width:96vw;max-height:96vh;overflow:auto;padding:18px}.preview-full .exact-preview-wrap{max-height:none;box-shadow:none;border:0}.preview-full .exact-sheet{max-width:980px}.report-editor h2{margin-top:32px}.mode-tabs{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:18px}.field label{display:block;margin-bottom:8px}.actions{display:flex;gap:10px;flex-wrap:wrap}.template-img{image-rendering:auto}
@media(max-width:900px){.project-grid{grid-template-columns:1fr}.row-actions{display:grid}.filterbar{display:block}.filterbar select{margin-top:10px}}

/* v1.0.7 real-template preview: no overlay drift */
.real-template .exact-sheet{max-width:760px}.real-template .template-img{width:100%;height:auto;display:block}.pdf-frame{width:100%;height:720px;border:1px solid #cfe6ff;border-radius:18px;background:#fff}.preview-stick .panel{overflow:hidden}.export-warning{border:1px solid #ffd3a6;background:#fff8ed;color:#8a4b00;border-radius:18px;padding:18px;font-weight:900;line-height:1.7}.template-note b{color:#06142d}@media(max-width:1100px){.pdf-frame{height:540px}}