:root{font-family:Noto Sans Thai,Sarabun,system-ui,sans-serif;color:#14343b;background:#eef4f2;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at top right,#d7f36a55,transparent 28rem),#eef4f2}button,input,select,textarea{font:inherit}button{cursor:pointer}#app{max-width:760px;margin:auto;padding:env(safe-area-inset-top) 18px calc(92px + env(safe-area-inset-bottom))}header{display:flex;align-items:center;justify-content:space-between;padding:24px 4px 18px}.header-actions{display:flex;gap:4px}h1,h2,p{margin:0}h1{font-size:1.6rem}h2{font-size:1.15rem}small,.muted{color:#638087}.hero{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px}.hero div,.panel{background:#fff;border:1px solid #d7e2df;box-shadow:0 8px 30px #163c4610;border-radius:20px}.hero div{padding:15px 12px}.hero span{display:block;color:#638087;font-size:.75rem}.hero strong{font-size:1.15rem}.panel{padding:20px;margin-bottom:14px}.section-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.badge{padding:5px 10px;border-radius:99px;background:#e6f2b1;color:#375000;font-size:.75rem}form{display:grid;gap:14px}label{display:grid;gap:6px;font-size:.86rem;font-weight:650}input,select,textarea{width:100%;border:1px solid #c9d7d3;border-radius:12px;padding:13px 14px;background:#f9fbfa;color:#14343b;min-height:48px}textarea{min-height:82px;resize:vertical}.grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.primary,.secondary,.danger{border:0;border-radius:14px;font-weight:800;min-height:52px;padding:13px 18px;width:100%;margin-top:10px}.primary{background:#d7f36a;color:#193500}.secondary{background:#dce9e6;color:#163c46}.danger{background:#fee2e2;color:#8d1919}.ghost{border:0;background:transparent;color:#235e6b;font-weight:700}.error{min-height:1.4em;color:#a52121}.timeline{display:grid}.event-row{display:grid;grid-template-columns:100px 1fr;gap:4px 12px;padding:13px 0;border:0;border-bottom:1px solid #e5ecea;background:transparent;color:inherit;text-align:left;width:100%}.event-row small{grid-column:2}.pending-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px;border-radius:13px;background:#f6f9f8;margin-top:8px}.pending-row>div{display:grid}.pending-row small{margin-top:3px}.pending-row.conflict{background:#fff4d6}.pending-row.failed{background:#feecec}dialog{width:min(680px,calc(100% - 24px));max-height:90vh;border:0;border-radius:22px;padding:24px;color:#14343b;overflow:auto}dialog::backdrop{background:#092b33aa}.dialog-close{position:sticky;float:right;top:0;border:0;border-radius:50%;width:38px;height:38px;background:#edf3f1;font-size:1.5rem;z-index:2}.dialog-subtitle{margin:5px 0 18px}.compare{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0}.compare div{display:grid;gap:5px;padding:14px;border:1px solid #d7e2df;border-radius:14px}nav{position:fixed;z-index:4;bottom:0;left:50%;transform:translate(-50%);width:min(760px,100%);display:grid;grid-template-columns:repeat(4,1fr);padding:10px 10px calc(10px + env(safe-area-inset-bottom));background:#0b3b46}nav button{border:0;background:transparent;color:#b9cccf;padding:12px 4px;border-radius:10px;font-size:.78rem}nav button.active{background:#d7f36a;color:#193500;font-weight:800}.network{text-align:center;font-size:.78rem;color:#6d4d00}.login,.setup{min-height:90vh;display:flex;flex-direction:column;justify-content:center;gap:18px;max-width:460px;margin:auto}.login img,.setup img{width:82px}.login h1{font-size:2.5rem;line-height:1.15}.login p{color:#547279;line-height:1.7}.boot{padding:40vh 0;text-align:center}@media(max-width:520px){#app{padding-left:12px;padding-right:12px}.hero{grid-template-columns:1fr 1fr}.hero div:last-child{grid-column:1/-1}.grid,.compare{grid-template-columns:1fr}.panel{padding:16px}.login h1{font-size:2.2rem}.header-actions{flex-direction:column;align-items:flex-end}}@media(display-mode:standalone){header{padding-top:16px}}