.login-page{--auth-bg:var(--bg);--auth-text:var(--text);--auth-muted:var(--muted);--auth-accent:var(--accent);--auth-ink:var(--accent-ink);margin:0;background:var(--auth-bg);color:var(--auth-text);font:14px/1.7 Thonburi,"Noto Sans Thai","Leelawadee UI",Tahoma,system-ui,sans-serif;font-synthesis:none}
.login-page *{box-sizing:border-box}.login-page button,.login-page input{font:inherit}.login-page a{color:inherit;text-decoration:none}.login-page button{cursor:pointer}.login-page button:disabled{cursor:wait}.login-page svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.login-page [hidden]{display:none!important}.login-symbols{position:absolute;width:0;height:0;overflow:hidden}.login-page :focus-visible{outline:2px solid var(--auth-accent);outline-offset:4px}
.login-shell{width:min(1180px,100%);min-height:100dvh;display:flex;flex-direction:column;margin:auto;padding:32px 44px 24px}.login-header{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:50px}.login-header-tools{display:flex;align-items:center;gap:20px}.auth-brand{font-family:ui-rounded,"Arial Rounded MT Bold",Arial,sans-serif;display:flex;align-items:center;gap:11px;font-size:24px;font-weight:700;letter-spacing:-.7px;line-height:1.1;white-space:nowrap}.auth-brand-mark{display:grid;place-items:center;width:38px;height:38px;background:var(--auth-accent);color:var(--auth-ink);border-radius:14px;transform:rotate(-7deg)}.auth-brand-mark svg{height:19px;width:19px;fill:currentColor;stroke:none;transform:rotate(7deg)}.auth-brand-dot{color:var(--auth-accent);font-size:23px;font-weight:400;margin-left:-5px}.login-private{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--auth-muted);white-space:nowrap}.login-private>span{width:6px;height:6px;background:var(--auth-accent);border-radius:50%}
.login-main{display:grid;grid-template-columns:1.05fr 1fr;align-items:center;gap:80px;flex:1;padding:54px 0 60px}.login-story{position:relative;padding:12px 0}.auth-eyebrow{font:10px/1.5 system-ui,sans-serif;letter-spacing:1.8px;color:var(--auth-muted);margin:0 0 18px}.login-story h1{font-size:38px;line-height:1.65;font-weight:500;letter-spacing:-1px;margin:0}.login-story h1 span{color:var(--auth-accent)}.story-description{font-size:14px;line-height:1.95;color:var(--auth-muted);margin:18px 0 0}
.cinema-art{height:248px;position:relative;width:330px;margin:25px 0 0 8px}.art-orbit{position:absolute;left:6px;top:5px;width:256px;height:223px;border:1px dashed var(--border);border-radius:50%;transform:rotate(-16deg)}.cinema-card{position:absolute;top:27px;left:103px;width:118px;height:162px;border:1px solid var(--border);border-radius:17px;background:var(--peach)}.cinema-card-back{left:61px;top:33px;transform:rotate(-19deg);background:var(--mint);display:flex;flex-direction:column;justify-content:flex-end;gap:9px;padding:17px}.cinema-card-back>span{height:4px;width:69px;background:var(--dim);opacity:.35;border-radius:4px}.cinema-card-back>span:last-child{width:39px}.cinema-card-front{transform:rotate(12deg);display:flex;align-items:center;justify-content:center;overflow:hidden;box-shadow:var(--shadow)}.cinema-play{display:grid;place-items:center;width:51px;height:51px;border:1px solid var(--border);background:var(--panel);border-radius:50%;color:var(--auth-text)}.cinema-play svg{width:23px;height:23px;fill:currentColor;stroke:none;margin-left:2px}.cinema-card-label{position:absolute;bottom:17px;font:6px system-ui,sans-serif;letter-spacing:1px;color:var(--auth-muted)}.film-perforations{position:absolute;left:8px;top:9px;bottom:9px;width:4px;background:repeating-linear-gradient(to bottom,var(--muted) 0,var(--muted) 5px,transparent 5px,transparent 14px);opacity:.35;border-radius:3px}.film-perforations-right{left:auto;right:8px}.art-cross{position:absolute;left:240px;top:10px;line-height:1;font-size:37px;color:var(--auth-accent);transform:rotate(9deg)}.art-heart{position:absolute;left:33px;top:163px;width:46px;height:46px;display:grid;place-items:center;border:1px solid var(--border);background:var(--lavender);border-radius:16px;transform:rotate(-12deg);color:var(--auth-text)}.art-heart svg{width:19px;height:19px}.art-caption{position:absolute;left:247px;top:157px;font:8px system-ui,sans-serif;letter-spacing:1.4px;line-height:1.8;color:var(--dim)}.story-footnote{display:flex;align-items:center;gap:11px;color:var(--dim);font:9px system-ui,sans-serif;letter-spacing:1px;margin-top:4px}.story-footnote-line{width:28px;height:1px;background:var(--border)}
.login-panel{background:var(--panel);border:1px solid var(--border);border-radius:28px;padding:37px 36px 32px;box-shadow:var(--shadow);min-height:470px;align-self:center;position:relative}.login-panel-icon{width:43px;height:43px;display:grid;place-items:center;border:1px solid var(--border);background:var(--soft-accent);color:var(--auth-text);border-radius:15px;margin-bottom:25px}.login-panel-icon svg{height:19px;width:19px}.login-panel .auth-eyebrow{font-size:9px;margin-bottom:10px;letter-spacing:1.45px;color:var(--auth-muted)}.login-panel h2{font-size:25px;font-weight:500;line-height:1.7;letter-spacing:-.4px;margin:0 0 7px}.form-description{font-size:13px;color:var(--auth-muted);line-height:1.9;margin:0 0 27px}.form-field{margin-bottom:19px}.form-field label{display:block;font-size:12px;color:var(--auth-text);margin-bottom:8px}.auth-input-wrap{display:flex;align-items:center;gap:11px;min-height:49px;border:1px solid var(--border);border-radius:14px;background:var(--surface-2);padding:0 14px;transition:border-color .2s,box-shadow .2s}.auth-input-wrap:focus-within{border-color:var(--auth-accent);box-shadow:0 0 0 3px var(--soft-accent)}.auth-input-wrap>svg{height:17px;width:17px;color:var(--dim)}.auth-input-wrap input{width:100%;min-width:0;min-height:47px;border:0;outline:0;background:transparent;color:var(--auth-text);font-size:14px;padding:10px 0;border-radius:0}.auth-input-wrap input:focus-visible{outline:0}.auth-input-wrap input::placeholder{color:var(--dim);font-size:12px}.auth-input-wrap input:-webkit-autofill{-webkit-text-fill-color:var(--auth-text);-webkit-box-shadow:0 0 0 100px var(--surface-2) inset;caret-color:var(--auth-accent)}.auth-input-wrap:has(input[aria-invalid="true"]){border-color:var(--auth-accent)}.field-hint{font-size:11px;color:var(--auth-muted);line-height:1.85;margin:7px 0 0}.optional-label{font-size:10px;font-weight:400;color:var(--dim);margin-left:6px}.auth-input-wrap .invite-code-input{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:1px;font-size:16px}.auth-input-wrap .invite-code-input::placeholder{font-family:Thonburi,Tahoma,sans-serif;letter-spacing:0;font-size:12px}
.auth-error{border:1px solid var(--border);background:var(--peach);color:var(--auth-text);font-size:12px;line-height:1.9;border-radius:13px;padding:11px 13px;margin:6px 0 17px}.auth-submit{width:100%;min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid transparent;border-radius:14px;padding:11px 16px;background:var(--auth-accent);color:var(--auth-ink);font-size:13px!important;font-weight:600!important;margin-top:24px;transition:filter .2s,transform .2s}.auth-submit:hover{filter:brightness(1.04);transform:translateY(-1px)}.auth-submit svg{height:17px;width:17px}.auth-submit:disabled{opacity:.7;transform:none}.form-note{font-size:11px;color:var(--auth-muted);line-height:1.9;text-align:center;margin:18px 0 0}.auth-spinner{display:inline-block;width:18px;height:18px;border:2px solid var(--border);border-top-color:var(--auth-accent);border-radius:50%;animation:auth-spin .75s linear infinite;flex-shrink:0}.auth-submit .auth-spinner{width:15px;height:15px;border-color:var(--auth-ink);border-top-color:transparent}.auth-loading{min-height:375px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px;font-size:13px;color:var(--auth-muted)}.auth-unavailable{padding:13px 0 6px}.auth-unavailable p:not(.auth-eyebrow){font-size:13px;line-height:1.95;color:var(--auth-muted);margin:14px 0 27px}.auth-unavailable h2{font-size:23px;line-height:1.8}.auth-retry{min-height:43px;display:flex;align-items:center;justify-content:space-between;gap:22px;border:1px solid var(--border);border-radius:13px;background:var(--soft-accent);color:var(--auth-text);font-size:12px!important;padding:10px 14px}.auth-retry svg{height:16px;width:16px}.auth-retry:hover{background:var(--lavender)}.auth-noscript{font-size:13px;color:var(--auth-muted);line-height:1.9}
.owner-access{border-top:1px solid var(--border);margin-top:26px;padding-top:18px}.owner-access>p:first-child{font-size:11px;color:var(--auth-text);margin:0 0 5px}.owner-access-note{font-size:11px;color:var(--auth-muted);line-height:1.9;margin:0 0 12px}.owner-bootstrap{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:41px;padding:9px 12px;border:1px solid var(--border);border-radius:13px;background:var(--mint);color:var(--auth-text);font-size:11px!important;text-align:left}.owner-bootstrap svg{width:15px;height:15px}.owner-bootstrap:hover{border-color:var(--auth-accent)}.owner-bootstrap:disabled{opacity:.6;cursor:wait}.login-footer{border-top:1px solid var(--border);display:flex;justify-content:space-between;gap:22px;padding-top:20px;color:var(--dim);font-size:10px;line-height:1.9}.login-footer>span:last-child{font:8px/1.8 system-ui,sans-serif;letter-spacing:1px;padding-top:3px}
/* Account controls are also used by the library footer. */
.page-footer.has-account{flex-wrap:wrap}.account-controls{display:flex;align-items:center;gap:8px;width:100%;flex-basis:100%;padding-top:16px;border-top:1px solid var(--border);color:var(--muted);font-size:11px;min-width:0}.account-controls>svg{width:14px;height:14px;color:var(--accent)}.account-username{color:var(--text);overflow:hidden;text-overflow:ellipsis;max-width:220px;white-space:nowrap}.logout-button{margin-left:auto;display:flex;align-items:center;gap:7px;color:var(--muted);min-height:34px;padding:5px 0 5px 12px;background:none;border:0;font:11px Thonburi,Tahoma,sans-serif;white-space:nowrap}.logout-button svg{width:13px;height:13px}.logout-button:hover{color:var(--text)}.logout-button:disabled{opacity:.6;cursor:wait}.logout-button:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.account-controls[hidden]{display:none!important}.account-access-link{margin-left:auto;color:var(--text);padding:6px 10px;font-size:11px;white-space:nowrap}.account-access-link:hover{color:var(--accent)}.account-access-link:not([hidden])+.logout-button{margin-left:4px}
@keyframes auth-spin{to{transform:rotate(360deg)}}
@media(max-width:1050px){.login-shell{padding-left:32px;padding-right:32px}.login-main{gap:42px;grid-template-columns:1fr 1fr}.login-story h1{font-size:32px}.login-panel{padding:31px 27px}.cinema-art{transform:scale(.9);transform-origin:left center;margin-left:0;width:290px}.login-private{display:none}}
@media(max-width:760px){.login-shell{padding:25px 26px 23px;max-width:690px}.login-header{min-height:44px;gap:15px}.login-header-tools{gap:12px}.auth-brand{font-size:22px}.login-main{grid-template-columns:1fr;gap:28px;padding:35px 0 37px;flex:initial}.login-story{padding:0;overflow:hidden}.login-story h1{font-size:30px;line-height:1.7}.login-story h1 br{display:none}.login-story h1 span{display:block}.login-story .auth-eyebrow{font-size:9px;margin-bottom:12px;letter-spacing:1.4px}.story-description{font-size:13px;margin-top:10px;max-width:365px}.story-description br{display:none}.cinema-art{position:absolute;width:190px;height:160px;right:-15px;top:5px;transform:scale(.57);transform-origin:top right;opacity:.65;pointer-events:none}.story-footnote{display:none}.login-panel{width:100%;max-width:460px;margin:auto;padding:30px;min-height:440px}.login-panel h2{font-size:24px}.login-panel-icon{margin-bottom:22px}.login-footer{margin-top:auto;font-size:9px;gap:14px}.login-footer>span:last-child{font-size:7px;max-width:125px;line-height:1.8;text-align:right}.auth-input-wrap input{font-size:16px}.account-username{max-width:190px}}
@media(max-width:480px){.login-shell{padding:21px 21px 20px}.auth-brand{font-size:20px;gap:8px;letter-spacing:-.7px}.auth-brand-mark{width:33px;height:33px;border-radius:12px}.auth-brand-dot{display:none}.login-main{padding-top:31px;gap:25px}.login-story h1{font-size:28px}.story-description{font-size:12px;max-width:260px}.login-story .auth-eyebrow{font-size:8px;letter-spacing:1.2px}.cinema-art{right:-8px;top:15px;transform:scale(.43);opacity:.45}.login-panel{padding:27px 24px;border-radius:24px;min-height:430px}.login-panel h2{font-size:23px}.form-description{font-size:12px;margin-bottom:24px}.login-panel-icon{width:38px;height:38px;border-radius:13px;margin-bottom:20px}.login-panel-icon svg{width:17px;height:17px}.form-note{font-size:10px}.login-footer{font-size:8px;padding-top:17px}.login-footer>span:first-child{max-width:185px}.auth-loading{min-height:340px}.account-controls{flex-wrap:wrap;row-gap:4px}.account-access-link{padding-left:0}.account-controls .account-username{max-width:145px}.owner-bootstrap{font-size:10px!important}.owner-access-note{font-size:10px}}
@media(prefers-reduced-motion:reduce){.login-page *{animation:none!important;transition:none!important}}

