@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@400;500;600;700&family=Noto+Serif+Thai:wght@400;500;600&display=swap');
:root{color-scheme:dark;--gold:#dfb365;--mint:#54bca6;--ink:#e3e8f0;--muted:#9bacbf;--line:#ffffff21}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:#031222;font-family:'Noto Sans Thai',sans-serif;font-size:14px}
body:before{content:"";position:fixed;inset:100px 0 0;z-index:-1;background:linear-gradient(270deg,#031222 3%,#031222ed 40%,#03122266 70%,#03122208),url('legal-books-hero.png') left center/cover no-repeat;transform:scaleX(-1);pointer-events:none}
a{color:inherit;text-decoration:none}button,textarea{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}button:focus-visible,a:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:4px}[hidden]{display:none!important}
.header{min-height:100px;border-bottom:1px solid var(--line);padding:20px 3%;display:flex;align-items:center;gap:30px;background:#031222dc}.brand{flex-shrink:0}.brand strong{font:42px/1 Georgia,serif;color:var(--gold);letter-spacing:.5px}.brand small{display:block;font-size:10px;color:var(--gold);margin-top:8px;letter-spacing:.5px}.header nav{display:flex;align-items:center;justify-content:center;gap:28px;flex:1}.header nav a,.header nav button{border:0;background:none;color:#c5cbd5;padding:12px 0;white-space:nowrap;font-size:13px}.header nav .selected{color:var(--gold);border-bottom:2px solid var(--gold)}.google{display:inline-flex;gap:10px;align-items:center;padding:12px 17px;border-radius:8px;background:#fff;color:#1e2633;font-size:13px;white-space:nowrap}.g{font:700 24px Arial;color:#4285f4}.hero{max-width:1580px;margin:auto;padding:36px 3% 28px;display:grid;grid-template-columns:minmax(0,.83fr) minmax(0,1.17fr);gap:40px;align-items:center}.intro{text-align:center;padding:20px 0}.eyebrow{color:var(--mint);font-size:10px;letter-spacing:2.5px;margin:0 0 20px}h1{font:500 clamp(30px,3.3vw,55px)/1.45 'Noto Serif Thai',serif;margin:0;color:#f3f1ed;letter-spacing:-1px}h1 em{font-style:normal;color:var(--gold)}.desktop-break{display:none}.ornament{display:flex;gap:18px;align-items:center;justify-content:center;margin:22px auto;max-width:92%;color:var(--gold);font-size:26px}.ornament i{height:1px;background:var(--gold);flex:1}.lead{font:400 18px/1.8 'Noto Serif Thai',serif;color:#cbd0d9;margin:0 0 14px}.scope h2{font:400 18px/1.8 'Noto Serif Thai',serif;color:var(--gold);margin:0}.scope p{font:400 17px/1.8 'Noto Serif Thai',serif;margin:10px 0;color:#cbd0d9}.scope small{color:#99a9bc;font-size:11px}.features{display:grid;grid-template-columns:repeat(3,1fr);margin:30px 0;gap:8px}.features>div+div{border-left:1px solid var(--line)}.features span{display:block;color:var(--mint);font:36px Georgia;margin-bottom:12px}.features b{display:block;color:#81c3b8;font-weight:500;font-size:13px}.features small{display:block;color:var(--muted);font-size:11px;margin-top:5px}.cta{margin:0 auto;max-width:420px;border:1px solid #5ca99e;display:flex;align-items:center;justify-content:center;gap:18px;padding:16px 24px;border-radius:10px;background:linear-gradient(115deg,#116b61,#0b786c);box-shadow:inset 0 1px #ffffff26;font-size:18px}.cta .g{color:white;font-size:28px}.cta:hover{background:#128778}.caution{font-size:11px;line-height:1.8;color:#95a5b8;margin:15px 0 0}
.chat{border:1px solid #8796b34f;background:#05182ded;border-radius:16px;box-shadow:0 24px 80px #0005;overflow:hidden;min-width:0}.chat-header{display:flex;align-items:center;gap:14px;padding:22px;border-bottom:1px solid var(--line)}.seal{width:49px;height:49px;display:grid;place-items:center;border:1px solid #348d7e;border-radius:50%;color:var(--gold);font:29px Georgia;flex-shrink:0}.chat-header h2{font:22px/1.3 Georgia,serif;margin:0;color:#f0e9db}.chat-header p{font-size:11px;color:var(--mint);margin:6px 0 0}.status{margin-left:auto;white-space:nowrap;color:#8bcbbd;border:1px solid var(--line);padding:7px 9px;border-radius:9px;font-size:10px}.messages{height:450px;overflow-y:auto;padding:23px 20px;scrollbar-color:#355373 transparent}.message{display:flex;gap:12px;margin-bottom:20px;align-items:flex-start}.avatar{width:34px;height:34px;flex-shrink:0;display:grid;place-items:center;background:#21527c;border-radius:50%;font-size:11px;margin-top:8px}.assistant .avatar{background:#076659;color:#fff;font:22px Georgia}.bubble{flex:1;min-width:0;border:1px solid #819dbc26;border-radius:12px;background:linear-gradient(115deg,#102c4b,#0b203c);padding:16px 18px;line-height:1.95;font-size:14px}.bubble p{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}.assistant .bubble{background:#071e30cc}.answer-label{color:var(--mint);border-bottom:1px solid var(--line);padding-bottom:11px;margin-bottom:13px!important;font-size:12px}.source{margin-top:18px;border:1px solid #557f8f36;border-radius:9px;background:#17324580;padding:11px;font-size:11px;color:#b9cbd9}.source summary{cursor:pointer;color:#83d2bf}.source p{margin-top:10px;line-height:1.8}.chat-footer{border-top:1px solid var(--line);padding:16px 20px}.chat-tools{display:flex;gap:10px;justify-content:space-between;align-items:center;font-size:10px;color:var(--muted);margin-bottom:12px}.chat-tools button{background:none;border:0;color:var(--gold);font-size:11px}form{display:flex;gap:12px;align-items:stretch}textarea{resize:vertical;min-height:70px;width:100%;background:#071a2d;border:1px solid #b98c45;border-radius:12px;padding:14px;color:#fff;outline:none}textarea::placeholder{color:#8395ab}#send{width:68px;flex-shrink:0;border:1px solid #378777;border-radius:12px;background:#087768;color:white;font-size:27px}button:disabled{opacity:.5;cursor:wait}.footnote{font-size:10px;line-height:1.6;color:#879bb0;margin-bottom:0}#feedback{font-size:12px;color:#edc47e;min-height:0;margin:6px 0}.page-footer{max-width:1490px;margin:0 auto;padding:18px 3%;border-top:1px solid var(--line);display:flex;justify-content:space-between;font-size:10px;color:#8496aa}.authenticated .messages{height:520px}dialog{max-width:600px;width:calc(100% - 30px);background:#0c233a;border:1px solid #a78449;border-radius:16px;color:#d9e4ee;padding:30px;line-height:1.9}dialog::backdrop{background:#0009}dialog h2{color:var(--gold)}#policyClose{float:right;background:none;border:0;color:white;font-size:25px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(min-width:1500px){.messages{height:510px}}
@media(max-width:1100px){.header{gap:16px}.header nav{gap:15px}.header nav a,.header nav button{font-size:11px}.hero{gap:24px}.chat-header h2{font-size:18px}.status{font-size:9px}.scope h2{font-size:16px}}
@media(max-width:850px){.header{flex-wrap:wrap;justify-content:space-between;padding:18px 5%}.header nav{order:3;flex-basis:100%;justify-content:flex-start}.brand strong{font-size:32px}.hero{grid-template-columns:1fr;padding:20px 5%;gap:28px}.intro{max-width:620px;margin:auto}h1{font-size:40px}.messages{height:400px}.page-footer{gap:12px;flex-wrap:wrap}.chat-header{padding:16px}.chat-header h2{font-size:18px}}
@media(max-width:480px){.google{font-size:10px;padding:10px}.brand strong{font-size:27px}.brand small{font-size:8px}.header{gap:12px}h1{font-size:32px}.hero{padding:18px 12px}.status{display:none}.messages{padding:16px 10px}.bubble{padding:12px;font-size:13px}.message{gap:7px}.avatar{width:26px;height:26px}.chat-footer{padding:14px 12px}.features b{font-size:11px}.features small{font-size:9px}.lead{font-size:16px}.cta{font-size:16px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Signed-in workspace: the conversation owns the viewport, not the hero grid. */
body.authenticated{height:100vh;height:100dvh;display:flex;flex-direction:column;overflow:hidden}
.authenticated:before,.authenticated .intro,.authenticated .page-footer,.authenticated .header .login,.authenticated .header nav a{display:none}
.authenticated .header{min-height:56px;flex-shrink:0;padding:6px 20px;gap:16px;flex-wrap:nowrap}
.authenticated .brand strong{font-size:26px}
.authenticated .brand small{display:none}
.authenticated .header #greeting{min-width:0;margin:0;color:var(--mint);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.authenticated #logout{padding:9px 14px;font-size:12px}
.authenticated .header nav{justify-content:flex-end;order:0;flex:1}
.authenticated .hero{display:flex;flex:1;align-items:stretch;min-height:0;width:100%;max-width:none;margin:0;padding:0;gap:0}
.authenticated .chat{display:flex;flex-direction:column;flex:1;min-height:0;border:0;border-radius:0;box-shadow:none;background:#05182d}
.authenticated .chat-header{display:none}
.authenticated .messages{flex:1;min-height:0;height:auto;padding:24px max(24px,calc((100% - 1100px)/2));overscroll-behavior:contain}
.authenticated .message{margin-bottom:24px}
.authenticated .user{margin-left:12%;flex-direction:row-reverse}
.authenticated .chat-footer{flex-shrink:0;padding:14px max(24px,calc((100% - 1100px)/2)) max(14px,env(safe-area-inset-bottom));background:#061a2e}
.authenticated textarea{resize:none;max-height:120px;font-size:16px}
.authenticated .chat-tools{flex-wrap:wrap}
@media(max-width:600px){
  .authenticated .header{padding:6px 12px;gap:10px}
  .authenticated .header #greeting{display:none}
  .authenticated .brand strong{font-size:24px}
  .authenticated .brand small{display:none}
  .authenticated .header nav button{font-size:10px}
  .authenticated .chat-header{padding:10px 12px;gap:10px}
  .authenticated .chat-header h2{font-size:17px}
  .authenticated .seal{width:35px;height:35px;font-size:22px}
  .authenticated .messages{padding:16px 12px}
  .authenticated .chat-footer{padding:10px 12px max(10px,env(safe-area-inset-bottom))}
  .authenticated .user{margin-left:5%}
  .authenticated #send{width:48px}
}
