.pilot-wrap{max-width:1160px}.pilot-grid{display:grid;grid-template-columns:minmax(300px,.9fr) minmax(0,1.2fr);gap:22px}.pilot-preview{width:100%;height:auto;display:block;border:1px solid var(--line);touch-action:none}.pilot-notice{margin-bottom:22px}.pilot-form label{display:block;font-size:13px;margin:14px 0 6px}.pilot-form input:not([type=checkbox]):not([type=file]),.pilot-form select,.pilot-form textarea{width:100%;padding:11px;border:1px solid #cbdadf;border-radius:8px;font:inherit}.pilot-form textarea{min-height:85px}.pilot-form .check{display:flex;align-items:flex-start;gap:8px;line-height:1.6}.pilot-form .check input{margin-top:4px}.pilot-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:18px}.pilot-auth{max-width:450px;margin:35px auto}.pilot-file{overflow-wrap:anywhere;font-size:12px;color:#607487}.pilot-status{white-space:pre-wrap;line-height:1.8}.pilot-results{margin-top:22px}.pilot-history button{margin-top:8px}.pilot-grid .panel{min-width:0}.pilot-preview-tools{margin:12px 0}.pilot-point-list{font-size:12px;line-height:1.8;word-break:break-word}.pilot-title{margin:8px 0 14px;font-size:28px}@media(max-width:760px){.pilot-grid{grid-template-columns:1fr}.pilot-title{font-size:24px}.header .brand{font-size:20px}.pilot-wrap{padding-bottom:40px}}

.pilot-form input[type=file]{display:none}

.measurement-details{margin:18px 0;padding:16px 20px;background:#edf5f7;border:1px solid #d3e4e8;border-radius:12px}
.measurement-details h2{margin:0 0 12px;font-size:18px}
.measurement-details dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin:0}
.measurement-details dt{color:#526978;font-size:13px}
.measurement-details dd{margin:3px 0 0;font-weight:600;overflow-wrap:anywhere}

.pilot-wrap .report-new{margin-top:20px}.pilot-wrap .report-section{margin:16px 0;padding:16px;border:1px solid #cbd5e1;border-radius:12px}.pilot-wrap .report-section label{display:block;margin:10px 0}.pilot-wrap input:not([type=checkbox]),.pilot-wrap select,.pilot-wrap textarea{max-width:100%;min-width:0}.pilot-wrap .report-details dd{overflow-wrap:anywhere}.header .nav{flex-wrap:wrap}#quota-strip{overflow-wrap:anywhere}

@font-face {
 font-family: "IBM Plex Sans Thai";
 src: url("/fonts/IBMPlexSansThai-Regular.ttf") format("truetype");
 font-weight: 400;
 font-display: swap;
}
@font-face {
 font-family: "IBM Plex Sans Thai";
 src: url("/fonts/IBMPlexSansThai-Medium.ttf") format("truetype");
 font-weight: 500;
 font-display: swap;
}
@font-face {
 font-family: "IBM Plex Sans Thai";
 src: url("/fonts/IBMPlexSansThai-SemiBold.ttf") format("truetype");
 font-weight: 600;
 font-display: swap;
}
@font-face {
 font-family: "IBM Plex Sans Thai";
 src: url("/fonts/IBMPlexSansThai-Bold.ttf") format("truetype");
 font-weight: 700;
 font-display: swap;
}

:root {
 --portal-navy: #062744;
 --portal-surface: #f4f4ef;
 --portal-card: #fffefa;
 --portal-accent: #ffc400;
 --portal-notice: #fff2c6;
 --portal-ink: #082944;
 --portal-focus: #164b83;
 --muted: #42566a;
 --line: #cbcfc9;
 --teal: var(--portal-ink);
 --shadow: 0 6px 22px #0627440d;
 font-family: "IBM Plex Sans Thai", Tahoma, sans-serif;
 color: var(--portal-ink);
 background: var(--portal-surface);
 color-scheme: light;
}

.header {
 background: var(--portal-navy);
 color: var(--portal-card);
 border-color: var(--portal-navy);
 gap: clamp(12px, 3vw, 36px);
 padding-inline: max(20px, calc((100vw - 1160px) / 2));
}
.header .brand, .header .nav button { color: var(--portal-card); }
.header .nav button:hover { background: #ffffff20; }
.header .header-end button {
 background: transparent;
 color: var(--portal-card);
 border-color: #ffffff70;
}
.header .nav { border-color: #ffffff33; }
.pill.amber { background: var(--portal-notice); color: var(--portal-ink); }
.panel, button, .pilot-form :is(input,select,textarea) { background: var(--portal-card); }
.primary, .download-row .download-primary {
 background: var(--portal-accent);
 color: var(--portal-ink);
 border-color: var(--portal-accent);
}
.primary:not(:disabled):hover, .download-row .download-primary:hover { background: #edb600; }
.pilot-actions button, .header button, .download-row a { min-height: 44px; }
.notice, .result-number { background: var(--portal-notice); color: var(--portal-ink); }
.notice { border-color: #e4cb76; font-size: 14px; }
.pilot-title { line-height: 1.4; }
.pilot-form label { font-size: 14px; font-weight: 500; }
.pilot-form :is(input,select,textarea) { accent-color: var(--portal-navy); }
.hint, .pilot-file, .upload small, .upload>span:not(.upload-icon), .measurement-details dt {
 color: var(--muted);
 font-size: 13px;
}
.upload { background: var(--portal-surface); border-color: #7a8990; }
.upload:hover, .upload.dragging { background: var(--portal-notice); border-color: var(--portal-navy); }
.upload strong { font-weight: 700; }
.measurement-details { background: var(--portal-surface); border-color: var(--line); }
.measurement-details dl { grid-template-columns: repeat(auto-fit,minmax(min(100%,190px),1fr)); }
.result-number strong { color: var(--portal-ink); overflow-wrap: anywhere; }
.download-row a { border-color: #7a8990; font-weight: 600; }
.download-row a:hover { background: var(--portal-notice); }
.pilot-wrap :is(button,a,input,select,textarea,[tabindex]):focus-visible {
 outline: 3px solid var(--portal-focus);
 outline-offset: 2px;
}
.header button:focus-visible { outline-color: var(--portal-accent); }

@media (max-width: 420px) {
 .header { padding-inline: 15px; }
 .header .brand { gap: 6px; }
 .header .brand .pill { padding-inline: 8px; }
 .header-end button { padding-inline: 10px; }
 .area-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
 .pilot-auth { margin-top: 16px; }
}
