/* MiroTalk P2P customization for conf.smirnov.su, 2026-10-01. AGPL-3.0. */
:root{color-scheme:light;--accent:#087f87;--ink:#222c30;--muted:#657075;--line:#dee4e2;--base:#f7f9f7}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{min-width:320px;background:var(--base)}
body{margin:0;color:var(--ink);font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif;font-size:16px;-webkit-font-smoothing:antialiased}
button,input{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
button{cursor:pointer}
button:disabled{cursor:wait;opacity:.68}
a{color:inherit}
button:focus-visible,a:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
.studio-page{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;max-width:1440px;margin:auto}
.studio-header{padding:29px 6%;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line)}
.wordmark{font-size:22px;font-weight:600;letter-spacing:-.8px;display:flex;align-items:center;gap:10px;text-decoration:none;white-space:nowrap}
.brand-dot{width:10px;height:10px;background:var(--accent);border-radius:50%;flex-shrink:0}
.brand-slash{color:#a4abaa;font-weight:400;margin:0 5px}
.domain{font-size:13px;color:var(--muted)}
.studio-main{width:100%;max-width:1180px;margin:auto;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:center;padding:56px 5%;gap:7%;flex:1}
.kicker{font-size:12px;letter-spacing:1.8px;font-weight:600;color:var(--accent);margin:0 0 17px}
h1{font-size:clamp(33px,3.7vw,50px);line-height:1.13;letter-spacing:-1.8px;font-weight:600;margin:0}
.hero-art{height:360px;margin-top:24px;display:flex;align-items:center;justify-content:center}
.hero-art img{display:block;height:100%;width:auto;max-width:100%;object-fit:contain;mix-blend-mode:multiply}
.auth-panel{background:#fff;border:1px solid var(--line);border-radius:14px;padding:36px;box-shadow:0 10px 35px #17302c05;min-width:0}
h2{font-size:29px;line-height:1.2;letter-spacing:-.8px;font-weight:600;margin:0 0 15px}
.intro{font-size:15px;line-height:1.65;color:var(--muted);margin:0 0 29px}
label{display:block;font-size:13px;font-weight:500;margin:0 0 8px}
input{display:block;background:#fff;border:1px solid var(--line);border-radius:9px;color:var(--ink);padding:13px 14px;width:100%;font-size:16px;line-height:1.3;min-height:48px;margin:0 0 21px}
input::placeholder{color:var(--muted);opacity:1}
input:focus{outline:2px solid var(--accent);outline-offset:2px}
input[aria-invalid="true"]{border-color:#aa3737}
.password-field,.room-field{position:relative}
.password-field input{padding-right:95px}
.password-field button{position:absolute;right:8px;top:8px;padding:8px 9px;min-height:32px;border:0;background:transparent;color:var(--muted);font-size:12px;border-radius:5px}
.room-field input{padding-right:49px;margin-bottom:8px}
.room-field button{position:absolute;right:7px;top:5px;width:39px;height:39px;border:0;border-radius:6px;color:var(--accent);background:#edf6f5;font-size:25px}
.primary{width:100%;border:0;background:var(--accent);color:#fff;min-height:48px;border-radius:9px;padding:13px 16px;display:flex;gap:10px;align-items:center;justify-content:center;font-size:15px;font-weight:600;margin-top:24px}
.primary:hover:not(:disabled){background:#066d74}
.button-arrow{margin-left:auto;font-size:23px;font-weight:400;line-height:1}
.helper{font-size:13px;line-height:1.6;color:var(--muted);margin:18px 0 0}
.field-hint{font-size:12px;line-height:1.5;color:var(--muted);margin:0}
.error{color:#a43232;font-size:13px;line-height:1.55;margin:16px 0 0}
.invitation{border-top:1px solid var(--line);margin-top:26px;padding-top:24px}
.invitation input{font-size:13px;margin-bottom:13px;background:#fbfcfb}
.secondary{background:#fff;color:var(--accent);border:1px solid #b8d8d7;border-radius:8px;padding:11px 14px;min-height:43px;font-size:13px;width:100%;font-weight:500}
.secondary:hover{background:#f0f8f7}
.notice{font-size:13px;line-height:1.6;color:var(--accent);margin:12px 0 0;min-height:0}
.notice:empty{margin:0}
.text-button{border:0;background:transparent;color:var(--muted);font-size:12px;text-decoration:underline;text-underline-offset:4px;padding:10px 0;min-height:40px;margin-top:10px}
.studio-footer{padding:22px 6%;border-top:1px solid var(--line);font-size:12px;line-height:1.6;color:var(--muted);display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px}
.footer-links{display:flex;flex-wrap:wrap;gap:16px}
.footer-links a{text-decoration:none}
.footer-links a:hover{text-decoration:underline;text-underline-offset:3px}
.legal-content{max-width:760px;margin:50px auto;padding:0 24px 40px;line-height:1.75}
.legal-content h1{font-size:34px;line-height:1.25;margin-bottom:26px}
.legal-content h2{font-size:22px;margin-top:32px;line-height:1.35}
.legal-content a{color:var(--accent);text-underline-offset:3px}
@media(max-width:850px){.studio-header{padding:24px 5%}.studio-main{padding:42px 5%;gap:5%}.auth-panel{padding:27px}.hero-art{height:300px}h2{font-size:26px}.studio-footer{padding:21px 5%}}
@media(max-width:650px){.studio-header{padding:23px;gap:14px}.wordmark{font-size:20px}.domain{font-size:11px}.studio-main{display:flex;flex-direction:column;align-items:stretch;padding:28px 22px 38px;gap:29px}.hero{display:grid;grid-template-columns:minmax(0,1fr) 100px;gap:9px;align-items:center}.kicker{font-size:11px;letter-spacing:1.5px}.hero h1{font-size:30px;letter-spacing:-1.1px}.hero-art{height:160px;margin:0}.auth-panel{padding:28px 24px}h2{font-size:27px}.studio-footer{padding:21px 23px;flex-direction:column;gap:11px}.footer-links{gap:16px}.legal-content{margin-top:32px}}
@media(max-width:380px){.studio-header{flex-direction:column;align-items:flex-start;gap:8px}.studio-main{padding-left:18px;padding-right:18px}.hero{grid-template-columns:minmax(0,1fr) 82px}.hero h1{font-size:27px}.hero-art{height:142px}.auth-panel{padding:26px 21px}.primary{font-size:14px}.password-field button{font-size:11px}.footer-links{gap:12px}}
@media(prefers-reduced-motion:no-preference){button{transition:background .15s ease,opacity .15s ease}}
