:root{--gap:12px;--radius:10px;--size:40px;--small:40px;--bg:#8b5e34;--panel:#d8c0a8;--text:#482517;--muted:#6b5d55;--size-mobile: 32px;--gap-mobile: 8px;--padding-mobile: 12px}@media (max-width: 768px){:root{--size: var(--size-mobile);--gap: var(--gap-mobile)}}*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;background:var(--bg);color:var(--text);background-image:url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11 18c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7zm48 25c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7zm-43-7c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm63 31c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM34 90c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm56-76c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM12 86c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm28-65c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm23-11c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm-6 60c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm29 22c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zM32 63c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm57-13c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm-9-21c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM60 91c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM35 41c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM12 60c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2z' fill='%23714c27' fill-opacity='0.1' fill-rule='evenodd'/%3E%3C/svg%3E");overflow-x:hidden}.app{max-width:1000px;margin:0 auto;padding:clamp(12px,4vw,24px);min-height:100vh}@media (max-width: 768px){.app{padding:var(--padding-mobile);max-width:100%}}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:clamp(16px,4vw,24px);background:#61371f;padding:clamp(12px,3vw,16px);border-radius:8px;box-shadow:0 4px 12px #0003;border:2px solid #4e2d18;flex-wrap:wrap;gap:12px}@media (max-width: 768px){header{flex-direction:column;align-items:stretch;text-align:center;gap:16px}}.header-controls{display:flex;align-items:center;gap:16px;flex-wrap:wrap}@media (max-width: 768px){.header-controls{flex-direction:column;gap:12px;width:100%}}.mode-selector{display:flex;gap:8px;flex-wrap:wrap}@media (max-width: 768px){.mode-selector{width:100%;justify-content:center}}.mode-selector button{padding:clamp(6px,2vw,8px) clamp(12px,3vw,16px);font-size:clamp(12px,2.5vw,14px);flex:1;min-width:100px}.mode-selector button.primary,.mode-selector button.secondary{text-transform:none!important}h1{font-size:clamp(20px,5vw,30px);margin:0;color:#f8d7a8;font-weight:700;text-transform:uppercase;text-shadow:1px 1px 2px rgba(0,0,0,.5);letter-spacing:1px;text-align:center;flex:1}@media (max-width: 768px){h1{flex:none;width:100%;order:-1}}button{cursor:pointer;border:none}button.primary{background:#61371f;color:#f8d7a8;padding:clamp(4px,1.5vw,6px) clamp(6px,2vw,8px);border-radius:6px;font-weight:700;text-transform:uppercase;box-shadow:0 4px #4e2d18,0 5px 5px #0000004d;transition:all .1s ease;border:1px solid #4e2d18;position:relative;top:0;white-space:nowrap;text-align:center;font-size:clamp(9px,2vw,10px);letter-spacing:.5px;min-width:60px;flex:0 0 auto}button.primary:active{box-shadow:0 1px #4e2d18,0 2px 3px #0000004d;top:3px}button.primary:disabled{opacity:.6;cursor:not-allowed}button.secondary{background:#8b6f5c;color:#f8d7a8;padding:clamp(4px,1.5vw,6px) clamp(8px,2.5vw,10px);border-radius:6px;box-shadow:0 3px #6d574a,0 4px 5px #0003;transition:all .1s ease;border:1px solid #6d574a;position:relative;top:0;font-size:clamp(10px,2.2vw,11px)}button.secondary:active{box-shadow:0 1px #6d574a,0 2px 3px #0003;top:2px}button.action-button{background:#5c4033;border:2px solid #4a3228;border-radius:8px;padding:clamp(8px,2.5vw,10px) clamp(16px,4vw,20px);font-size:clamp(11px,2.3vw,13px);font-weight:400;margin-left:clamp(12px,3vw,16px);box-shadow:0 2px 4px #0003;text-transform:none!important}button.action-button:hover{background:#6b4d40;transform:translateY(-1px)}button.action-button:active{transform:translateY(0);box-shadow:0 1px 2px #0003}section{background:var(--panel);border-radius:8px;margin-bottom:clamp(12px,3vw,16px);border:2px solid #8b6f5c;box-shadow:0 4px 8px #00000026;overflow:hidden}.section-header{background:#61371f;padding:clamp(8px,2.5vw,10px) clamp(12px,3vw,16px);border-bottom:2px solid #8b6f5c}.section-header h2{margin:0;color:#f8d7a8;font-size:clamp(14px,3.5vw,18px);font-weight:700}.section-content{padding:clamp(12px,4vw,20px);min-width:0;overflow-x:auto}.slots{display:flex;gap:var(--gap);background:#b69b82;padding:clamp(4px,1.5vw,6px);border-radius:4px;border:1px solid #8b6f5c;flex-wrap:wrap;justify-content:center}.slot{width:clamp(40px,10vw,50px);height:clamp(40px,10vw,50px);border-radius:50%;background:#e9ecef4d;border:3px solid #756055;transition:transform .06s,box-shadow .06s;box-shadow:inset 0 -2px 4px #0000001a,inset 0 2px 2px #ffffff4d;position:relative;flex-shrink:0}.slot.selected{outline:2px solid #f8d7a8;outline-offset:clamp(2px,.5vw,3px)}.slot[draggable=true]:hover{cursor:grab}.slots.small .slot{width:clamp(40px,10vw,50px);height:clamp(40px,10vw,50px)}.slots{margin-left:clamp(4px,2vw,8px)}.palette{display:flex;flex-direction:column;gap:var(--gap);padding:clamp(12px,3vw,16px);background:#c8a887;border-radius:8px;border:2px solid #8b6f5c;min-width:120px;max-width:140px;flex-shrink:0}@media (max-width: 768px){.palette{flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:center;min-width:auto;max-width:none;width:100%}.palette h3{width:100%;margin-bottom:8px}}.palette h3{margin:0 0 12px;font-size:clamp(14px,3vw,16px);color:var(--text);text-align:center;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.color{width:clamp(40px,10vw,50px);height:clamp(40px,10vw,50px);border-radius:50%;cursor:grab;border:2px solid #6b5d55;box-shadow:inset 0 -3px 5px #0000004d,inset 0 3px 5px #ffffff80;margin:0 auto;transition:transform .2s ease,box-shadow .2s ease;flex-shrink:0}.color:hover,.slot:hover{transform:translateY(-2px);box-shadow:0 8px 20px #00000059}.actions{display:flex;align-items:center;gap:3px;margin-top:0;margin-left:auto;justify-content:flex-end;width:auto;flex-shrink:0;flex-grow:0}.palette-container{display:flex;gap:20px;align-items:flex-start;width:100%;margin-top:20px;min-height:280px;justify-content:center}.remove-drop-zone{flex:1;padding:60px 30px;background:transparent;border:none;text-align:center;color:transparent;font-size:0;transition:none;cursor:default;-webkit-user-select:none;user-select:none;height:300px!important;max-height:none!important;position:relative;z-index:1;border-radius:8px;display:flex;align-items:center;justify-content:center;box-sizing:border-box}@media (max-width: 768px){.actions{justify-content:center;width:100%}}.win-message{color:#fff;font-weight:700;text-align:center;font-size:1.2rem;margin-top:20px;margin-bottom:20px;background:#22c55e;padding:16px;border-radius:8px;border:2px solid #15803d;box-shadow:0 4px 12px #00000026;display:flex;flex-direction:column;align-items:center;gap:8px}.trophy{font-size:2.5rem;margin-bottom:4px;text-shadow:0 2px 4px rgba(0,0,0,.2);animation:trophy-bounce 1s ease infinite alternate}.win-text{text-shadow:1px 1px 1px rgba(0,0,0,.3);letter-spacing:1px}@keyframes trophy-bounce{0%{transform:translateY(0)}to{transform:translateY(-5px)}}.muted{color:var(--text);opacity:.7;font-style:italic;padding:12px;background:#b69b82;border-radius:4px;text-align:center}.history{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}@media (max-width: 768px){.palette-container{flex-direction:column;gap:15px}.remove-drop-zone{height:200px!important;min-height:200px!important;order:2}.palette{order:1}}@media (max-width: 900px){.app{max-width:100%;padding:var(--padding-mobile)}.game-layout{flex-direction:column;align-items:stretch}.guess-container{max-width:none}}@media (max-width: 480px){.palette{padding:12px!important}}.game-layout{display:flex;align-items:center;gap:clamp(6px,2vw,8px);margin-top:clamp(6px,2vw,8px);margin-bottom:clamp(6px,2vw,8px);flex-wrap:wrap;overflow-x:auto}@media (max-width: 768px){.game-layout{flex-direction:column;align-items:stretch;gap:12px;overflow-x:visible}}.game-board{background:#c8a887;border:clamp(4px,2vw,8px) solid #8b6f5c;border-radius:10px;padding:clamp(12px,4vw,20px);box-shadow:0 8px 24px #0000004d;position:relative}.game-board:before{content:"";position:absolute;top:4px;left:4px;right:4px;bottom:4px;border:2px solid rgba(255,255,255,.1);border-radius:6px;pointer-events:none}.guess-container{display:flex;align-items:center;justify-content:center;gap:clamp(4px,1.5vw,8px);padding:clamp(6px,2vw,10px);padding-left:50px;background:#d8c0a8;border-radius:0;margin-bottom:0;flex-grow:1;border-bottom:2px solid #8b6f5c;box-shadow:inset 0 1px 3px #0000001a;width:auto;min-width:0;max-width:100%;min-height:clamp(48px,15vw,64px);flex-wrap:nowrap;overflow:visible;position:relative}@media (max-width: 768px){.guess-container{flex-direction:row;align-items:center;gap:12px;justify-content:flex-start;min-height:56px}.guess-container .slots{flex:1;justify-content:center}}.history{margin:0;padding:0}.history-item{display:flex;align-items:center;justify-content:center;gap:clamp(4px,1.5vw,8px);padding:clamp(6px,2vw,10px);padding-left:50px;background:#d8c0a8;border-radius:0;border-bottom:1px solid #8b6f5c;min-height:clamp(48px,15vw,64px);flex-wrap:nowrap;overflow:hidden;position:relative}@media (max-width: 768px){.history-item{flex-direction:row;align-items:center;gap:12px;justify-content:center;min-height:56px}.history-item .slots{flex:1;justify-content:center}}.history-item .slots,.guess-container .slots{flex-grow:0;flex-shrink:0;flex-basis:auto;max-width:100%;min-width:0}.attempt-number{font-size:14px;font-weight:700;color:var(--text);width:30px;min-width:30px;text-align:center;background:#a18162;height:30px;line-height:30px;border-radius:50%;flex-shrink:0;flex-grow:0;position:absolute;left:0;align-self:center}.attempt-number.current{font-size:16px;color:#fff;background:#61371f}.feedback{display:grid;grid-template-columns:repeat(2,1fr);grid-gap:6px;width:56px;min-width:56px;padding:6px;background:#b69b82;border-radius:5px;border:1px solid #8b6f5c;margin-left:auto;flex-shrink:0;flex-grow:0;justify-items:center}.peg{display:inline-block;width:16px;height:16px;border-radius:50%;border:1px solid #000;box-shadow:inset 0 -2px 3px #0000004d,inset 0 2px 2px #ffffff80}.peg.exact{background:#000;border-color:#000}.peg.partial{background:#fff;border-color:#000}.solution-section{background:#c8a887;border:4px solid #8b6f5c;border-radius:8px;margin-top:16px;box-shadow:0 4px 12px #0003;overflow:hidden}.disclosure{margin:0;padding:0;width:100%}.disclosure summary{padding:12px;font-weight:700;background:#61371f;color:#f8d7a8;cursor:pointer;border-bottom:2px solid #8b6f5c;text-align:center}.solution-item{display:flex;align-items:center;gap:16px;padding:12px;background:#d8c0a8}.solution-number{background:#22c55e;color:#fff;font-size:16px;display:flex;align-items:center;justify-content:center}.solution-slots{flex-grow:0;flex-basis:248px}.solution-feedback{display:flex;align-items:center;justify-content:center;margin-left:auto;width:auto;background:transparent;border:none}.solution-text{font-weight:700;color:#22c55e;font-size:14px;white-space:nowrap}.red{background:linear-gradient(135deg,#ef4444,#b91c1c);border-color:#8c1616;box-shadow:inset 0 -3px 5px #0000004d,inset 0 3px 5px #ffffff80}.blue{background:linear-gradient(135deg,#3b82f6,#1d4ed8);border-color:#1e3a8a;box-shadow:inset 0 -3px 5px #0000004d,inset 0 3px 5px #ffffff80}.green{background:linear-gradient(135deg,#22c55e,#15803d);border-color:#166534;box-shadow:inset 0 -3px 5px #0000004d,inset 0 3px 5px #ffffff80}.yellow{background:linear-gradient(135deg,#f59e0b,#b45309);border-color:#92400e;box-shadow:inset 0 -3px 5px #0000004d,inset 0 3px 5px #ffffff80}.purple{background:linear-gradient(135deg,#a855f7,#6b21a8);border-color:#581c87;box-shadow:inset 0 -3px 5px #0000004d,inset 0 3px 5px #ffffff80}.cyan{background:linear-gradient(135deg,#06b6d4,#0891b2);border-color:#0e7490;box-shadow:inset 0 -3px 5px #0000004d,inset 0 3px 5px #ffffff80}.setup-section{margin-bottom:24px}.setup-instruction{margin-bottom:20px;font-weight:700;color:var(--text);text-align:center;padding:12px;background:#b69b82;border-radius:4px}.computer-game{margin-bottom:24px}.turn-indicator{text-align:center;background:#61371f;color:#f8d7a8;padding:12px;border-radius:8px;margin-bottom:20px;border:2px solid #4e2d18}.turn-indicator h2{margin:0;font-size:18px;font-weight:700}.dual-board{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,4vw,20px);margin-bottom:clamp(16px,4vw,24px)}.dual-board-summary{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,4vw,24px);margin-top:clamp(16px,4vw,24px)}.player-board{border:3px solid #8b6f5c;border-radius:8px;overflow:visible;transition:border-color .3s ease;min-width:min(480px,100%);width:100%}.player-board.active{border-color:#f59e0b;box-shadow:0 0 20px #f59e0b4d}.user-board.active{border-color:#22c55e;box-shadow:0 0 20px #22c55e4d}.computer-board.active{border-color:#3b82f6;box-shadow:0 0 20px #3b82f64d}.player-board .section-header{display:flex;justify-content:space-between;align-items:center}.board-status{font-size:14px;font-weight:700;padding:4px 8px;border-radius:4px}.board-status.win{background:#22c55e;color:#fff}.board-status.lose{background:#ef4444;color:#fff}.shared-palette{display:flex;justify-content:center;align-items:center;gap:var(--gap);padding:clamp(12px,3vw,16px);background:#c8a887;border-radius:8px;border:2px solid #8b6f5c;flex-wrap:wrap}.shared-palette h3{margin:0 clamp(8px,3vw,16px) 0 0;font-size:clamp(14px,3vw,16px);color:var(--text);font-weight:700;text-transform:uppercase;letter-spacing:.5px}@media (max-width: 768px){.shared-palette{flex-direction:column;gap:12px}.shared-palette h3{margin:0 0 8px;width:100%;text-align:center}}.shared-palette .color{width:clamp(40px,10vw,50px);height:clamp(40px,10vw,50px)}.game-finished{margin-bottom:24px}.winner-announcement{margin-bottom:32px}.win-message.user-win{background:#22c55e;border-color:#15803d}.win-message.computer-win{background:#3b82f6;border-color:#1d4ed8}.win-message.draw{background:#f59e0b;border-color:#d97706}.win-details{font-size:14px;opacity:.9;margin-top:8px;font-weight:400}.error-message{background:#fee;border:1px solid #fcc;border-radius:4px;padding:12px;margin:16px 0;color:#c33}.loading-message{background:#eff;border:1px solid #cdf;border-radius:4px;padding:12px;margin:16px 0;color:#36c;text-align:center}.solution-section-inline{margin-top:16px;border-top:1px solid #8b6f5c;padding-top:12px}.solution-section-inline .disclosure{margin:0;padding:0;width:100%}.solution-section-inline .disclosure summary{padding:8px 12px;font-weight:700;background:#b69b82;color:var(--text);cursor:pointer;border-radius:4px;text-align:center;font-size:12px;text-transform:uppercase;letter-spacing:.5px}.solution-section-inline .solution-item{display:flex;align-items:center;gap:12px;padding:8px;background:#d8c0a8;border-radius:4px;margin-top:4px}.solution-section-inline .solution-number{background:#22c55e;color:#fff;font-size:12px;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:50%}.solution-section-inline .solution-slots{flex-grow:1;margin:0}.solution-section-inline .solution-slots .slot{width:24px;height:24px}.solution-section-inline .solution-feedback{display:flex;align-items:center;justify-content:center;width:auto;background:transparent;border:none}.solution-section-inline .solution-text{font-weight:700;color:#22c55e;font-size:11px;white-space:nowrap}@media (max-width: 1000px){.dual-board,.dual-board-summary{grid-template-columns:1fr;gap:16px}}@media (max-width: 900px){.mode-selector{flex-direction:row;gap:8px;width:100%}.mode-selector button{flex:1}.header-controls{flex-direction:column;gap:12px;width:100%}}@media (max-width: 768px){.color,.slot{min-width:44px;min-height:44px}button.primary,button.secondary{min-height:44px;padding:12px 16px;font-size:14px}.feedback{width:auto;min-width:60px}.attempt-number{min-width:40px;min-height:40px;line-height:40px;font-size:16px}}@media (max-width: 480px){:root{--size: 36px;--gap: 6px}.slots{justify-content:center}.palette .color,.shared-palette .color{width:44px;height:44px}}@media (max-width: 900px) and (orientation: landscape){.dual-board{grid-template-columns:1fr 1fr}}@media (max-width: 900px) and (orientation: landscape) and (max-height: 500px){.app{padding:8px}header{margin-bottom:12px;padding:8px 12px}.section-content{padding:12px}}.multiplayer-container{max-width:600px;margin:0 auto}.nickname-prompt{background:var(--panel);border-radius:var(--radius);padding:24px;text-align:center}.nickname-prompt h2{margin-top:0;margin-bottom:16px;color:var(--text)}.nickname-prompt p{margin-bottom:20px;color:var(--muted);line-height:1.5}.nickname-form{display:flex;flex-direction:column;gap:16px;align-items:center}.nickname-input{width:100%;max-width:300px;padding:12px;border:2px solid var(--muted);border-radius:var(--radius);font-size:16px;font-family:inherit;background:#fff;color:var(--text);transition:border-color .2s}.nickname-input:focus{outline:none;border-color:var(--text)}.nickname-input:invalid{border-color:#d32f2f}.multiplayer-lobby{background:var(--panel);border-radius:var(--radius);padding:24px}.lobby-header{text-align:center;margin-bottom:24px;padding-bottom:16px;border-bottom:2px solid var(--muted)}.lobby-header h2{margin:0 0 8px;color:var(--text)}.lobby-header p{margin:0;color:var(--muted);font-size:14px}.players-section{margin-bottom:20px}.players-section h3{margin:0 0 12px;color:var(--text);font-size:18px}.players-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}.player-item{background:#fff;border:2px solid var(--muted);border-radius:var(--radius);padding:12px 16px;display:flex;justify-content:space-between;align-items:center;transition:all .2s}.player-item:hover{border-color:var(--text);transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.player-nickname{font-weight:600;color:var(--text);font-size:16px}.player-status{font-size:12px;padding:4px 8px;border-radius:4px;text-transform:uppercase;font-weight:600}.player-status.available{background:#4caf50;color:#fff}.player-status.in-game{background:#ff9800;color:#fff}.player-status.away{background:#9e9e9e;color:#fff}.lobby-actions{display:flex;justify-content:center;gap:12px;margin-top:20px;padding-top:20px;border-top:2px solid var(--muted)}.empty-lobby{text-align:center;padding:40px 20px;color:var(--muted)}.empty-lobby p{margin:0;font-style:italic}.waiting-screen{background:#fff;border-radius:var(--radius);padding:40px;max-width:500px;margin:0 auto;text-align:center;box-shadow:0 4px 12px #0000001a}.waiting-screen h2{color:var(--text);margin:0 0 16px}.waiting-screen p{color:var(--text);margin:0 0 24px;line-height:1.6}.loading-spinner{font-size:48px;margin:24px 0;animation:spin 2s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.invite-btn,.cancel-invite-btn{padding:6px 12px;font-size:14px;border:none;border-radius:6px;cursor:pointer;font-weight:600;transition:all .2s}.invite-btn{background:var(--text);color:#fff}.invite-btn:hover:not(:disabled){background:#2b2b2b;transform:translateY(-1px);box-shadow:0 2px 4px #0003}.invite-btn:disabled{background:var(--muted);cursor:not-allowed;opacity:.5}.cancel-invite-btn{background:#f44336;color:#fff}.cancel-invite-btn:hover{background:#d32f2f;transform:translateY(-1px);box-shadow:0 2px 4px #f443364d}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;display:flex;justify-content:center;align-items:center;z-index:1000;animation:fadeIn .2s}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-content{background:#fff;padding:30px;border-radius:12px;max-width:400px;width:90%;box-shadow:0 8px 32px #0000004d;animation:slideUp .3s}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-content h3{margin:0 0 16px;color:var(--text);font-size:24px}.modal-content p{margin:0 0 20px;color:var(--text);font-size:16px;line-height:1.5}.modal-actions{display:flex;gap:12px;justify-content:flex-end}.modal-actions button{padding:10px 20px;font-size:16px}@media (max-width: 768px){.nickname-prompt,.multiplayer-lobby{padding:16px}.player-item{padding:10px 12px;flex-wrap:wrap;gap:8px}.player-nickname{font-size:14px;flex:1}.player-status{font-size:10px;padding:3px 6px}.invite-btn,.cancel-invite-btn{font-size:12px;padding:4px 10px}.modal-content{padding:20px;width:85%}.modal-content h3{font-size:20px}.modal-content p{font-size:14px}.modal-actions{flex-direction:column}.modal-actions button{width:100%}}