@charset "UTF-8";
/**
 * Design tokens from Figma「直播」file LkFbbPv85mRyu0GmPFVaLS
 * PC live: 70:1519 | Mobile live: 70:1289 | Mobile login: 70:2215
 * Password gate: 70:1781
 */
:root {
  /* ── Surfaces (PC 70:1519) ── */
  --live-bg-page: #12100a;
  --live-bg-page-fallback: #12100a;
  --live-bg-header: #231b14;
  --live-bg-sidebar: #1b140e;
  --live-bg-panel: #1b140e;
  --live-bg-panel-border: rgba(138, 111, 82, 0.3);
  --live-bg-pill: #291f16;
  --live-bg-pill-alt: #322619;
  --live-bg-input: #322619;
  --live-bg-input-border: rgba(138, 111, 82, 0.4);
  --live-bg-bubble-other: #32251a;
  --live-bg-toolbar-btn: #322619;
  --live-bg-video-bar: #322619;

  /* ── Gold brand gradient ── */
  --live-gold-start: #f3b17d;
  --live-gold-end: #fef0e7;
  --live-gold-accent: #f7ceaf;
  --live-gold-warm: #ffe2bc;
  --live-gold-text-on: #462a18;
  --live-gold-border: #c37d4b;
  --live-gold-outline: #f7caa7;
  --live-gold-mobile-border: #735d44;
  --live-gold-brown-border: #8a6f52;

  --live-gradient-primary: linear-gradient(90deg, #f3b17d 5%, #fef0e7 100%);
  --live-gradient-primary-btn: linear-gradient(90deg, #f3b17d 8%, #fef0e7 100%);
  --live-gradient-bubble-self: linear-gradient(
    -90deg,
    #f3b17d 7%,
    #fef0e7 137%
  );
  --live-gradient-title: linear-gradient(90deg, #f3b17d 5.6%, #fef0e7 107%);
  --live-gradient-logo: linear-gradient(69deg, #f3b17d 9%, #fef0e7 93%);
  --live-gradient-badge: linear-gradient(-90deg, #f3b179 0%, #ffe2ce 100%);
  --live-gradient-border: linear-gradient(
    106.54deg,
    #f3b17d 38.55%,
    #aedbda 83.83%
  );

  /* Legacy alias → gold (replaces old blue primary) */
  --live-primary: #f3b17d;
  --live-primary-hover: #e0a06a;
  --live-primary-alt: #f3b17d;
  --live-accent: #f7caa7;

  /* ── Text ── */
  --live-text: #ffffff;
  --live-text-body: #fff8f2;
  --live-text-accent: #f7ceaf;
  --live-text-muted: #fadac3;
  --live-text-placeholder: rgba(255, 231, 213, 0.7);
  --live-text-time: rgba(250, 218, 195, 0.6);
  --live-text-subtle: rgba(255, 255, 255, 0.8);

  /* ── Chat bubbles (PC) ── */
  --live-bubble-other: #32251a;
  --live-bubble-self: #f3b17d;
  --live-bubble-self-text: #462a18;
  --live-bubble-radius-other: 20px;
  --live-bubble-radius-self: 20px 0 20px 20px;

  /* ── Layout ── */
  --live-header-height: 88px;
  --live-radius-sm: 6px;
  --live-radius-md: 12px;
  --live-radius-lg: 20px;
  --live-radius-pill: 27px;
  --live-radius-input: 15px;
  --live-radius-btn-pill: 90px;

  /* ── Modal / login surfaces ── */
  --live-modal-bg: rgba(20, 20, 25, 0.9);
  --live-modal-inner: #0a0806;
  --live-login-bg: #040301;
  --live-login-input-bg: rgba(50, 38, 25, 0.7);
  --live-login-input-border: #735d44;

  /* ── Mobile live (70:1166 / 70:1289) ── */
  --live-mobile-bg: #161009;
  --live-mobile-bubble-other: #32251a;
  --live-mobile-bubble-self: linear-gradient(-90deg, #f3b17d 7%, #fef0e7 137%);
  --live-mobile-input-capsule: #322619;
  --live-mobile-input-border: rgba(138, 111, 82, 0.4);
  --live-mobile-tool-bg: #261c13;
  --live-mobile-send: linear-gradient(90deg, #f3b17d 8%, #fef0e7 100%);
  --live-mobile-text-time: rgba(250, 218, 195, 0.6);

  /* Brand / toolbar assets (Figma export → images/v2) */
  --live-brand-logo: url(../images/v2/logo.png);
  --live-icon-magic: url(../images/v2/mofa.png);
  --live-icon-like: url(../images/v2/dianzan.png);
  --live-icon-sign: url(../images/v2/qiandao.png);
  --live-icon-play: url(../images/v2/play.png);
  --live-icon-voice: url(../images/v2/voice.png);
  --live-icon-fullscreen: url(../images/v2/full-screen.png);
  --live-icon-lesson: url(../images/v2/lession-icon.png);
  --live-bg-left: url(../images/v2/bg-left.png);

  /* Video control bar (Figma 70:1537 PC / 70:1166 mobile) */
  --live-video-bar-height: 58px;
  --live-video-bar-height-mobile: 36px;
  --live-video-icon-size: 28px;
  --live-video-icon-size-mobile: 20px;
  --live-video-bar-padding-x: 22px;
  --live-video-bar-radius: 0 0 12px 12px;

	/* ── Shadows ── */
	--live-shadow-panel: 0 10px 30px rgba(0, 0, 0, 0.25);
	--live-shadow-modal: 0 0 30px rgba(0, 0, 0, 0.5);

	/* ── Sign-in modal (Figma 70:2027 / Rectangle 5904) ── */
	--live-sign-modal-radius: 21px;
	--live-sign-modal-inner-radius: 20px;
	--live-sign-day-card-radius: 8px;
	--live-sign-day-bg: rgba(255, 255, 255, 0.1);
	--live-sign-day-today-bg: rgba(243, 177, 125, 0.15);
	--live-sign-btn-active: #ffdb27;
	--live-sign-btn-done: #5c656f;
	--live-sign-points-btn: #ffda89;
}