:root{--night:#04031b;--night-blue:#08123e;--indigo:#201539;--plum:#442942;--wine:#783a58;--rose-grey:#967072;--gold:#dc9e78;--gold-deep:#d07e5b;--blush:#eac2b3;--cream:#fdebda;--off-white:#f1e6e1;--bg:var(--night);--fg:var(--cream);--fg-dim:var(--off-white);--accent:var(--gold)}*{box-sizing:border-box}body{background:radial-gradient(ellipse at 50% 0%, var(--indigo) 0%, var(--night) 70%);color:var(--fg);min-height:100vh;margin:0;font-family:system-ui,-apple-system,Noto Sans Thai,sans-serif}.accent{color:var(--accent)}label{color:var(--off-white);margin:.9rem 0 .3rem;font-size:.9rem;display:block}input,textarea{box-sizing:border-box;background:var(--indigo);border:1px solid var(--plum);width:100%;min-height:2.75rem;color:var(--cream);font:inherit;border-radius:8px;padding:.6rem .85rem;font-size:1rem;display:block}textarea{resize:vertical;min-height:7rem}input::placeholder,textarea::placeholder{color:var(--rose-grey)}input:focus,textarea:focus{border-color:var(--gold);outline:none;box-shadow:0 0 0 3px #dc9e7859}button{border:1px solid var(--gold);min-height:2.75rem;color:var(--cream);font:inherit;cursor:pointer;background:0 0;border-radius:999px;justify-content:center;align-items:center;padding:.6rem 1.4rem;font-size:1rem;font-weight:600;transition:background-color .15s,opacity .15s,border-color .15s;display:inline-flex}button:hover:not(:disabled){background:#dc9e7824}button:disabled{opacity:.55;cursor:not-allowed}button[type=submit]{background:var(--gold);border-color:var(--gold);color:var(--night)}button[type=submit]:hover:not(:disabled){background:var(--gold-deep);border-color:var(--gold-deep)}.btn-approve{background:var(--gold);border-color:var(--gold);color:var(--night);font-weight:700}.btn-approve:hover:not(:disabled){background:var(--gold-deep);border-color:var(--gold-deep)}.btn-reject{border-color:var(--wine);color:var(--rose-grey);background:0 0;font-weight:500}.btn-reject:hover:not(:disabled){color:var(--off-white);background:#783a584d}.pop{--bg:#07040f;--wall:#0b0619;--fg:#fbf7ff;--fg-2:#cbbfe6;--fg-3:#9c8fc0;--gold:#ffb62b;--gold-2:#ffd27a;--gold-hot:#ffc857;--gold-wash:#ffb62b29;--violet:#7b2ff7;--violet-2:#c77dff;--magenta:#ff4fb3;--navy:#1a1233;--ink:#04020a8c;--ink-soft:#04020a66;--tile:#ffffff0b;--tile-2:#ffffff14;--line:#ffffff1f;--line-2:#ffffff38;--error:#ff9ab8;--font-body:Kanit, "Noto Sans Thai", system-ui, sans-serif;--font-led:"Chakra Petch", Kanit, ui-monospace, monospace;--r-sm:10px;--r-md:12px;--r-base:14px;--r-lg:22px;--pill:999px;min-height:100dvh;font-family:var(--font-body);color:var(--fg);background:var(--bg);-webkit-font-smoothing:antialiased;font-size:16px;line-height:1.55;position:relative}.pop-wall{z-index:0;pointer-events:none;background:radial-gradient(120% 80% at 50% 0%, #1a0f3a 0%, var(--wall) 45%, var(--bg) 100%);position:fixed;inset:0;overflow:hidden}.pop-bloom{filter:blur(60px);opacity:.7;border-radius:50%;position:absolute}.pop-bloom-violet{background:radial-gradient(circle,#7b2ff7bf 0%,#7b2ff700 70%);width:max(90vw,440px);max-width:720px;height:max(90vw,440px);max-height:720px;animation:9s ease-in-out infinite pop-breathe;top:-20vh;left:-25vw}.pop-bloom-gold{background:radial-gradient(circle,#ffb62b8c 0%,#ffb62b00 70%);width:max(70vw,380px);max-width:560px;height:max(70vw,380px);max-height:560px;animation:11s ease-in-out -3s infinite pop-breathe;top:8vh;right:-20vw}.pop-bloom-magenta{background:radial-gradient(circle,#ff4fb380 0%,#ff4fb300 70%);width:max(80vw,400px);max-width:640px;height:max(80vw,400px);max-height:640px;animation:13s ease-in-out -6s infinite pop-breathe;bottom:-30vh;left:10vw}@keyframes pop-breathe{0%,to{transform:translate(0,0)scale(1)}50%{transform:translate(3%,4%)scale(1.08)}}.pop-grid{opacity:.8;background-image:radial-gradient(circle,#ffffff13 1px,#0000 1.5px);background-size:6px 6px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000000e6,#00000059 60%,#0009);mask-image:linear-gradient(#000000e6,#00000059 60%,#0009)}.pop-vignette{background:radial-gradient(120% 90% at 50% 40%,#0000 55%,#04020abf 100%);position:absolute;inset:0}.pop-app{z-index:1;width:min(100%,600px);margin:0 auto;padding:0 18px 56px;position:relative}@media (width>=900px){.pop-app{width:min(100%,720px);padding-inline:24px}}.pop-brand{align-items:center;gap:9px;padding:18px 0 10px;display:inline-flex}.pop-brand-mark{background:var(--gold);border-radius:50%;width:12px;height:12px;box-shadow:0 0 0 4px #ffb62b2e,0 2px 12px #ffb62bb3}.pop-brand-text{letter-spacing:-.01em;white-space:nowrap;font-size:15px;font-weight:700}.pop-brand-text em{color:var(--fg-2);margin:0 1px;font-size:13px;font-style:normal;font-weight:400}.pop h1,.pop h2,.pop h3,.pop p{margin:0}.pop-h1{letter-spacing:-.02em;text-wrap:balance;text-shadow:0 0 30px #ffffff2e;font-size:clamp(26px,6.5vw,34px);font-weight:700;line-height:1.15}.pop-h2{letter-spacing:-.015em;font-size:clamp(19px,4.6vw,22px);font-weight:700;line-height:1.25}.pop-lede{color:var(--fg-2);text-wrap:pretty;max-width:46ch;margin-top:8px;font-size:15px}.pop-hint{color:var(--fg-3);max-width:60ch;font-size:13px}.pop-led{font-family:var(--font-led);letter-spacing:.14em;text-transform:uppercase;color:var(--fg-3);font-size:11px;line-height:1}.pop-tile{border-radius:var(--r-lg);border:1px solid var(--line-2);background:linear-gradient(#ffffff12,#ffffff08);padding:18px;box-shadow:0 24px 50px -30px #000c}.pop-label{color:var(--fg-2);margin-bottom:6px;font-size:14px;display:block}.pop-field,.pop-area{background:var(--ink);width:100%;color:var(--fg);border:1px solid var(--line-2);font-family:inherit;font-size:17px;font-weight:500;transition:border-color .18s,box-shadow .18s}.pop-field{border-radius:var(--pill);height:52px;padding:0 16px}.pop-area{border-radius:var(--r-base);resize:vertical;min-height:132px;padding:14px 16px;line-height:1.5}.pop-field::placeholder,.pop-area::placeholder{color:var(--fg-3)}.pop-field:focus,.pop-area:focus{border-color:var(--gold);outline:none;box-shadow:0 0 0 4px #ffb62b2e}.pop :focus-visible{outline:2px solid var(--gold-2);outline-offset:3px;border-radius:6px}.pop-ic{flex:none;width:24px;height:24px}.pop-ic-lit{color:var(--gold)}.pop-btn{border-radius:var(--pill);white-space:nowrap;cursor:pointer;border:1px solid #0000;justify-content:center;align-items:center;gap:8px;padding:12px 18px;font-family:inherit;font-size:15px;font-weight:600;line-height:1.2;transition:transform .18s cubic-bezier(.16,1,.3,1),background .2s,color .2s,box-shadow .2s;display:inline-flex}.pop-btn:disabled{opacity:.45;box-shadow:none;cursor:not-allowed}.pop-btn-primary{background:linear-gradient(180deg, var(--gold-hot), var(--gold));color:var(--navy);box-shadow:0 6px 22px -4px #ffb62b8c,inset 0 1px #ffffff59}.pop-btn-secondary{background:var(--tile-2);color:var(--fg);border-color:var(--line-2)}.pop-btn-ghost{color:var(--fg-2);border-color:var(--line);background:0 0}.pop-btn-link{color:var(--gold-2);text-underline-offset:3px;background:0 0;border:0;padding:12px 6px;font-weight:500;text-decoration:underline}@media (hover:hover){.pop-btn-primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 10px 28px -6px #ffb62bb3,inset 0 1px #ffffff59}.pop-btn-secondary:hover:not(:disabled){background:#ffffff21;transform:translateY(-1px)}.pop-btn-ghost:hover:not(:disabled){color:var(--fg);border-color:var(--line-2);background:var(--tile)}}.pop-btn:active:not(:disabled){transform:scale(.98)}.pop-btn .pop-ic{width:18px;height:18px}.pop-combo{position:relative}.pop-combo-mark{width:18px;height:18px;color:var(--gold);pointer-events:none;position:absolute;top:50%;right:16px;transform:translateY(-50%)}.pop-pop{z-index:5;overscroll-behavior:contain;border-radius:var(--r-md);border:1px solid var(--line-2);background:#120a24;max-height:300px;padding:6px;position:absolute;top:calc(100% + 6px);left:0;right:0;overflow-y:auto;box-shadow:0 30px 60px -24px #000000e6}.pop-field:disabled,.pop-area:disabled{opacity:.5;cursor:not-allowed;border-style:dashed}.pop-pop::-webkit-scrollbar{width:8px}.pop-pop::-webkit-scrollbar-thumb{background:#ffffff24;border-radius:99px}.pop-pop{scrollbar-width:thin;scrollbar-color:#ffffff29 transparent}.pop-grp{font-family:var(--font-led);letter-spacing:.06em;color:var(--fg-3);background:#120a24;padding:9px 10px 5px;font-size:11px;position:sticky;top:-6px}.pop-opt{border-radius:var(--r-sm);width:100%;color:var(--fg);text-align:start;cursor:pointer;background:0 0;border:0;padding:10px 12px;font-family:inherit;font-size:15px;display:block}.pop-opt[aria-selected=true]{color:var(--gold-2)}.pop-opt-other{color:var(--fg-3);font-size:14px}@media (hover:hover){.pop-opt:hover{background:var(--gold-wash);color:var(--fg)}}.pop-opt:focus-visible{background:var(--gold-wash)}.pop-answers{flex-wrap:wrap;gap:8px;display:flex}.pop-answer{border-radius:var(--r-base);background:var(--ink-soft);border:1px solid var(--line);color:var(--fg);cursor:pointer;align-items:center;gap:8px;padding:11px 14px;font-family:inherit;font-size:15px;transition:transform .18s cubic-bezier(.16,1,.3,1),border-color .2s,background .2s,box-shadow .2s;display:inline-flex}@media (hover:hover){.pop-answer:hover{border-color:var(--line-2);transform:translate(3px)}}.pop-answer[aria-pressed=true]{border-color:var(--gold);background:var(--gold-wash);box-shadow:0 0 0 4px #ffb62b1f}.pop-answer-tick{color:currentColor;opacity:.22;width:16px;height:16px;transition:opacity .2s,color .2s}.pop-answer[aria-pressed=true] .pop-answer-tick{color:var(--gold);opacity:1}.pop-consent{border-radius:var(--r-base);background:var(--ink-soft);border:1px solid var(--line);cursor:pointer;align-items:flex-start;gap:12px;margin-top:20px;padding:14px;transition:border-color .2s,background .2s;display:flex}.pop-consent:has(.pop-check:checked){border-color:var(--gold);background:var(--gold-wash)}.pop-check{appearance:none;box-sizing:border-box;border:1px solid var(--line-2);background:var(--ink);cursor:pointer;border-radius:7px;flex:none;width:22px;height:22px;min-height:22px;margin:1px 0 0;padding:0;transition:border-color .2s,background .2s,box-shadow .2s}.pop-check:checked{border-color:var(--gold);background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231a1233' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 12.5 9.5 17.5 19.5 7'/%3E%3C/svg%3E") center / 15px no-repeat, linear-gradient(180deg, var(--gold-hot), var(--gold));box-shadow:0 0 0 4px #ffb62b24}.pop-consent-text{color:var(--fg-2);font-size:14px;line-height:1.5}.pop-steps{flex-wrap:wrap;align-items:center;gap:4px;display:flex}.pop-step{border-radius:var(--r-sm);min-height:40px;color:var(--fg-3);cursor:pointer;background:0 0;border:0;flex-direction:column;align-items:center;gap:5px;padding:8px;font-family:inherit;font-size:11px;font-weight:500;line-height:1;transition:color .2s,background .2s;display:inline-flex}.pop-step-dot{opacity:.55;background:currentColor;border-radius:50%;width:8px;height:8px;transition:transform .25s cubic-bezier(.16,1,.3,1),opacity .2s,box-shadow .2s}.pop-step.is-done{color:var(--fg-2)}.pop-step.is-done .pop-step-dot{opacity:1}.pop-step.is-active{color:var(--gold-2)}.pop-step.is-active .pop-step-dot{opacity:1;transform:scale(1.35);box-shadow:0 0 10px 2px #ffb62b8c}@media (width<=430px){.pop-step-label{display:none}.pop-step{min-width:42px}}.pop-board{border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:0;padding:4px 0;list-style:none}.pop-row{align-items:flex-start;gap:14px;padding:13px 4px;display:flex}.pop-row+.pop-row{border-top:1px dashed var(--line)}.pop-row>.pop-ic{width:22px;height:22px;color:var(--gold);filter:drop-shadow(0 0 6px #ffb62b8c);flex:none}.pop-cell{flex-direction:column;flex:1;gap:3px;min-width:0;display:flex}.pop-v{overflow-wrap:anywhere;font-size:17px;line-height:1.4}.pop-app-wide{width:min(100%,880px)}@media (width>=900px){.pop-app-wide{width:min(100%,880px)}}.pop-topbar{z-index:2;-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--line);background:#07040fa8;flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:14px;padding:12px 0 13px;display:flex;position:sticky;top:0}.pop-count{flex:1;min-width:0;font-size:18px;font-weight:600}.pop-count b{font-family:var(--font-led);font-variant-numeric:tabular-nums;color:var(--gold-2);text-shadow:0 0 20px #ffb62b73;margin:0 5px;font-size:26px;font-weight:700}.pop-tools{flex:none;gap:8px;display:flex}.pop-btn-sm{padding:9px 14px;font-size:14px}.pop-btn-sm .pop-ic{width:16px;height:16px}.pop-row-actions{flex:none;align-self:center;gap:10px;display:flex}.pop-row-actions .pop-btn-primary{box-shadow:inset 0 1px #ffffff59}@media (hover:hover){.pop-row-actions .pop-btn-primary:hover:not(:disabled){box-shadow:0 6px 18px -6px #ffb62b99,inset 0 1px #ffffff59}}@media (width<=620px){.pop-row{flex-wrap:wrap}.pop-row-actions{justify-content:space-between;width:100%}}.pop-empty{text-align:center;padding:46px 10px}.pop-empty .pop-ic{width:28px;height:28px;color:var(--gold);opacity:.75;margin-bottom:10px}.pop-error{color:var(--error);margin-top:10px;font-size:14px}.pop-shake{animation:.45s cubic-bezier(.36,.07,.19,.97) both pop-shake}@keyframes pop-shake{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-4px)}40%,60%{transform:translate(4px)}}.pop-enter{animation:.5s cubic-bezier(.16,1,.3,1) both pop-enter}@keyframes pop-enter{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}.pop-spin{animation:.9s linear infinite pop-spin}@keyframes pop-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.pop *,.pop :before,.pop :after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.pop-bloom{animation:none}}