*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%;font-family:Times New Roman,Times,serif;background:#fff;color:#000}button,input,select,textarea{font:inherit;border:2px solid #000;border-radius:0;background:#fff;color:#000;padding:14px}button{font-weight:700;cursor:pointer}button:hover:not(:disabled){background:#000;color:#fff}button:disabled{opacity:.35;cursor:not-allowed}.landing,.form-page{min-height:100vh;display:grid;place-content:center;padding:24px}.landing{text-align:center}.landing h1{font-size:clamp(64px,12vw,150px);margin:0;line-height:.85}.landing p{letter-spacing:4px}.landing-actions{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:40px}.landing-actions button{font-size:24px;padding:24px}.panel{width:min(560px,92vw);display:grid;gap:14px;border:3px solid #000;padding:24px}.panel h2{font-size:38px;margin:0 0 8px}.panel label{display:grid;gap:6px;font-weight:700}.back{position:fixed;left:20px;top:20px}.fixed-setting{border:2px solid #000;padding:14px;display:flex;justify-content:space-between}.error{border:2px solid #000;padding:12px}.host-screen{min-height:100vh}.host-header{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:3px solid #000;padding:22px 28px}.host-header h1{font-size:50px;margin:0}.host-header p{margin:4px 0;letter-spacing:2px}.join-code{text-align:right}.join-code small{display:block;font-weight:700;letter-spacing:3px}.join-code strong{display:block;font-size:82px;line-height:.9;letter-spacing:10px}.lobby,.center,.loading{min-height:70vh;display:grid;place-content:center;text-align:center;padding:30px}.lobby h2{font-size:42px}.roster{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:20px 0}.roster>div{border:2px solid #000;min-width:170px;min-height:110px;display:grid;place-content:center}.roster .filled{background:#000;color:#fff}.roster b,.roster span{display:block}.loading .spinner{font-size:100px;animation:spin 1s linear infinite}.loading h2{font-size:46px;margin:18px 0 8px}@keyframes spin{to{transform:rotate(360deg)}}.story-layout{display:grid;grid-template-columns:minmax(0,1fr) 420px;min-height:calc(100vh - 130px)}.story-copy{padding:30px;border-right:3px solid #000;display:flex;flex-direction:column;min-height:0}.chapter-label{letter-spacing:3px;font-weight:700}.story-copy h2{font-size:44px;margin:8px 0 20px}.scroll-text{font-size:31px;line-height:1.65;overflow-y:auto;flex:1;padding:10vh 6vw 35vh}.scroll-text .spoken{background:#000;color:#fff}.controls{display:flex;gap:12px;padding-top:16px}.phase-panel{padding:24px;display:flex;flex-direction:column;gap:16px}.phase-panel h3{font-size:38px;margin:0}.timer{font-size:92px;font-weight:700;border:3px solid #000;text-align:center}.choices{display:grid;gap:10px}.choice{border:2px solid #000;padding:12px;display:grid;gap:6px}.choice b{text-transform:uppercase;font-size:20px}.choice em{font-style:normal;font-weight:700}.choice.winner{background:#000;color:#fff}.phone{height:100dvh;display:flex;flex-direction:column;overflow:hidden}.phone>header{display:flex;justify-content:space-between;border-bottom:3px solid #000;padding:16px;font-size:20px}.phone-center{flex:1;display:grid;place-content:center;text-align:center;padding:24px}.phone-center h2{font-size:42px}.phone-title{display:flex;justify-content:space-between;align-items:center;padding:14px;border-bottom:2px solid #000}.phone-title h2{margin:0}.phone-title div{font-size:44px;font-weight:700}.phone-choices{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:0;flex:1;min-height:0}.phone-choices button{border-width:0 2px 2px 0;padding:12px;display:flex;flex-direction:column;justify-content:center;gap:8px;overflow:auto}.phone-choices button:nth-child(2n){border-right:0}.phone-choices button:nth-child(n+3){border-bottom:0}.phone-choices b{font-size:22px}.phone-choices span{font-size:16px}.phone-choices em{font-style:normal}.phone-choices .selected,.phone-choices .winner{background:#000;color:#fff}@media(max-width:900px){.story-layout{grid-template-columns:1fr}.phase-panel{border-top:3px solid #000}.host-header{flex-direction:column}.join-code{text-align:left;margin-top:15px}.roster{grid-template-columns:1fr 1fr}.roster>div{min-width:0}.scroll-text{font-size:24px}}
