/* A quiet classic card table inside the existing desktop. Nothing stored remotely. */
#hyd-solitaire{--sol-card-h:clamp(103px,15vw,143px);--sol-stack-step:26px;position:fixed;inset:0;margin:auto;width:min(900px,calc(100vw - 24px));max-width:none;max-height:calc(100dvh - 24px);padding:3px;border:1px solid;border-color:#f6f6f6 #5a5b60 #5a5b60 #f6f6f6;border-radius:5px;background:#c6c6ca;color:#222;box-shadow:0 14px 48px #0007;font:12px/1.4 'Lucida Grande',Tahoma,sans-serif;overflow:auto;color-scheme:light}
#hyd-solitaire::backdrop{background:#11131a70}
#hyd-solitaire[open]{display:flex;flex-direction:column}
#hyd-solitaire [hidden]{display:none!important}
#hyd-solitaire button{font:inherit;cursor:pointer}
#hyd-solitaire .solitaire-titlebar{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:32px;padding:3px 8px;border:1px solid #919297;border-radius:3px 3px 0 0;background:linear-gradient(#f0f0f1,#cbcbce 48%,#b6b6ba 50%,#d5d5d8);color:#222;flex:none}
#hyd-solitaire h2{display:flex;align-items:center;gap:7px;margin:0;font:bold 12px/1.4 'Lucida Grande',Tahoma,sans-serif;color:#222;text-shadow:0 1px #fff8}
#hyd-solitaire .solitaire-title-spacer{width:48px;flex:none}
#hyd-solitaire .solitaire-window-controls{display:flex;gap:6px;flex:none;width:48px}
#hyd-solitaire .solitaire-window-controls button{display:grid;place-items:center;padding:0;min-width:19px;width:19px;height:19px;border:1px solid #6d7177;border-radius:50%;background:linear-gradient(#fbfbfc,#adb1b8);color:#333;line-height:1;font-size:15px;box-shadow:inset 0 1px #fff}
#hyd-solitaire .solitaire-toolbar{display:flex;align-items:center;gap:7px;padding:7px 8px;border-bottom:1px solid #64666b;flex:none;background:#d9d9dc}
#hyd-solitaire :is(.solitaire-toolbar,.solitaire-photo-bar)>button{display:flex;align-items:center;justify-content:center;gap:6px;min-height:29px;padding:4px 11px;border:1px solid;border-color:#f6f6f7 #7f8188 #7f8188 #f6f6f7;border-radius:3px;background:linear-gradient(#f7f7f8,#d9dadd);color:#202329;box-shadow:0 1px #fff6;white-space:nowrap}
#hyd-solitaire button:disabled{cursor:default}
#hyd-solitaire :is(.solitaire-toolbar,.solitaire-photo-bar)>button:disabled{color:#81838a;box-shadow:none}
#hyd-solitaire .solitaire-score{margin-left:auto;color:#51545b;font-size:11px;font-variant-numeric:tabular-nums;white-space:nowrap}
#hyd-solitaire .solitaire-table-scroll{flex:1 1 auto;min-height:230px;max-height:62dvh;overflow:auto;overscroll-behavior:contain;scrollbar-color:#91aaa0 #164637;background:#16563f;border:1px solid;border-color:#143e30 #73927e #73927e #143e30}
#hyd-solitaire .solitaire-table{min-width:540px;padding:15px 14px 21px;background:radial-gradient(ellipse at 40% 0,#27674c44,transparent 70%);min-height:375px}
#hyd-solitaire :is(.solitaire-top,.solitaire-columns){display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:12px}
#hyd-solitaire .solitaire-top{margin-bottom:22px}
#hyd-solitaire .solitaire-column{position:relative;min-width:0;height:calc(var(--sol-card-h) + var(--pile-depth)*var(--sol-stack-step))}
#hyd-solitaire .solitaire-card,#hyd-solitaire .solitaire-slot{position:relative;display:block;width:100%;height:var(--sol-card-h);min-width:0;padding:0;border:1px solid #2f3630;border-radius:5px;box-sizing:border-box;text-align:center;box-shadow:1px 2px 2px #09291f70;background:#faf9f3;color:#222;overflow:hidden;touch-action:manipulation;outline-offset:1px}
#hyd-solitaire .solitaire-column>.solitaire-card{position:absolute;top:calc(var(--card-row)*var(--sol-stack-step));left:0}
#hyd-solitaire .solitaire-slot{background:#124b37;color:#86b59c;border:1px solid #7aaa8c;box-shadow:inset 1px 1px #0e3229;font:28px Georgia,serif}
#hyd-solitaire .solitaire-card.suit-red{color:#ad263b}
#hyd-solitaire .solitaire-card.suit-black{color:#182127}
#hyd-solitaire .solitaire-card:not(:disabled):hover{filter:brightness(1.035)}
#hyd-solitaire .solitaire-card:not(:disabled):not(.solitaire-stock){cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
#hyd-solitaire.is-dragging,#hyd-solitaire.is-dragging *{cursor:grabbing!important}
#hyd-solitaire .solitaire-drag-ghost{position:fixed;z-index:20;height:0;transform:translate(calc(-1 * var(--drag-grab-x)),calc(-1 * var(--drag-grab-y)));pointer-events:none;filter:drop-shadow(3px 7px 5px #00180e66)}
#hyd-solitaire .solitaire-drag-ghost .solitaire-card{position:absolute;left:0;width:100%;pointer-events:none;opacity:1;box-shadow:0 0 0 1px #fff7;filter:none}
#hyd-solitaire .solitaire-card.is-drag-source{opacity:.27}
#hyd-solitaire [data-sol-drop].is-drop-ready{outline:2px dashed #e1d68799;outline-offset:3px;border-radius:5px}
#hyd-solitaire [data-sol-drop].is-drop-target{outline:3px solid #f1d875;outline-offset:3px;box-shadow:0 0 0 5px #183e2c66}
#hyd-solitaire [data-sol-drop].is-drop-invalid{outline:2px solid #d39287;outline-offset:3px;border-radius:5px}
#hyd-solitaire .solitaire-card.card-back{border:3px solid #eceadf;background:repeating-linear-gradient(45deg,transparent 0 4px,#abc9be27 4px 5px),repeating-linear-gradient(-45deg,transparent 0 4px,#abc9be27 4px 5px),#284e65;box-shadow:0 0 0 1px #20352e,1px 2px 3px #07271c99;color:#dce8e4}
#hyd-solitaire .solitaire-back-mark{position:absolute;display:grid;place-items:center;left:50%;top:50%;width:49px;height:60px;transform:translate(-50%,-50%);border:2px double #c1d8ce;outline:1px solid #6e918d;outline-offset:4px;font:italic 34px Georgia,serif;color:#c8ddd4;border-radius:50%;background:#284e65}
#hyd-solitaire .stock-empty{background:#154e3b;color:#a8cdb4;box-shadow:inset 0 0 0 1px #94b79e80;font-size:34px}
#hyd-solitaire .solitaire-corner{position:absolute;z-index:2;left:4px;top:2px;display:flex;align-items:center;gap:3px;background:#faf9f3;border-radius:2px;font:18px/1.15 Georgia,serif;padding:0 2px}
#hyd-solitaire .solitaire-corner b{font-weight:bold}
#hyd-solitaire .solitaire-corner i{font-style:normal;font-size:17px}
#hyd-solitaire .corner-bottom{left:auto;top:auto;right:4px;bottom:2px;transform:rotate(180deg)}
#hyd-solitaire .solitaire-pips{position:absolute;inset:25px 6px;display:grid;place-items:center;font:43px/1 Georgia,serif}
#hyd-solitaire .solitaire-face-photo{position:absolute;inset:24px 6px;width:calc(100% - 12px);height:calc(100% - 48px);object-fit:cover;border:1px solid #b5b2a6;box-sizing:border-box;pointer-events:none;filter:none}
#hyd-solitaire .solitaire-card.is-selected,#hyd-solitaire .solitaire-slot.is-selected{box-shadow:inset 0 0 0 3px #edc65e,0 0 0 2px #eac457;filter:brightness(1.045)}
#hyd-solitaire .solitaire-card.is-hint,#hyd-solitaire .solitaire-slot.is-hint{outline:3px dashed #f4d472;outline-offset:1px}
#hyd-solitaire button:focus-visible,#hyd-solitaire summary:focus-visible{outline:3px solid #a8d4ff;outline-offset:2px}
#hyd-solitaire .solitaire-photo-bar{display:flex;align-items:center;gap:12px;padding:7px 9px;background:#dbdbde;border-top:1px solid #f2f2f4;border-bottom:1px solid #999ba1;flex:none}
#hyd-solitaire .solitaire-selected{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#41454b;font-size:11px}
#hyd-solitaire .solitaire-photo-bar img{width:23px;height:23px;object-fit:cover;border:1px solid #86878a}
#hyd-solitaire .solitaire-footer{padding:7px 10px 6px;background:#d0d0d4;flex:none;color:#31363b;font-size:11px}
#hyd-solitaire .solitaire-footer p{margin:0;line-height:1.45}
#hyd-solitaire .solitaire-footer details{margin-top:4px}
#hyd-solitaire .solitaire-footer summary{cursor:pointer;color:#4e545c;width:max-content}
#hyd-solitaire .solitaire-footer details p{max-width:70em;margin-top:5px}
#hyd-solitaire.is-won .solitaire-table-scroll{box-shadow:inset 0 0 0 3px #dabd67}
#hyd-solitaire.is-won #solitaire-status{font-weight:bold;color:#175136}
@media(max-width:620px){#hyd-solitaire{width:calc(100vw - 12px);max-height:calc(100dvh - 12px);font-size:11px;--sol-stack-step:25px}#hyd-solitaire .solitaire-toolbar{flex-wrap:wrap;gap:5px;padding:6px}#hyd-solitaire .solitaire-score{font-size:10px}#hyd-solitaire :is(.solitaire-toolbar,.solitaire-photo-bar)>button{min-height:34px;padding:4px 8px}#hyd-solitaire .solitaire-table{padding:12px 10px 17px}#hyd-solitaire :is(.solitaire-top,.solitaire-columns){gap:10px}#hyd-solitaire .solitaire-photo-bar{gap:5px;padding:6px}#hyd-solitaire .solitaire-photo-bar img{display:none}#hyd-solitaire .solitaire-titlebar{min-height:35px}#hyd-solitaire .solitaire-window-controls button{width:22px;height:22px}#hyd-solitaire .solitaire-window-controls{width:50px}#hyd-solitaire .solitaire-footer{padding:6px 8px}}
@media(max-height:520px){#hyd-solitaire .solitaire-table-scroll{min-height:135px;max-height:55dvh}#hyd-solitaire .solitaire-photo-bar{padding-block:3px}#hyd-solitaire .solitaire-footer{padding-block:4px}}
/* Keep the whole seven-column deal in view on a phone. Longer runs scroll
   vertically, so dragging a card need not compete with horizontal scrolling. */
@media(max-width:620px){
 #hyd-solitaire{--sol-card-h:clamp(62px,18vw,108px);--sol-stack-step:20px}
 #hyd-solitaire .solitaire-table{min-width:0;min-height:280px;padding:10px 6px 17px}
 #hyd-solitaire :is(.solitaire-top,.solitaire-columns){gap:4px}
 #hyd-solitaire .solitaire-top{margin-bottom:14px}
 #hyd-solitaire .solitaire-corner{left:1px;top:1px;gap:1px;padding:0 1px;font-size:14px}
 #hyd-solitaire .solitaire-corner i{font-size:13px}
 #hyd-solitaire .corner-bottom{left:auto;top:auto;right:1px;bottom:1px}
 #hyd-solitaire .solitaire-face-photo{inset:18px 3px;width:calc(100% - 6px);height:calc(100% - 36px)}
 #hyd-solitaire .solitaire-pips{inset:18px 3px;font-size:28px}
 #hyd-solitaire .solitaire-back-mark{width:24px;height:34px;font-size:23px;outline-offset:2px}
 #hyd-solitaire .solitaire-slot{font-size:22px}
}
@media(prefers-reduced-motion:reduce){#hyd-solitaire *{animation:none!important;transition:none!important}}
