:root{--felt-green: #1a5c2a;--felt-dark: #14461f;--card-bg: #fff;--card-red: #c0392b;--card-black: #2c3e50;--card-back: #2c3e8c;--card-back-pattern: #1a2766;--card-border: #999;--card-shadow: rgba(0, 0, 0, .3);--card-width: 60px;--card-height: 84px;--card-radius: 6px;--column-gap: 4px;--card-overlap: 20px;--selected-glow: rgba(255, 215, 0, .8);--highlight-color: rgba(255, 255, 255, .15);--btn-bg: rgba(255, 255, 255, .15);--btn-hover: rgba(255, 255, 255, .25);--btn-text: #fff;--font: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{height:100dvh;overflow:hidden;-webkit-text-size-adjust:100%}body{height:100dvh;overflow:hidden;font-family:var(--font);background:var(--felt-green);color:var(--btn-text);user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}body.modal-open{pointer-events:none}body.modal-open .modal-overlay{pointer-events:auto}#app{display:flex;flex-direction:column;height:100dvh;overflow:hidden}.header{display:flex;flex-direction:column;background:var(--felt-dark);flex-shrink:0;z-index:10}.header__row{display:flex;align-items:center;justify-content:center;padding:0 8px;gap:4px}.header__row--stats{gap:12px;font-size:15px;opacity:.9;padding:4px 8px 2px}.header__row--actions{padding:2px 8px 4px;justify-content:center}.header__stat{white-space:nowrap}.header__btn{background:var(--btn-bg);border:1px solid rgba(255,255,255,.2);color:var(--btn-text);padding:4px 10px;border-radius:4px;font-size:15px;cursor:pointer;font-family:var(--font);white-space:nowrap}.header__btn:active{background:var(--btn-hover)}.header__btn--struck{text-decoration:line-through;opacity:.5}.header__deal-count{opacity:.7;font-size:.85em}@media (min-width: 600px){.header{flex-direction:row;align-items:center;justify-content:space-between;padding:4px 8px}.header__row,.header__row--stats,.header__row--actions{padding:0}}.main{flex:1;position:relative;overflow:hidden;padding:6px 4px;display:flex;flex-direction:column}.tableau{display:grid;grid-template-columns:repeat(10,minmax(0,calc(var(--card-height) * 4/5)));justify-content:center;gap:var(--column-gap);flex:1;min-height:0}.column{position:relative;min-height:var(--card-height);border-radius:var(--card-radius)}.column--empty{border:2px dashed rgba(255,255,255,.15);border-radius:var(--card-radius)}.column--highlight{background:var(--highlight-color);border-radius:var(--card-radius)}.column--flash{animation:flash-empty .4s ease}@keyframes flash-empty{0%,to{border-color:#ffffff26}50%{border-color:#ff5050b3}}.card{position:absolute;width:100%;height:var(--card-height);border-radius:var(--card-radius);border:1px solid var(--card-border);cursor:pointer;font-family:var(--font)}.card--black,.card--red{background:var(--card-bg)}.card--black{color:var(--card-black)}.card--red{color:var(--card-red)}.card--locked{background:#ddd}.card--facedown{cursor:default}.card__back{width:100%;height:100%;border-radius:var(--card-radius);background:var(--card-back);background-image:repeating-linear-gradient(45deg,var(--card-back-pattern) 0px,var(--card-back-pattern) 2px,transparent 2px,transparent 6px)}.card__corner{position:absolute;font-size:15px;line-height:1;font-weight:700;white-space:nowrap}.card__corner--top{top:3px;left:3px}.card__full{display:block}.card__corner--bottom{position:absolute;bottom:3px;right:3px;transform:rotate(180deg);font-size:18px;line-height:1;font-weight:700;white-space:nowrap}.card__center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:28px}.card__compact{display:none;position:absolute;top:0;right:0;bottom:0;left:0;flex-direction:column;align-items:center;justify-content:center}.card__rank{font-size:clamp(18px,5vw,34px);font-weight:700;line-height:1;text-align:center}.card__suit{font-size:clamp(20px,6vw,40px);line-height:1;text-align:center}[data-orientation=portrait] .card__full{display:none}[data-orientation=portrait] .column>.card:last-child .card__compact{display:flex}[data-orientation=portrait] .column>.card:last-child .card__corner{display:none}.card--selected{box-shadow:0 0 0 3px var(--selected-glow);z-index:100}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000;padding:16px}.modal{background:#fff;color:#333;border-radius:12px;padding:24px;max-width:400px;max-height:90dvh;width:100%;box-shadow:0 8px 32px #0006;display:flex;flex-direction:column;overflow:hidden}.modal__title{font-size:24px;margin-bottom:12px;color:#222}.modal__body{font-size:16px;line-height:1.5;margin-bottom:20px;overflow-y:auto}.modal__body p{margin-bottom:8px}.modal__body table{width:100%;border-collapse:collapse;margin:8px 0}.modal__body td{padding:4px 8px;border-bottom:1px solid #eee}.modal__body td:first-child{font-weight:600;color:#555}.modal__body th{padding:4px 8px;text-align:left;font-size:13px;color:#888;border-bottom:2px solid #ddd}.modal__body textarea{width:100%;height:80px;font-family:monospace;font-size:12px;padding:8px;border:1px solid #ccc;border-radius:4px;resize:vertical}.modal__buttons{display:flex;gap:8px;justify-content:flex-end}.modal__btn{padding:10px 22px;border-radius:6px;border:1px solid #ccc;background:#f5f5f5;color:#333;font-size:16px;cursor:pointer;font-family:var(--font)}.modal__btn:active{background:#e0e0e0}.modal__btn--primary{background:var(--felt-green);color:#fff;border-color:var(--felt-green)}.modal__btn--primary:active{background:var(--felt-dark)}.difficulty-options{display:flex;gap:8px;margin:8px 0}.difficulty-options label{flex:1;text-align:center;padding:8px;border:2px solid #ddd;border-radius:6px;cursor:pointer;font-weight:600}.difficulty-options input[type=radio]{display:none}.difficulty-options input[type=radio]:checked+span{color:var(--felt-green)}.difficulty-options label:has(input:checked){border-color:var(--felt-green);background:#1a5c2a14}@media (max-width: 500px){:root{--card-height: 68px}}@media (max-width: 400px){:root{--card-height: 56px}.header__btn{font-size:13px;padding:3px 6px}.header__row--stats{gap:6px;font-size:13px}}@media (min-width: 768px){:root{--card-height: 100px;--card-width: 72px;--column-gap: 6px}.header__stats{font-size:17px}}@media (min-width: 1024px){:root{--card-height: 110px;--card-width: 80px;--column-gap: 8px}.main{padding:12px 8px}}