.online-screen{max-width:620px;margin:auto;padding-bottom:40px}.online-screen h1{font-size:clamp(24px,6vw,36px);margin:8px 0}.online-paper,.online-recovery{background:#faf6e9;color:#142e29;border:1px solid #d7bf74;border-radius:14px;padding:20px}.online-screen label{display:flex;flex-direction:column;gap:6px;flex:1;min-width:0}.online-screen input,.online-screen select{width:100%;font:inherit;padding:12px;border-radius:8px;border:1px solid #b8ad94;background:#fffdf4;color:#18352d;box-sizing:border-box}.online-screen button{min-height:44px}.room-code{font:700 clamp(28px,8vw,42px)/1.3 ui-monospace,monospace;letter-spacing:.13em;user-select:all;text-align:center}.room-members>div{display:flex;justify-content:space-between;gap:12px;padding:14px 0;border-bottom:1px solid #d3cbb9}.online-connection{position:fixed;z-index:100;top:0;left:50%;transform:translateX(-50%);padding:4px 12px;border-radius:0 0 10px 10px;background:#713b23;color:white;font-size:12px;pointer-events:none}.online-connection.connected{background:#143f32;opacity:.9}.online-room-button{font-size:11px;padding:3px 6px;min-width:0}.online-recovery input{font:15px ui-monospace,monospace}.online-screen .help{line-height:1.55}.online-screen .notice{color:#ffe9ab}.online-screen .row{gap:10px}

.online-settings{position:relative}.online-settings::after{content:'';position:absolute;width:5px;height:5px;background:#8edeb3;border-radius:50%;right:3px;top:3px}
.online-paper .help,.online-recovery .help{color:#555e4d;opacity:1}.online-paper .row{flex-wrap:wrap}
.room-members small{font-size:11px;color:#6b531d;white-space:nowrap}.room-members span{white-space:nowrap}.room-paused,.room-confirm{padding:12px;background:#f1dfbd;border-radius:8px;color:#503515}.room-management .danger{background:#713b32;color:#fff2dc}.room-management details button{display:block;width:100%;margin-top:8px}