@font-face{font-family:Thai;src:url('assets/thai-regular.ttf');font-display:swap}:root{--paper:#fcf9f1;--ink:#3d2717;--muted:#725d48;--line:#ded4c5;--action:#503217;--wash:#f3e6c5}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.65 Thai,sans-serif;padding-bottom:110px}::selection{background:#e7c88a}html{scrollbar-color:#b9a78d var(--paper)}header,main,.tester{max-width:520px;margin:auto}header{display:flex;align-items:center;gap:12px;padding:18px 24px}header img{width:46px;height:46px;object-fit:contain;border-radius:50%}header strong{font-size:21px}header span{margin-left:auto;color:var(--muted);font-size:14px}.demo{text-align:center;font-size:12px;background:var(--wash);padding:7px 12px;color:var(--action)}main{padding:20px 24px 32px;min-height:460px}h1{font-size:30px;line-height:1.4;margin:0 0 12px;letter-spacing:-.02em}h2{font-size:21px;line-height:1.4;margin:0 0 12px}p{margin:0 0 18px;overflow-wrap:anywhere}.muted,small{color:var(--muted)}small{font-size:13px}.intro{margin:28px 0}.intro h1{font-size:36px}.intro img{width:155px;display:block;margin:0 auto 28px}.steps{padding-left:24px;margin:26px 0}.steps li{padding:7px 0}button,input{font:inherit}button{min-height:48px;padding:12px 18px;border:1px solid var(--action);border-radius:8px;background:var(--action);color:#fffdf8;cursor:pointer;touch-action:manipulation}button:hover{background:#6b4527}button:disabled{opacity:.55;cursor:not-allowed}.primary{width:100%}.secondary{background:transparent;color:var(--action);border-color:#b7a58f}.secondary:hover{background:var(--wash)}.line{background:#087f3f;border-color:#087f3f}.line:hover{background:#066d35}button+button{margin-top:10px}:focus-visible{outline:3px solid #a36516;outline-offset:4px}input{width:100%;min-height:52px;padding:12px;border:1px solid #aa947a;background:white;border-radius:8px;color:var(--ink);caret-color:var(--action)}label{display:block;margin:20px 0 8px}input[type=checkbox]{width:21px;min-height:21px;accent-color:var(--action)}.member-card{background:var(--wash);border-radius:16px;padding:26px;text-align:center;margin:24px 0}.member-card h2{margin:0 0 4px}.member-card img{width:224px;max-width:100%;height:auto;display:block;margin:18px auto 12px;border-radius:8px}.member-id{letter-spacing:.08em;font-variant-numeric:tabular-nums}.balance{display:flex;justify-content:space-between;align-items:center;padding:18px 0;border-bottom:1px solid var(--line)}.balance strong{font-size:24px}.callout{margin:22px 0;padding:18px;background:#eee8dc;border-radius:12px}.callout p:last-child{margin-bottom:0}.row{padding:20px 0;border-bottom:1px solid var(--line)}.row h2{font-size:18px;margin:0 0 6px}.row p{margin:5px 0}.row-top{display:flex;justify-content:space-between;gap:16px}.positive{color:#305c3d}.negative,.error{color:#9b3036}.empty{padding:40px 0;text-align:center}.empty svg{width:48px;height:48px;color:#94703b;margin-bottom:14px}.coupon{padding:24px 0;border-top:1px dashed #b7a58f}.coupon h2{font-size:22px}.tag{display:inline-block;font-size:12px;background:var(--wash);padding:3px 9px;border-radius:5px;margin-bottom:10px}.error{min-height:26px;margin:8px 0}.offline{background:#fff0d1;color:#784100;padding:12px;border-radius:8px;margin-bottom:18px}nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,520px);background:#fffdf8;border-top:1px solid var(--line);display:flex;padding:8px 8px calc(8px + env(safe-area-inset-bottom));z-index:3}nav button{flex:1;min-width:0;background:transparent;color:var(--muted);border:0;font-size:12px;padding:8px 2px;border-radius:8px}nav button+button{margin:0}nav button[aria-current=page]{background:var(--wash);color:var(--action)}nav button:hover{background:var(--wash)}svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}nav svg{display:block;margin:0 auto 4px}.tester{padding:18px 24px;border-top:1px solid var(--line);font-size:13px}.tester summary{cursor:pointer;min-height:44px}.tester button{display:block;width:100%;font-size:13px}.tester label{display:flex;align-items:center;gap:10px}.tester p{margin-top:14px}.skip{position:absolute;top:-100px}.skip:focus{top:0;background:white;padding:12px;z-index:10}#notice:not(:empty){position:fixed;bottom:95px;left:50%;transform:translateX(-50%);background:var(--action);color:white;width:min(90%,460px);padding:14px 18px;border-radius:8px;z-index:5}[hidden]{display:none!important}@media(min-width:760px){body{padding-top:26px}header{border-bottom:1px solid var(--line)}.demo{max-width:520px;margin:auto;border-radius:8px}}@media(prefers-reduced-motion:no-preference){main{animation:arrive .22s ease-out}@keyframes arrive{from{opacity:.7;transform:translateY(4px)}to{opacity:1;transform:none}}}