/* Shared palette and controls for Baitui Enjoy, bundled in the public base sheet. */
:root,:root[data-theme="light"]{
  color-scheme:light;
  --bg:#fff8f4;--panel:#fffefd;--panel-raised:#ffffff;--border:#e6d8e2;
  --text:#49394b;--muted:#7b667c;--dim:#88758a;--accent:#9c4f71;--accent-ink:#fff9fc;
  --surface-2:#f6edf2;--soft-accent:#f8e4ed;--mint:#e5f3ed;--peach:#ffebdc;--lavender:#eee9f8;
  --shadow:0 12px 38px rgba(91,58,78,.09);--backdrop:rgba(78,57,76,.35);
  --art-fill:#f3d6e2;--art-border:#cea1b6;--art-muted:#a36b89;
  --notice-bg:#fff0e4;--notice-border:#e6c3a9;--notice-text:#82563f;
  --success-text:#3d725d;--danger-text:#a34f5d;--danger-bg:#fff0ef;--danger-border:#e6b8bb;
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#211e29;--panel:#2b2635;--panel-raised:#35303e;--border:#4b4054;
  --text:#f2eaf2;--muted:#c0b1c4;--dim:#a695ae;--accent:#e8b1c9;--accent-ink:#352035;
  --surface-2:#342d40;--soft-accent:#483443;--mint:#2d4540;--peach:#493a31;--lavender:#3b344e;
  --shadow:0 12px 40px rgba(13,8,19,.22);--backdrop:rgba(12,8,19,.72);
  --art-fill:#543b51;--art-border:#966d8b;--art-muted:#c99fba;
  --notice-bg:#493a31;--notice-border:#80664c;--notice-text:#eed0ac;
  --success-text:#b1dbc8;--danger-text:#edb3bd;--danger-bg:#4a303b;--danger-border:#895867;
}
.login-page{--auth-bg:var(--bg);--auth-text:var(--text);--auth-muted:var(--muted);--auth-accent:var(--accent);--auth-ink:var(--accent-ink);background:var(--bg);color:var(--text)}
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:6px;flex-shrink:0;min-height:34px;padding:6px 10px;border:1px solid var(--border);border-radius:999px;background:var(--panel);color:var(--muted);font:11px Thonburi,Tahoma,system-ui,sans-serif;line-height:1.4;cursor:pointer;white-space:nowrap;box-shadow:0 2px 9px rgba(91,58,78,.03)}
.theme-toggle:hover{color:var(--accent);border-color:var(--art-border);background:var(--soft-accent)}
.theme-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.theme-toggle [data-theme-icon]{font:16px system-ui,sans-serif;line-height:1}
@media(max-width:600px){.theme-toggle{min-height:34px;padding:6px 9px;font-size:10px}}
@media(prefers-reduced-motion:no-preference){.theme-toggle{transition:background-color .18s,border-color .18s,color .18s}}
