/* Shared visual values taken from yasready.com on 2026-09-27.
   Loaded last so legacy Studio theme layers cannot replace the platform palette. */
:root,:root[data-theme="dark"]{
 color-scheme:dark;
 --bg:#07090e;--panel:#10141c;--panel2:#151a24;--ink:#f7f8fb;
 --muted:#a7afbd;--line:rgba(255,255,255,.10);--paper:#10141c;
 --dark:#0d1117;--green:#5bd69a;--green-soft:rgba(91,214,154,.11);--lime:#c6ff00;
 --yr-bg:var(--bg);--yr-panel:var(--panel);--yr-panel2:var(--panel2);
 --yr-text:var(--ink);--yr-muted:var(--muted);--yr-line:var(--line);
 --yr-ready:var(--lime);--yr-accent:#16815c;--yr-accent2:#16815c;--yr-teal:var(--green);
 --text:var(--ink);
 font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Arial,sans-serif;
}
html[data-theme="light"]{
 color-scheme:light;
 --bg:#f4f5f8!important;--panel:#fff!important;--panel2:#f0f2f6!important;
 --ink:#141720;--muted:#5d6572!important;--line:rgba(20,24,34,.12)!important;
 --paper:#fff;--dark:#111713;--green:#16815c;--green-soft:#e7f5ee;--lime:#c6ff00;
 --text:var(--ink)!important;
}
html[data-theme] body:not(.obs-page){
 background:radial-gradient(circle at 78% -8%,color-mix(in srgb,var(--green) 11%,transparent),transparent 31rem),radial-gradient(circle at 48% -10%,rgba(198,255,0,.045),transparent 25rem),var(--bg)!important;
 color:var(--ink)!important;
 font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Arial,sans-serif;
}
button,input,select,textarea{font-family:inherit}
html[data-theme] .yr-btn.primary,html[data-theme] .btn.primary,html[data-theme] .btn.teal{
 background:linear-gradient(120deg,#127351,#16815c)!important;color:#fff!important;
 border-radius:50px;border-color:transparent!important;
}
html[data-theme] .yr-btn,html[data-theme] .btn{
 border-radius:50px;font-size:14px;font-weight:700;min-height:49px;padding:14px 22px;
}
html[data-theme] .yr-btn:not(.primary),html[data-theme] .btn:not(.primary):not(.teal):not(.danger){
 background:var(--panel)!important;color:var(--ink)!important;border-color:var(--line)!important;
}
html[data-theme] .calm-launch-card small,html[data-theme] .eyebrow{color:var(--green)}
html[data-theme] .calm-launch-card,html[data-theme] .calm-session-picker,html[data-theme] .card,html[data-theme] .panel{
 background:var(--panel)!important;color:var(--ink)!important;border-color:var(--line)!important;
}
html[data-theme] .calm-launch-card{border-radius:16px}
html[data-theme] .calm-launch-card.primary-choice{background:var(--panel)!important}
html[data-theme] .calm-launch-icon{background:var(--green-soft);color:var(--green)}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #80b52e;outline-offset:4px}
/* Studio needs the same generous reading scale as yasready.com.  These rules
   intentionally sit after the legacy app styles, which were designed for a
   compact operator console rather than a host-facing workspace. */
html[data-theme] body{font-size:16px;line-height:1.5}
html[data-theme] .topbar{min-height:82px;padding:16px clamp(24px,4vw,72px);background:color-mix(in srgb,var(--bg) 92%,transparent)}
html[data-theme] .brand strong{font-size:20px;letter-spacing:-.025em}
html[data-theme] .brand span,html[data-theme] .episode-chip small{font-size:13px}
html[data-theme] .cr-nav a,html[data-theme] .cr-nav button{min-height:44px;padding:0 14px;font-size:13px}
html[data-theme] main{width:min(1540px,calc(100% - 64px));padding:38px 0 112px}
html[data-theme] .stage-nav{gap:14px;margin-bottom:36px}
html[data-theme] .stage-nav button{min-height:82px;grid-template-columns:46px 1fr;padding:17px 19px;border-radius:20px;font-size:15px}
html[data-theme] .stage-nav button span{width:46px;height:46px;font-size:15px}
html[data-theme] .stage-nav button small{font-size:13px}
html[data-theme] .page-head,html[data-theme] .control-head{margin:12px 0 30px}
html[data-theme] .page-head h1,html[data-theme] .control-head h1{font-size:clamp(44px,4.4vw,70px);line-height:1.02}
html[data-theme] .page-head p,html[data-theme] .control-head p{max-width:760px;font-size:17px;line-height:1.55}
html[data-theme] .eyebrow{font-size:12px;letter-spacing:.16em}
html[data-theme] .grid{gap:22px}
html[data-theme] .card{padding:30px;border-radius:24px;box-shadow:0 20px 55px rgba(0,0,0,.16)}
html[data-theme] .card h2{font-size:25px;letter-spacing:-.03em}
html[data-theme] .card h3{font-size:20px;letter-spacing:-.02em}
html[data-theme] .card p,html[data-theme] .muted{font-size:15px;line-height:1.55}
html[data-theme] .field{gap:9px;margin-top:18px}
html[data-theme] .field label{font-size:12px;letter-spacing:.085em}
html[data-theme] .input,html[data-theme] .textarea{min-height:50px;padding:14px 16px;border-radius:15px;font-size:16px}
html[data-theme] .textarea{min-height:126px}
html[data-theme] .btn,html[data-theme] .yr-btn{min-height:52px;padding:14px 23px;font-size:15px}
html[data-theme] .btn.large{min-height:58px;padding:16px 25px;font-size:17px}
html[data-theme] .calm-start-card{padding:32px!important;border-color:color-mix(in srgb,var(--green) 35%,var(--line))!important;background:linear-gradient(145deg,color-mix(in srgb,var(--green) 13%,var(--panel)),var(--panel))!important}
html[data-theme] .calm-start-card h2{font-size:29px}
html[data-theme] .participant-card,html[data-theme] .empty-state{padding:17px;border-radius:18px}
html[data-theme] .participant-top b{font-size:16px}
html[data-theme] .participant-top span{font-size:13px}
@media(max-width:680px){html[data-theme] main{width:min(100% - 28px,1540px);padding:22px 0 70px}html[data-theme] .topbar{min-height:68px;padding:10px 14px}html[data-theme] .card{padding:21px}html[data-theme] .page-head h1,html[data-theme] .control-head h1{font-size:40px}html[data-theme] .page-head p,html[data-theme] .control-head p{font-size:16px}}
/* Full Studio shell: use the same generous, calm hierarchy on Home, People,
   Templates and Settings—not a separate dense back-office visual language. */
html[data-theme] .yr-app{min-height:100vh;background:radial-gradient(circle at 72% 0%,rgba(91,214,154,.12),transparent 34rem),var(--bg)}
html[data-theme] .yr-sidebar{width:296px;padding:28px 20px;background:color-mix(in srgb,var(--panel) 94%,transparent);border-right:1px solid var(--line)}
html[data-theme] .yr-brand{gap:12px;padding:4px 8px 23px}.yr-brand strong{font-size:21px;letter-spacing:-.035em}.yr-brand span{font-size:14px;color:var(--green)}
html[data-theme] .yr-logo{width:48px;height:48px;border-radius:15px;background:var(--ink);color:var(--bg);font-size:28px}.yr-logo:after{width:10px;height:10px;right:5px;bottom:5px}
html[data-theme] .yr-nav{gap:7px}.yr-nav a,html[data-theme] .yr-nav-more summary{min-height:48px;padding:0 13px;border-radius:14px;font-size:15px;font-weight:750}.yr-nav a.active,html[data-theme] .yr-nav a:hover{background:var(--green-soft);color:var(--ink)}
html[data-theme] .workspace-mini{padding:16px;border-radius:16px;background:var(--panel2);font-size:14px}.workspace-mini small{font-size:11px}.workspace-mini strong{font-size:16px}
html[data-theme] .theme-button{min-height:46px;font-size:14px}.yr-version{font-size:11px}
html[data-theme] .yr-main{max-width:1540px;padding:54px clamp(28px,5vw,92px) 110px}.yr-top,.calm-home-head{gap:28px;margin-bottom:40px}.yr-top h1,.calm-home-head h1{font-size:clamp(46px,4.4vw,72px);letter-spacing:-.055em;line-height:1.02}.yr-top p,.calm-home-head p{font-size:17px;line-height:1.55;max-width:760px}
html[data-theme] .calm-launch-grid{gap:22px}.calm-launch-card{min-height:270px;padding:31px;border-radius:25px}.calm-launch-card h2{font-size:30px}.calm-launch-card p{font-size:16px;line-height:1.55}.calm-launch-card strong{font-size:16px}.calm-launch-icon{width:58px;height:58px;border-radius:18px;font-size:23px}
html[data-theme] .calm-launch-card.primary-choice{background:linear-gradient(145deg,rgba(91,214,154,.18),rgba(22,129,92,.08) 58%,var(--panel))!important;border-color:color-mix(in srgb,var(--green) 44%,var(--line))!important}.calm-launch-card.primary-choice .calm-launch-icon{background:var(--green)!important;color:#07110f}.calm-launch-card.solo-choice{background:color-mix(in srgb,var(--panel) 92%,var(--panel2))!important}.calm-launch-card.solo-choice .calm-launch-icon{background:var(--panel2)!important;color:var(--muted)}
html[data-theme] .calm-session-picker,html[data-theme] .settings-section,html[data-theme] .panel{padding:30px;border-radius:24px}.calm-session-picker h2,.settings-section h2{font-size:27px}.calm-session-picker p,.settings-section p{font-size:16px;line-height:1.55}.calm-use-grid{gap:13px}.calm-use-card{min-height:110px;padding:18px;border-radius:17px}.calm-use-card b{font-size:16px}.calm-use-card small{font-size:14px;line-height:1.4}
html[data-theme] .calm-utility-row{margin-top:30px;padding:18px 20px;border-radius:18px;font-size:15px;gap:13px}.calm-utility-row a{padding:8px 11px}
html[data-theme] .settings-grid{gap:22px}.settings-section{border-color:var(--line)!important}.settings-section label{font-size:13px}.settings-section input,.settings-section select,.settings-section textarea{min-height:52px;padding:14px 16px;font-size:16px;border-radius:15px}
@media(max-width:960px){html[data-theme] .yr-sidebar{width:240px}html[data-theme] .yr-main{padding:38px 34px 80px}}
@media(max-width:760px){html[data-theme] .yr-sidebar{width:100%;padding:14px;position:static;border-right:0;border-bottom:1px solid var(--line)}html[data-theme] .yr-main{padding:30px 20px 70px}html[data-theme] .yr-top h1,html[data-theme] .calm-home-head h1{font-size:42px}.calm-launch-card{min-height:220px;padding:24px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn,.yr-btn,.calm-launch-card{transition:none}}