.r3o-panel { width: min(100%, 580px); }
.r3o-panel h1 { font-size: clamp(32px,6vw,52px); }
.r3o-status { padding: 12px 0; min-height: 44px; overflow-wrap: anywhere; }
.r3o-form, .r3o-label, .r3o-config label, .r3o-form label { display: grid; gap: 8px; min-width: 0; }
.r3o-form { gap: 16px; }
.r3o-app :is(input,select) { width: 100%; min-width: 0; min-height: 46px; padding: 10px 12px; border: 1px solid var(--game-border); border-radius: 10px; background: var(--game-surface-soft); color: var(--game-text); font: inherit; font-size: 16px; }
.r3o-app :is(input,select):focus-visible { outline: 3px solid var(--r3d-accent); outline-offset: 2px; }
.r3o-app input::placeholder { color: var(--game-text-muted); opacity: 1; }
.r3o-divider { display: flex; gap: 12px; align-items: center; color: var(--game-text-muted); font-size: 12px; }
.r3o-divider::before, .r3o-divider::after { content: ''; flex: 1; height: 1px; background: var(--game-border); }
.r3o-code { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; padding: 12px 0; }
.r3o-code strong { font: 800 clamp(22px,5vw,30px) monospace; letter-spacing: .1em; }
.r3o-code button { width: auto; }
.r3o-players { list-style: none; display: grid; gap: 8px; margin: 8px 0 18px; padding: 0; }
.r3o-players li { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; justify-content: space-between; padding: 12px; border: 1px solid var(--game-border); border-radius: 10px; background: var(--game-surface-soft); overflow-wrap: anywhere; }
.r3o-players small { color: var(--game-text-muted); }
.r3o-config { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; min-width: 0; border: 1px solid var(--game-border); border-radius: 12px; padding: 14px; margin: 20px 0 12px; }
.r3o-config legend { font-size: 12px; color: var(--game-text-muted); padding: 0 6px; }
.r3o-config button { grid-column: 1/-1; }
.r3o-config:disabled { opacity: .8; }
.r3o-panel .r3d-actions, #r3oResults .r3d-actions { margin-top: 16px; }
.r3o-ranking { position: absolute; right: 12px; top: 100px; max-width: min(45%,240px); padding: 10px 10px 10px 30px; border: 1px solid var(--game-border); border-radius: 10px; background: var(--game-surface); color: var(--game-text); font-size: 12px; pointer-events: none; }
.r3o-ranking li { padding: 3px 0; overflow-wrap: anywhere; }
.r3o-ranking .is-player { color: var(--r3d-accent); font-weight: 800; }
.r3o-app .r3d-standings li > span { min-width: 0; overflow-wrap: anywhere; }
.r3o-app .r3d-standings time { flex-shrink: 0; }
.r3o-app .r3d-secondary { line-height: 1.55; }
@media (max-height: 500px) { .r3o-ranking { top: 85px; font-size: 10px; padding-top: 5px; padding-bottom: 5px; } }
@media (max-width: 380px) { .r3o-config { padding: 10px; gap: 10px; } }