.oc{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:start}@media(max-width:900px){.oc{grid-template-columns:minmax(0,1fr);gap:16px}}.oc .oc-stage{position:static;gap:12px;background:#1f6b4a;border-color:#18573c;color:#fff}.oc .oc-opps{width:100%;display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.oc .oc-opp{flex:1 1 0;min-width:0;max-width:220px;padding:8px 10px;border-radius:14px;background:#0003;border:2px solid transparent;display:flex;flex-direction:column;gap:4px;align-items:center}.oc .oc-opp.now{border-color:#ffd23f}.oc .oc-opp.out{opacity:.45}.oc .oc-opp em{font-style:normal;color:#ffd23f;font-weight:800}.oc .oc-backs{display:flex;height:30px}.oc .oc-backs i{width:20px;height:30px;margin-left:-12px;border-radius:3px;border:1.5px solid #fff;background:repeating-linear-gradient(45deg,#2c5bd1 0 3px,#3b6ae0 3px 6px)}.oc .oc-backs i:first-child{margin-left:0}.oc .oc-table{position:relative;width:100%;display:flex;align-items:center;justify-content:center;gap:18px;padding:14px 0;min-height:170px}.oc .oc-deck{display:flex;flex-direction:column;align-items:center;gap:4px}.oc .oc-side{display:flex;flex-direction:column;gap:6px;align-items:flex-start;min-width:92px}.oc .oc-dir{font-size:28px;line-height:1}.oc .oc-info{display:flex;flex-direction:column;gap:4px}.oc .oc-info span{font-size:13px;font-weight:800;padding:3px 8px;border-radius:999px;background:#fff;color:var(--ink);white-space:nowrap}.oc .oc-info .oc-atk{background:#ff5a47;color:#fff}.oc .oc-info .oc-suit.red{color:#d42a2a}.oc .oc-card{--w: 58px;position:relative;display:inline-flex;flex-direction:column;justify-content:space-between;width:var(--w);height:calc(var(--w) * 1.4);padding:4px 5px;border-radius:8px;background:#fff;color:#1b1b1b;box-shadow:0 2px 4px #0000004d;font-weight:800;line-height:1;flex:none}.oc .oc-card b{font-size:calc(var(--w) * .34)}.oc .oc-card i{font-style:normal;align-self:flex-end;font-size:calc(var(--w) * .42)}.oc .oc-card.red{color:#d42a2a}.oc .oc-card.joker b{font-size:calc(var(--w) * .2);letter-spacing:-.03em}.oc .oc-card.joker i{align-self:center;font-size:calc(var(--w) * .6)}.oc .oc-card.joker.color i{color:#e5484d;text-shadow:2px 0 #ffb020,-2px 0 #3563ff}.oc .oc-card.back{background:repeating-linear-gradient(45deg,#2c5bd1 0 4px,#3b6ae0 4px 8px);border:3px solid #fff}.oc .oc-pile .oc-card{--w: 84px}.oc .oc-deck .oc-card{--w: 70px}.oc .oc-msg{margin:0;min-height:1.4em;font-weight:800;color:#fff;text-align:center}.oc .oc-me{width:100%;padding:10px;border-radius:16px;background:#0000002e;border:2px solid transparent}.oc .oc-me.now{border-color:#ffd23f}.oc .oc-mehd{display:flex;justify-content:space-between;margin-bottom:8px}.oc .oc-hand{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}.oc .oc-hand .oc-card{cursor:pointer;transition:transform .12s}.oc .oc-hand .oc-card.ok{transform:translateY(-6px);box-shadow:0 0 0 3px #ffd23f,0 4px 8px #0000004d}.oc .oc-hand .oc-card.no{filter:brightness(.72)}.oc .oc-hand .oc-card.shake{animation:nudge .3s}.oc .stage-actions .btn:not(.btn-primary){background:#fff;color:var(--ink)}.oc .oc-one.hot{animation:oc-pulse .8s infinite}@keyframes oc-pulse{50%{transform:scale(1.08);box-shadow:0 0 0 6px #ffd23f99}}.oc .oc-log{list-style:none;margin:0;padding:0;width:100%;font-size:14px;text-align:center;color:#ffffffe6}.oc .oc-log li:not(:first-child){opacity:.6;font-size:13px}.oc .end-card{color:var(--ink)}.oc .oc-suits{display:flex;gap:8px}.oc .oc-suits button{width:52px;height:52px;border-radius:12px;border:1.5px solid var(--line);background:#fff;font-size:28px;color:#1b1b1b}.oc .oc-suits button.red{color:#d42a2a}@media(max-width:560px){.oc .oc-stage{padding:12px 8px}.oc .oc-card{--w: 46px}.oc .oc-pile .oc-card{--w: 70px}.oc .oc-deck .oc-card{--w: 56px}.oc .oc-table{gap:12px}.oc .oc-hand{gap:4px}}@media(orientation:landscape)and (max-height:500px)and (pointer:coarse){.oc{grid-template-columns:minmax(0,1fr)}.oc .oc-stage{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);grid-template-rows:auto 1fr auto;column-gap:12px;row-gap:6px;align-items:start;min-height:100dvh;padding:10px;border-radius:0}.oc .oc-opps{grid-column:1;grid-row:1}.oc .oc-table{grid-column:1;grid-row:2;min-height:0;padding:4px 0;align-self:center}.oc .oc-msg{grid-column:1;grid-row:3;font-size:14px}.oc .oc-me{grid-column:2;grid-row:1 / 3;padding:8px}.oc .oc-stage>.stage-actions{grid-column:2;grid-row:3}.oc .oc-log{grid-column:1 / -1;grid-row:4;font-size:13px}.oc .oc-card{--w: 40px}.oc .oc-pile .oc-card{--w: 64px}.oc .oc-deck .oc-card{--w: 52px}.oc .oc-backs{height:24px}.oc .oc-backs i{width:16px;height:24px}.oc .oc-opp{padding:4px 8px}}