@import url("https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css");@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css");@import url("https://fonts.googleapis.com/css2?family=Sarabun:wght@300;400;500;600;700;800&display=swap");*{box-sizing:border-box}*,body,html{margin:0;padding:0}body,html{width:100%;height:100%;overflow-x:hidden;font-family:Sarabun,Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}:root{--btn-radius:10px;--btn-font-size:16px;--btn-padding-y:10px;--btn-padding-x:16px;--btn-primary-bg:#2563eb;--btn-primary-color:#fff;--btn-primary-hover:#1e40af;--btn-shadow:0 8px 20px rgba(2,6,23,.12);--btn-shadow-hover:0 18px 36px rgba(2,6,23,.18);--btn-transition:180ms cubic-bezier(.2,.8,.2,1)}.k-btn{display:inline-flex;align-items:center;gap:10px;padding:var(--btn-padding-y) var(--btn-padding-x);font-size:var(--btn-font-size);border-radius:var(--btn-radius);border:0;background:linear-gradient(180deg,#fff,#f3f6ff 60%);color:#0b1220;cursor:pointer;box-shadow:0 18px 40px rgba(2,6,23,.18),inset 0 6px 18px rgba(2,6,23,.08);border:1px solid rgba(2,6,23,.06);position:relative;overflow:hidden;transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s ease,background .15s ease;will-change:transform,box-shadow;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;-webkit-backface-visibility:hidden;backface-visibility:hidden;transform:translateZ(0)}.k-btn:hover{animation:btn-bounce .3s both;transform:translateY(-10px) translateZ(18px);box-shadow:0 30px 70px rgba(2,6,23,.2),inset 0 10px 24px rgba(2,6,23,.1)}@keyframes btn-bounce{0%{transform:translateY(0)}35%{transform:translateY(-10px)}60%{transform:translateY(-4px)}to{transform:translateY(-6px)}}.k-btn:active{transform:translateY(-4px) translateZ(8px);box-shadow:0 10px 26px rgba(2,6,23,.16),inset 0 4px 10px rgba(2,6,23,.06)}.k-btn:before{content:"";position:absolute;inset:0;background:hsla(0,0%,100%,.06);opacity:0;transition:opacity .18s ease;pointer-events:none}.k-btn:active:before{opacity:1;transition:opacity .26s ease-in-out}.k-btn.clicked{transform:translateY(-6px) translateZ(12px);box-shadow:0 32px 80px rgba(2,6,23,.22),inset 0 8px 22px rgba(2,6,23,.1)}.k-btn.clicked:before{opacity:1}.k-btn.clicked,.k-btn:active,.k-btn:focus,.link-button{cursor:pointer!important}.k-btn:focus{outline:3px solid rgba(37,99,235,.18);outline-offset:4px;box-shadow:0 12px 34px rgba(37,99,235,.09),inset 0 6px 14px rgba(2,6,23,.06)}.k-btn-primary{background:linear-gradient(180deg,#3b82f6,#2563eb 60%,#1e40af);color:var(--btn-primary-color);border:1px solid rgba(13,82,255,.14);box-shadow:0 18px 50px rgba(37,99,235,.22),inset 0 6px 18px rgba(2,6,23,.06);text-shadow:0 1px 0 rgba(0,0,0,.12);transition:transform var(--btn-transition),box-shadow var(--btn-transition),filter var(--btn-transition)}.k-btn-primary:hover{transform:translateY(-10px) translateZ(20px);box-shadow:0 36px 80px rgba(37,99,235,.28),inset 0 6px 22px rgba(2,6,23,.08);filter:brightness(1.03)}.k-btn-primary:active{transform:translateY(-4px) translateZ(10px) scale(.996);box-shadow:0 12px 34px rgba(37,99,235,.18),inset 0 4px 12px rgba(2,6,23,.06);filter:brightness(.98)}.k-btn-primary:after{content:"";position:absolute;left:6px;right:6px;top:6px;height:12px;border-radius:8px;background:linear-gradient(180deg,hsla(0,0%,100%,.22),hsla(0,0%,100%,0));pointer-events:none;opacity:.95;mix-blend-mode:overlay}.k-btn-ghost{background:linear-gradient(180deg,#fbfdff,#f8fafc);color:#0f172a;border:1px solid rgba(2,6,23,.06);box-shadow:0 8px 22px rgba(2,6,23,.06)}.k-btn:after{content:"";position:absolute;left:6px;right:6px;top:6px;height:8px;border-radius:8px;background:linear-gradient(180deg,hsla(0,0%,100%,.6),hsla(0,0%,100%,0));pointer-events:none;opacity:.85;transform:translateZ(30px)}.link-button{cursor:pointer}.crisp-text{-webkit-font-smoothing:antialiased!important;-moz-osx-font-smoothing:grayscale!important;text-rendering:geometricPrecision!important;-webkit-backface-visibility:hidden!important;backface-visibility:hidden!important;transform:translateZ(0)!important;filter:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}@media (max-width:560px){.k-btn{font-size:15px;padding:8px 12px}}.page-shell{padding:28px;min-height:100vh;background:linear-gradient(180deg,#f8fafc,#eef2ff 60%);perspective:1200px;-webkit-font-smoothing:antialiased}.card{background:linear-gradient(180deg,#fff,#fbfdff);border-radius:12px;border:1px solid rgba(2,6,23,.06);box-shadow:0 6px 20px rgba(2,6,23,.06),0 2px 6px rgba(2,6,23,.04);transition:transform .26s cubic-bezier(.2,.9,.2,1),box-shadow .26s ease,filter .26s ease;transform-style:preserve-3d;will-change:transform,box-shadow;padding:14px}.card:hover{transform:translateY(-12px) translateZ(28px);box-shadow:0 30px 60px rgba(2,6,23,.12),0 8px 18px rgba(2,6,23,.06)}.machine-card{flex-direction:column;padding:14px 16px;min-height:160px}.machine-card,.machine-card-header{display:flex;justify-content:space-between}.machine-card-header{align-items:center;gap:12px}.machine-name{font-size:18px;font-weight:800;color:#0f172a}.machine-sub{font-size:13px;color:#475569;margin-top:4px}.status-pill{padding:6px 10px;border-radius:999px;font-weight:700;font-size:13px;display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(2,6,23,.04)}.status-pill.ok{background:linear-gradient(180deg,#ecfdf5,#d1fae5);color:#065f46}.status-pill.warn{background:linear-gradient(180deg,#fff7ed,#ffedd5);color:#92400e}.machine-info-row{display:flex;gap:12px;margin-top:12px}.machine-info{flex:1 1}.machine-info .label{font-size:13px;color:#475569}.machine-info .value{font-weight:800;font-size:16px;color:#0f172a}.machine-actions{display:flex;gap:8px;margin-top:12px}.machine-action-btn{flex:1 1;padding:8px 10px;border-radius:8px;font-size:15px}.machine-action-btn.small{flex:0 0 auto;padding:8px 12px}@media (max-width:720px){.machine-card{min-width:220px;max-width:100%}.machine-name{font-size:16px}}.service-card{width:120px;text-align:center;padding:12px}.card:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(180deg,hsla(0,0%,100%,.5),hsla(0,0%,100%,0));transform:translateZ(-1px) scale(1.02);opacity:.6}.controls label,.controls select{font-size:15px}.crisp-text button,.crisp-text input,.crisp-text select{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;transform:translateZ(0)}.k-input{width:100%;padding:10px 12px;border-radius:8px;border:1px solid rgba(2,6,23,.12);background:linear-gradient(180deg,#fff,#fbfdff);box-shadow:inset 0 1px 0 hsla(0,0%,100%,.6);font-size:17px;color:#0f172a;max-width:520px}.k-input.narrow{max-width:360px}.k-input:focus{outline:none;border-color:rgba(37,99,235,.9);box-shadow:0 6px 20px rgba(37,99,235,.06)}.k-table-wrapper{overflow:auto;border:1px solid #eef2f8;border-radius:10px;background:#fff;padding:10px}.k-table{width:100%;border-collapse:collapse;min-width:920px;font-size:14px}.k-table td,.k-table th{padding:10px 12px;border:1px solid #f1f5f9}.k-table thead th{background:linear-gradient(180deg,#f8fafc,#f1f5f9);font-weight:600;color:#0f172a}.k-table tbody tr:hover{background:rgba(37,99,235,.02)}.search-controls{display:flex;gap:8px;align-items:center}.search-controls .k-btn{padding:6px 10px}.k-input.large,.search-controls .k-input,.search-controls select{font-size:18px}.controls-right{display:flex;gap:8px;align-items:center}.data-card{padding:14px;border-radius:10px;background:linear-gradient(180deg,#fff,#fbfdff);border:1px solid #eef2f8;box-shadow:0 6px 18px rgba(2,6,23,.03)}.controls-card{margin-top:8px;padding:10px;border-radius:10px;background:linear-gradient(180deg,#fbfdff,#fff);border:1px solid rgba(2,6,23,.06);box-shadow:0 8px 20px rgba(2,6,23,.04)}.controls-card .k-input{min-width:220px;max-width:420px}.controls-card .k-btn{flex:0 0 auto}.clickable-status{cursor:pointer;color:#0f172a}@media (max-width:1000px){.k-table{min-width:720px;font-size:13px}}:root{--depth-shadow-1:0 10px 30px rgba(2,6,23,.14);--depth-shadow-2:0 20px 60px rgba(2,6,23,.18);--depth-shadow-3:0 6px 18px rgba(2,6,23,.08);--edge-color-strong:rgba(2,6,23,.08)}.page-shell{perspective:1400px}.k-btn{box-shadow:var(--depth-shadow-1);transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s ease,background-color .12s ease}.k-btn:hover{transform:translateY(-8px) translateZ(12px);box-shadow:var(--depth-shadow-2)}.k-btn:active{transform:translateY(-4px) translateZ(6px)}.k-btn-primary{box-shadow:0 18px 50px rgba(37,99,235,.22)}.card,.data-card{transform-style:preserve-3d;box-shadow:0 22px 60px rgba(2,6,23,.1),0 8px 24px rgba(2,6,23,.06);border:1px solid var(--edge-color-strong)}.card:hover,.data-card:hover{transform:translateY(-22px) translateZ(40px);box-shadow:0 40px 110px rgba(2,6,23,.16),0 14px 40px rgba(2,6,23,.08)}.k-table-wrapper{box-shadow:0 18px 48px rgba(2,6,23,.08);border:1px solid rgba(2,6,23,.06)}.k-table td,.k-table th{border-color:rgba(2,6,23,.06)}.k-table thead th{border-bottom:2px solid rgba(2,6,23,.07)}.k-table tbody tr:hover{background:rgba(2,6,23,.03)}.k-input:focus{box-shadow:0 12px 32px rgba(37,99,235,.06);border-color:rgba(37,99,235,.95)}.found-row{border-radius:8px;padding:8px;border:1px solid rgba(2,6,23,.06);background:#fff;box-shadow:0 8px 20px rgba(2,6,23,.04);font-size:18px;min-width:220px;display:inline-block}.found-row-device,.found-row-field,.found-row-time{display:block}.found-row-time{color:#0f172a;font-weight:600}.found-row-device{color:#111827;margin-top:4px}.found-row-field{color:#374151;margin-top:4px;font-weight:500}.power-section-heading{font-size:20px;font-weight:700;color:#0f172a;margin:0 0 8px}.power-group-header{font-size:18px;font-weight:700;color:#0f172a}.form-row{margin-bottom:16px}.form-row label{display:block;margin-bottom:8px;font-weight:600;color:#111827}.hero{background:linear-gradient(135deg,#1e3a8a,#3b82f6);color:#fff;min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:40px 20px;position:relative;overflow:hidden}.hero:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:url('data:image/svg+xml,<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg"><circle cx="50" cy="50" r="2" fill="rgba(255,255,255,0.1)"/></svg>');opacity:.3}.logo-hero{width:450px;height:220px;margin:0 auto 30px;display:flex;align-items:center;justify-content:center;padding:20px;background:#fff;border-radius:25px;box-shadow:0 8px 32px rgba(0,0,0,.15);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid hsla(0,0%,100%,.3);transition:all .3s ease}.logo-hero:hover{transform:translateY(-3px);box-shadow:0 12px 40px rgba(0,0,0,.2)}.emoji-hero{width:120px;height:120px;margin:0 auto 20px;background:hsla(0,0%,100%,.1);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:60px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:3px solid hsla(0,0%,100%,.2);animation:pulse 2s infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.hero h1{font-size:48px;font-weight:700;text-shadow:2px 2px 4px rgba(0,0,0,.2)}.hero h1,.hero h2{margin-bottom:20px}.hero h2{font-size:36px;font-weight:600;color:#fbbf24}.tagline{font-size:20px;margin-bottom:40px;opacity:.95;line-height:1.6}.btn-custom-primary{background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#1e3a8a!important;box-shadow:0 6px 25px rgba(251,191,36,.5);font-size:20px;font-weight:700;padding:18px 45px;border-radius:50px;text-decoration:none;display:inline-flex;align-items:center;transition:all .3s ease;border:none;text-transform:uppercase;letter-spacing:.5px}.btn-custom-primary:hover{transform:translateY(-4px) scale(1.02);box-shadow:0 10px 35px rgba(251,191,36,.7);background:linear-gradient(135deg,#f59e0b,#fbbf24);color:#1e3a8a!important}.btn-custom-secondary{background:hsla(0,0%,100%,.15);color:#fff!important;border:3px solid #fff;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);font-size:20px;font-weight:700;padding:18px 45px;border-radius:50px;text-decoration:none;display:inline-flex;align-items:center;transition:all .3s ease;text-transform:uppercase;letter-spacing:.5px}.btn-custom-secondary:hover{background:#fff;color:#1e3a8a!important;transform:translateY(-4px) scale(1.02);box-shadow:0 10px 35px hsla(0,0%,100%,.4)}.section-title{text-align:center;font-size:36px;font-weight:700;margin-bottom:60px;color:#1e3a8a}.feature-card{background:#f8f9fa;padding:40px 30px;border-radius:20px;text-align:center;transition:all .3s ease;border:2px solid transparent;height:100%}.feature-card:hover{transform:translateY(-10px);box-shadow:0 10px 30px rgba(0,0,0,.1);border-color:#3b82f6}.feature-icon{width:80px;height:80px;margin:0 auto 20px;background:linear-gradient(135deg,#3b82f6,#1e3a8a);border-radius:20px;display:flex;align-items:center;justify-content:center;font-size:40px}.feature-title{font-size:22px;font-weight:600;margin-bottom:15px;color:#1e3a8a}.feature-desc{color:#666;line-height:1.6}.product-card{background:#fff;border-radius:20px;overflow:hidden;box-shadow:0 4px 15px rgba(0,0,0,.1);transition:all .3s ease;height:100%}.product-card:hover{transform:translateY(-10px);box-shadow:0 10px 30px rgba(0,0,0,.2)}.product-header{background:linear-gradient(135deg,#3b82f6,#1e3a8a);color:#fff;padding:30px 20px;text-align:center}.product-name{font-size:24px;font-weight:700;margin-bottom:10px}.contact-card{background:hsla(0,0%,100%,.95);padding:40px 30px;border-radius:20px;box-shadow:0 10px 40px rgba(0,0,0,.2);transition:all .3s ease;height:100%}.contact-card:hover{transform:translateY(-5px);box-shadow:0 15px 50px rgba(0,0,0,.3)}.contact-card h3{color:#1e3a8a;font-size:24px;font-weight:700;margin-bottom:25px;padding-bottom:15px;border-bottom:3px solid #fbbf24}@media (max-width:768px){.logo-hero{width:280px;height:180px}.hero h1{font-size:32px}.hero h2{font-size:24px}.section-title{font-size:28px}}.announcement-bar{background:linear-gradient(135deg,#1e3a8a,#2563eb);color:#fff;padding:18px 0;text-align:center;font-weight:800;font-size:24px;font-family:Poppins,sans-serif;position:relative;overflow:hidden;box-shadow:0 2px 10px rgba(0,0,0,.1);white-space:nowrap;letter-spacing:.5px}.announcement-bar:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.3),transparent);animation:shimmer 3s infinite}@keyframes shimmer{0%{left:-100%}to{left:100%}}@keyframes scroll{0%{transform:translateX(100%)}to{transform:translateX(-100%)}}.announcement-bar i{margin-right:10px;animation:pulse 2s infinite}.announcement-bar a{color:#fff;text-decoration:underline;font-weight:700;margin-left:10px;transition:color .3s ease}.announcement-bar a:hover{color:#fbbf24}.announcement-content{position:relative;z-index:1;display:inline-block;animation:scroll 35s linear infinite;padding-left:20%}.announcement-bar:hover .announcement-content{animation-play-state:paused}