/* YALLY STUDIO public-site palette; keep the browser workflow's existing controls. */
:root{color-scheme:dark;--ys-bg:#191816;--ys-surface:#23221f;--ys-raised:#2e2b26;--ys-line:#454139;--ys-text:#f5f0e7;--ys-muted:#c2bdb3;--ys-red:#ff7767;--ys-gold:#f2ce67;--navy:var(--ys-bg);--ink:var(--ys-text);--muted:var(--ys-muted);--accent:var(--ys-red);--line:var(--ys-line);--bg:var(--ys-bg)}
body{font-family:"Malgun Gothic","Segoe UI",sans-serif;word-break:keep-all}
a{color:var(--ys-gold)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--ys-gold)}
.site-nav{max-width:1440px;margin:auto;padding:22px 40px;min-height:96px;display:flex;align-items:center;gap:30px;border-bottom:1px solid var(--line)}
.site-brand{display:flex;align-items:center;gap:20px;text-decoration:none;color:var(--ink);white-space:nowrap;font-size:30px;font-weight:900;letter-spacing:-1px;line-height:1.3}
.site-brand b{color:var(--accent)}
.site-brand span{border-left:1px solid #64594a;padding-left:20px;font-size:22px;letter-spacing:-.7px}
.site-links{margin-left:auto;display:flex;align-items:center;gap:16px}
.site-links a,.site-links button{display:flex;align-items:center;min-height:48px;padding:10px 14px;border:0;background:transparent;color:var(--ink);font:600 16px/1.5 "Malgun Gothic","Segoe UI",sans-serif;text-decoration:none;white-space:nowrap}
.site-links .current{border-bottom:2px solid var(--accent)}
.site-links button{color:var(--ys-gold);border-left:1px solid #64594a;padding-left:26px}
.site-links a:hover,.site-links button:hover{color:var(--ys-gold)}
main{max-width:1440px;margin:0 auto;padding:38px 40px 40px}
header{margin:0 0 32px;padding-bottom:30px;border-bottom:1px solid #b68a5a;align-items:center}
.hero-copy{min-width:0}
.eyebrow{display:inline-block;background:var(--ys-gold);color:var(--ys-bg);border-radius:999px;padding:6px 17px;font-size:15px;font-weight:800;letter-spacing:0}
h1{font-size:clamp(34px,4.2vw,58px);font-weight:900;letter-spacing:-.055em;line-height:1.22;margin:18px 0 12px}
h1 span{color:var(--accent)}
header p{font-size:18px;max-width:670px}
.hero-character{display:flex;align-items:center;gap:22px;flex-shrink:0;margin-left:20px}
.hero-character img{width:148px;height:170px;object-fit:contain}
.hero-character p{color:var(--ys-gold);font:italic 700 23px/1.2 "Segoe Print","Comic Sans MS",cursive;transform:rotate(-8deg);margin:0}
.layout{grid-template-columns:minmax(0,1fr) 280px;gap:24px}
.panel{background:var(--ys-surface);border-color:var(--line);border-radius:12px;padding:28px}
.step{background:var(--ys-gold);color:var(--ys-bg)}
.section-heading h2{font-size:24px;letter-spacing:-.6px}
.primary{background:var(--accent);color:#211812;border:1px solid var(--accent);box-shadow:none;border-radius:999px;min-height:52px;font-weight:800}
.primary:hover:enabled{background:#ff9386;border-color:#ff9386}
.wide{min-height:58px;padding-inline:25px}
.secondary{background:var(--ys-raised);color:var(--ys-text);border-color:#64594a;border-radius:8px}
.secondary:hover:enabled{background:#39342c;color:var(--ys-gold)}
.danger{color:#ff9a9e}
input:not([type=range]):not([type=checkbox]),select,textarea{background:var(--ys-bg);color:var(--ys-text);border:1px solid #64594a;border-radius:8px}
input::placeholder,textarea::placeholder{color:#b4aa99}
input[type=range],input[type=checkbox],progress{accent-color:var(--ys-gold)}
input:not([type=range]):not([type=checkbox]),select{min-height:48px}
fieldset:disabled{opacity:.72}
.hint,.files small,.review-meta,summary{color:var(--ys-muted)}
.hint{font-size:15px!important}
output{background:#39301e;color:var(--ys-gold)}
.text-button{color:var(--ys-gold)}
.preview-panel,.environment{background:var(--ys-surface);border-color:var(--line);border-radius:12px}
.preview{background:#191816;border:1px solid var(--line);border-radius:8px}
.preview-panel p{color:var(--ys-muted);font-size:14px}
.environment p{font-size:16px}
.privacy{color:var(--ys-gold)}
.privacy p{color:var(--ys-muted);font-size:15px}
.job progress{accent-color:var(--ys-gold)}
.review-row textarea{padding:12px;resize:vertical}
.review-row .grid{margin:14px 0}
#player{background:var(--ys-bg)!important;border:1px solid var(--line);border-radius:8px}
dialog{background:var(--ys-surface);color:var(--ys-text);border-color:#64594a;border-radius:12px}
dialog::backdrop{background:#000a}
.site-footer{max-width:1440px;margin:auto;padding:22px 40px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;color:#b9b1a4;font-size:14px}
@media(min-width:1600px){main{padding:38px 40px 40px}.layout{grid-template-columns:minmax(0,1fr) 300px}}
@media(max-width:1180px){.site-nav{padding:20px 28px}.site-brand{font-size:28px}.site-brand span{font-size:20px}main{margin:0 auto;padding:30px 28px}.layout{grid-template-columns:minmax(0,1fr) 245px;gap:20px}.hero-character img{width:120px;height:145px}.hero-character p{display:none}.panel{padding:24px}}
@media(max-width:900px){main{padding:28px 24px}.site-nav{padding:18px 24px}.site-links{gap:6px}.site-links a,.site-links button{padding:10px;font-size:15px}.hero-character{margin-left:10px}.hero-character img{width:100px;height:125px}.layout{grid-template-columns:minmax(0,1fr) 220px}.section-heading h2{font-size:22px}.site-footer{padding-inline:24px}}
@media(max-width:680px){.site-nav{flex-wrap:wrap;gap:12px;padding:18px 20px 10px}.site-brand{font-size:28px}.site-brand span{font-size:19px}.site-links{width:100%;margin:0;justify-content:space-between;gap:0}.site-links a,.site-links button{font-size:15px;padding:10px 8px}.site-links button{border:0}main{padding:26px 16px 32px}header{flex-direction:row;align-items:center;gap:4px;padding-bottom:24px;margin-bottom:24px}h1{font-size:clamp(30px,7.7vw,45px);margin-top:16px}header p{font-size:16px}.hero-character{margin:0}.hero-character img{width:70px;height:100px}.eyebrow{font-size:13px;padding:6px 12px}.layout{display:flex;flex-direction:column}.panel{padding:22px 18px}.section-heading h2{font-size:21px}.right{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.preview-panel,.environment{padding:15px}.environment p{font-size:15px}.privacy p{font-size:14px}.site-footer{padding:20px;flex-direction:column;gap:6px}}
@media(max-width:380px){.hero-character{display:none}.site-links a,.site-links button{font-size:14px}.site-brand{font-size:26px}.site-brand span{font-size:18px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
