/*
 Role & Talk | Proposal B — Classic Premium Lounge (warm sans revision)
 VISUAL ONLY. No DOM, auth, routes, room flow, user copy or application behavior changes.
 Overrides the preserved v0.7.1 styles.css and intentionally leaves all
 fixed-height performance, dialogue fit, recording, two-actor and spectator rules alone.
 Design approved in conversation: warm, premium, friendly, NO Japanese Mincho.
*/
:root {
  --wine: #362419;
  --wine-dark: #201710;
  --gold: #b3925f;
  --cream: #f3ecdf;
  --paper: #fffaf2;
  --ink: #302822;
  --muted: #685d52;
  --line: #d2c2aa;
  /* Prior --serif references now use the same warm sans family. */
  --serif: "Avenir Next", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Noto Sans CJK JP", Meiryo, sans-serif;
  --rtb-body: "Avenir Next", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Noto Sans CJK JP", Meiryo, sans-serif;
  font-family:var(--rtb-body);
  color:var(--ink);
  background:var(--cream);
}
body {
  background:var(--cream);
  color:var(--ink);
  font-family:var(--rtb-body);
  -webkit-font-smoothing:antialiased;
}
button, input, select, textarea, option { font-family:var(--rtb-body); }
h1, h2, h3, h4, .brand-en, .step-number, .section-kicker {
  font-family:var(--rtb-body);
}
h1,h2,h3 { font-weight:650; letter-spacing:.005em; }
.brand-en { font-weight:650; letter-spacing:.035em; }
.section-kicker { font-size:12px; font-weight:650; letter-spacing:.16em; }
:where(a,button,input,textarea,select):focus-visible {
  outline:3px solid #c29b5e;
  outline-offset:3px;
}
/* Header, page identity and navigation; keep original elements/links. */
.preview-strip {
  background:#211710;
  color:#dfcaa8;
  border-bottom:1px solid #674e34;
  letter-spacing:.025em;
}
.header {
  max-width:none;
  margin:0;
  min-height:96px;
  padding:17px max(24px,calc((100vw - 1280px)/2));
  color:#f8efdf;
  background:linear-gradient(118deg,#291b14 0%,#3b271d 62%,#271b15 100%);
  border-bottom:1px solid #9a7545;
}
.header .brand { color:#f8ecd6; letter-spacing:.065em; }
.header .brand-en { color:#f8ecd6; font-size:25px; }
.header nav a { color:#f2e5cf; }
.header nav a:hover,.header .brand:hover { color:#f0c98a; }
.nav-login { border:1px solid #b89a70; border-radius:8px; color:#f6e8d0; }
.nav-login:hover { background:#f9efdd; color:#302016; }
/* Hero composition retains real invitation form and real page text. */
.hero {
  max-width:min(1400px,calc(100% - 44px));
  margin:24px auto 32px;
  border:1px solid #8a6a41;
  border-radius:12px;
  background:
    linear-gradient(91deg,rgba(24,15,11,.97) 0%,rgba(32,20,14,.91) 42%,rgba(30,19,13,.65) 100%),
    url('/proposal-b-lounge.webp') center right/cover no-repeat,
    #291b14;
  color:#fff5e5;
  padding:clamp(32px,5vw,70px) clamp(24px,4.6vw,70px);
  grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);
  gap:clamp(24px,4vw,68px);
  box-shadow:0 16px 40px rgba(42,25,14,.14),inset 0 0 0 1px rgba(228,195,141,.10);
}
.hero h1 {
  font-family:var(--rtb-body);
  color:#fff8ed;
  font-size:clamp(33px,3.35vw,49px);
  font-weight:600;
  line-height:1.5;
  letter-spacing:.015em;
  text-wrap:balance;
}
.hero .eyebrow { color:#e8c68c; font-weight:600; letter-spacing:.06em; }
.hero .intro { color:#f3e8d7; line-height:1.85; }
.hero .text-link { color:#eac790; text-decoration-thickness:1px; }
.hero .text-link:hover { color:white; }
/* Invitation: parchment against lounge; original behavior unchanged. */
.invitation {
  color:#33271e;
  background:linear-gradient(140deg,#fffdf8 0%,#f4ebdd 100%);
  border:1px solid #b99a6a;
  border-radius:12px;
  outline:1px solid rgba(164,125,67,.28);
  outline-offset:-8px;
  padding:clamp(26px,3vw,38px);
  box-shadow:0 8px 0 rgba(28,16,12,.34),0 24px 58px rgba(12,7,5,.23);
}
.invitation h2 { color:#30251e; font-weight:650; }
.invitation p,.invitation .hint { color:#60564d; }
.invitation .section-kicker { color:#966d37; }
.invitation label { color:#392b20; }
.invitation :is(input,select) { background:#fffdfa; border-color:#baa27f; }
.invitation .primary {
  border-color:#9a713c;
  color:#24180e;
  background:linear-gradient(180deg,#e2c99b 0%,#ba925c 100%);
  border-radius:8px;
  font-weight:700;
  box-shadow:0 3px 8px rgba(50,29,11,.12);
}
.invitation .primary:hover:not(:disabled) { background:#ebd4aa; }
/* General UI components across all stages, without changing their placement. */
.primary,.outline,.quiet,.nav-login,
button:not(.performance-scene button) {
  border-radius:8px;
  transition:background-color .15s ease,color .15s ease,border-color .15s ease,box-shadow .15s ease;
}
.primary { color:#fff9ec; background:#352419; border-color:#352419; font-weight:600; }
.primary:hover:not(:disabled) { background:#513a29; }
.outline { border:1px solid #7b5a37; color:#49311e; background:#fffaf2; font-weight:600; }
.outline:hover:not(:disabled) { background:#f1e3ce; }
.quiet { color:#665140; }
button:disabled { opacity:.55; }
input:not([type=radio]), select, textarea {
  border-color:#cbb99d;
  border-radius:7px;
  background:#fffdfa;
  color:#302822;
}
input::placeholder,textarea::placeholder { color:#82766a; opacity:1; }
.badge,.count { color:#5b4027; border-color:#d1ba96; background:#eee2cd; border-radius:5px; }
.section { color:#302822; }
.how { border-top:1px solid var(--line); }
.how h2 { color:#34251a; font-weight:650; }
.step-number {
  display:inline-grid;
  place-items:center;
  min-width:51px;
  min-height:51px;
  padding:5px;
  font-size:23px;
  font-weight:600;
  color:#e9d3b0;
  border:1px solid #ad8952;
  border-radius:50%;
  background:#302016;
}
.steps { gap:15px; }
.steps article {
  border:1px solid #d6c3a6;
  border-radius:10px;
  padding:24px;
  background:#fffaf2;
  box-shadow:0 6px 18px rgba(57,37,21,.055);
}
.steps article:last-child { border:1px solid #d6c3a6; }
.steps h3 { color:#36291e; font-size:21px; }
.bottom-grid { gap:24px; }
.bottom-grid > * {
  padding:26px;
  border:1px solid #d7c3a8;
  border-radius:10px;
  background:#fffaf2;
  box-shadow:0 5px 14px rgba(57,37,21,.05);
}
footer {
  color:#e7d6be;
  background:linear-gradient(140deg,#201710,#36251b);
  border-top:1px solid #b38e54;
}
footer p, footer small { color:#ddcdb8; }
/* Sessions: entrance, script catalog, reading, review and account pages. */
.panel, .script-sheet, .favorites-card, .favorites-status-panel, .profile-favorite-line {
  color:var(--ink);
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:10px;
  box-shadow:0 7px 22px rgba(48,28,17,.05);
}
.script-sheet { border-top:3px solid #b3925f; }
.script-catalog-row { border-radius:9px; }
.script-catalog-thumb { border-radius:8px; }
.choice, .ticket, .your-position, .preview-controls {
  border-color:var(--line);
  border-radius:8px;
}
/* Keep stage/actor artwork, dialogue dimensions, translations and recordings intact. */
.performance-scene { border-color:#9b7a50; border-radius:8px; }
.performance-scene-empty { background:#291c17; }
/* Give shared controls the premium palette without altering their sizing or positioning. */
.performance-main button:not(:disabled),
.reading-grid button:not(:disabled),
.room-main button:not(:disabled) { font-family:var(--rtb-body); }
/* Dialogs including sign-in, account creation, joining, consent & editing. */
dialog {
  color:#302822;
  border:1px solid #b89660;
  border-radius:13px;
  background:#fffaf2;
  box-shadow:0 24px 80px rgba(16,8,5,.36);
}
dialog::backdrop { background:rgba(16,10,7,.72); }
.dialog-body { background:linear-gradient(160deg,#fffcf6 0%,#f7eedf 100%); border-radius:12px; }
.dialog-body h2 { color:#302822; font-family:var(--rtb-body); font-weight:650; }
.dialog-body :is(input,select,textarea) { background:#fffdfa; }
.dialog-body .primary { border-radius:8px; }
/* Dedicated admin and favorites pages share the exact same visual system. */
.favorites-standalone-body { background:#f3ecdf; }
.favorites-site-header {
  background:linear-gradient(115deg,#291b14,#3c2a20);
  color:#f5e7d2;
  border-bottom:1px solid #ab8755;
}
.favorites-brand { color:#f4e6d2; font-weight:650; }
.favorites-header-actions :is(a,button) { color:inherit; }
.favorites-hero h1 { font-family:var(--rtb-body); }
.favorites-list { gap:20px; }
.favorites-card { border-radius:10px; }
.favorites-card-text, .profile-favorite-text { font-family:var(--rtb-body); }
#gift-account-form button { background:#362419; color:#fff8ea; border:1px solid #81623e; }
#gift-account-form input { background:#fffdfa; }
/* Header controls and status must stay legible over the dark hero. */
.header .brand.header-credit {
  font-size:15px !important;
  font-weight:650;
  line-height:1.3 !important;
  white-space:nowrap;
}
.header .language-toggle {
  color:#f5e7d0 !important;
  background:transparent;
  border-color:#b99a6b !important;
  border-radius:8px;
}
.header .language-toggle:hover { color:#24180e !important; background:#e8cca1; }
.hero .integration-auth { color:#dfccb2; }
@media(max-width:650px) {
  .header .brand.header-credit { font-size:13px !important; }
}
/* Mobile layout stays structurally the same; overrides only visual spacing. */
@media (max-width:750px) {
  .header { padding:18px 20px; }
  .hero {
    margin:12px auto 24px;
    max-width:calc(100% - 24px);
    padding:26px 18px;
    gap:24px;
    border-radius:9px;
    background-position:65% center;
  }
  .hero h1 { font-size:clamp(29px,7vw,38px); }
  .invitation { padding:24px 19px; border-radius:9px; }
  .steps { gap:12px; }
  .steps article { padding:18px; }
  .bottom-grid { gap:12px; }
  .bottom-grid > * { padding:20px; }
}
@media (prefers-reduced-motion: reduce) {
  .primary,.outline,.quiet,.nav-login,button { transition:none; }
}