:root{--ring-bg: #1a472a;--ring-radius: min(35vw, 35vh, 300px)}.ring-game-wrapper{--card-w: 60px;--card-h: 85px;--radius: 5px;--ring-bg: #1a472a;--ring-radius: min(25vw, 25vh, 200px);--card-back: linear-gradient(135deg, #1565c0 0%, #0d47a1 100%)}.ring-game-wrapper{min-height:100vh;background:linear-gradient(180deg,#1a472a,#0d2818);padding:20px;position:relative;overflow:hidden}.ring-game-wrapper .ring-header{display:flex;justify-content:space-between;align-items:center;max-width:800px;margin:0 auto 20px;color:#fff}.ring-game-wrapper .ring-header h1{font-size:1.5rem;margin:0;color:gold}.ring-game-wrapper .score-display{display:flex;gap:20px;font-size:1rem}.ring-game-wrapper .score-display span{background:#0000004d;padding:8px 16px;border-radius:20px}.ring-game-wrapper .ring-container{position:relative;width:calc(var(--ring-radius) * 2 + var(--card-w) + 40px);height:calc(var(--ring-radius) * 2 + var(--card-h) + 40px);margin:20px auto}.ring-game-wrapper .pile{position:absolute;width:var(--card-w);height:var(--card-h);cursor:pointer;transition:transform .2s,box-shadow .2s;border-radius:var(--radius)}.ring-game-wrapper .pile:hover{transform:scale(1.05)}.ring-game-wrapper .pile.selected{box-shadow:0 0 20px 5px gold;z-index:100}.ring-game-wrapper .pile.valid-target{box-shadow:0 0 15px 3px #4caf50;z-index:90}.ring-game-wrapper .pile.empty{background:#ffffff0d;border:2px dashed rgba(255,255,255,.2)}.ring-game-wrapper .pile[data-position="0"]{left:calc(50% - var(--card-w) / 2);top:0}.ring-game-wrapper .pile[data-position="1"]{left:calc(50% + var(--ring-radius) * .5 - var(--card-w) / 2);top:calc(50% - var(--ring-radius) * .866 - var(--card-h) / 2)}.ring-game-wrapper .pile[data-position="2"]{left:calc(50% + var(--ring-radius) * .866 - var(--card-w) / 2);top:calc(50% - var(--ring-radius) * .5 - var(--card-h) / 2)}.ring-game-wrapper .pile[data-position="3"]{right:0;top:calc(50% - var(--card-h) / 2)}.ring-game-wrapper .pile[data-position="4"]{left:calc(50% + var(--ring-radius) * .866 - var(--card-w) / 2);top:calc(50% + var(--ring-radius) * .5 - var(--card-h) / 2)}.ring-game-wrapper .pile[data-position="5"]{left:calc(50% + var(--ring-radius) * .5 - var(--card-w) / 2);top:calc(50% + var(--ring-radius) * .866 - var(--card-h) / 2)}.ring-game-wrapper .pile[data-position="6"]{left:calc(50% - var(--card-w) / 2);bottom:0}.ring-game-wrapper .pile[data-position="7"]{left:calc(50% - var(--ring-radius) * .5 - var(--card-w) / 2);top:calc(50% + var(--ring-radius) * .866 - var(--card-h) / 2)}.ring-game-wrapper .pile[data-position="8"]{left:calc(50% - var(--ring-radius) * .866 - var(--card-w) / 2);top:calc(50% + var(--ring-radius) * .5 - var(--card-h) / 2)}.ring-game-wrapper .pile[data-position="9"]{left:0;top:calc(50% - var(--card-h) / 2)}.ring-game-wrapper .pile[data-position="10"]{left:calc(50% - var(--ring-radius) * .866 - var(--card-w) / 2);top:calc(50% - var(--ring-radius) * .5 - var(--card-h) / 2)}.ring-game-wrapper .pile[data-position="11"]{left:calc(50% - var(--ring-radius) * .5 - var(--card-w) / 2);top:calc(50% - var(--ring-radius) * .866 - var(--card-h) / 2)}.ring-game-wrapper .stock{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:var(--card-w);height:var(--card-h);cursor:pointer;transition:transform .2s}.ring-game-wrapper .stock:hover{transform:translate(-50%,-50%) scale(1.05)}.ring-game-wrapper .card{position:absolute;width:var(--card-w);height:var(--card-h);background:#fff;border-radius:var(--radius);box-shadow:2px 2px 6px #0003;display:flex;flex-direction:column;justify-content:space-between;padding:4px;box-sizing:border-box;font-weight:700;font-size:16px;z-index:10;touch-action:none;transition:transform .1s;color:#212121;user-select:none}.ring-game-wrapper .card.red{color:#d32f2f}.ring-game-wrapper .card.black{color:#212121}.ring-game-wrapper .card.back{background:var(--card-back);border:2px solid #fff}.ring-game-wrapper .card.back *{display:none}.ring-game-wrapper .c-top{line-height:.9;text-align:center;align-self:flex-start}.ring-game-wrapper .c-mid{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:calc(var(--card-w) * .6)}.ring-game-wrapper .c-bot{line-height:.9;text-align:center;align-self:flex-end;transform:rotate(180deg)}.ring-game-wrapper .pile .card:nth-child(1){top:0}.ring-game-wrapper .pile .card:nth-child(2){top:4px}.ring-game-wrapper .pile .card:nth-child(3){top:8px}.ring-game-wrapper .pile .card:nth-child(4){top:12px}.ring-game-wrapper .pile .card:nth-child(n+5){top:16px}.ring-game-wrapper .ring-controls{display:flex;justify-content:center;gap:15px;margin-top:40px;position:relative;z-index:200}.ring-game-wrapper .ring-btn{padding:12px 28px;border:none;border-radius:25px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}.ring-btn.primary{background:linear-gradient(180deg,gold,#d4a800);color:#1a1a1a}.ring-btn.primary:hover{transform:translateY(-2px);box-shadow:0 4px 15px #ffd70066}.ring-btn.secondary{background:#ffffff1a;color:#fff;border:1px solid rgba(255,255,255,.3)}.ring-game-wrapper .ring-btn.secondary:hover{background:#fff3}.ring-btn.hint{background:linear-gradient(180deg,#4caf50,#388e3c);color:#fff;box-shadow:0 4px 15px #4caf504d}.ring-btn.hint:hover{transform:translateY(-2px);box-shadow:0 6px 20px #4caf5080}@keyframes hint-pulse{0%{box-shadow:0 0 #4caf50b3}70%{box-shadow:0 0 0 20px #4caf5000}to{box-shadow:0 0 #4caf5000}}.pile.hint-source{animation:hint-pulse 2s infinite;z-index:150}.help-modal{display:none;position:fixed;inset:0;background:#000000d9;justify-content:center;align-items:center;z-index:2000;backdrop-filter:blur(8px)}.help-modal.show{display:flex}.help-content{background:#1a3c26;border:2px solid #ffd700;border-radius:20px;padding:40px;max-width:600px;width:90%;color:#fff;max-height:80vh;overflow-y:auto;position:relative}.help-content h2{color:gold;text-align:center;margin-top:0;font-size:2rem}.help-section{margin:20px 0}.help-section h3{color:#4caf50;margin-bottom:10px}.help-section p,.help-section li{font-size:1.1rem;line-height:1.6;margin-bottom:8px}.rule-tag{display:inline-block;padding:2px 8px;border-radius:4px;background:#ffd70033;color:gold;font-weight:700;margin-right:5px}.close-help{position:absolute;top:15px;right:20px;font-size:2.5rem;color:gold;cursor:pointer;line-height:1}.game-over-modal{display:none;position:fixed;inset:0;background:#000c;justify-content:center;align-items:center;z-index:1000}.game-over-modal.show{display:flex}.modal-content{background:linear-gradient(180deg,#2e7d32,#1b5e20);padding:40px;border-radius:16px;text-align:center;color:#fff;max-width:400px}.modal-content h2{font-size:2rem;color:gold;margin-bottom:20px}.modal-content p{font-size:1.2rem;margin-bottom:30px}@media(max-width:600px){:root{--ring-radius: 35vw;--card-width: 45px;--card-height: 63px}.card .rank{font-size:1rem}.card .suit{font-size:1.2rem}}