@font-face{font-family:Deck;src:url(./assets/studio-pixel.ttf) format("truetype");font-display:swap}
:root{color-scheme:dark;--ink:#191d24;--wood:#36252a;--wood2:#281e24;--edge:#8b6145;--pale:#f7eac5;--dim:#ccb394;--gold:#efc27b;--amber:#ffda90;--green:#b4dfbf;--pink:#f6a489;--pixel:Deck,monospace;--serif:Georgia,serif}
*{box-sizing:border-box}[hidden]{display:none!important}html{background:var(--ink)}body{margin:0;min-height:100svh;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);background:radial-gradient(ellipse at 50% 0%,#3e292b,#191d24 75%);color:var(--pale);font:16px/1.45 var(--serif)}h1,h2,h3,p{margin:0}
button,input{font:inherit}button{min-width:44px;min-height:44px;cursor:pointer;color:var(--pale);border-radius:0;border:1px solid #8e6952;background:#3b2a2c;font:10px/1.18 var(--pixel);padding:5px 6px;text-transform:uppercase;touch-action:manipulation;-webkit-tap-highlight-color:#ffe29e44}button.primary{color:#2e2226;background:#edbb72;border-color:#ffdb99;box-shadow:inset 0 -3px #bb784b}button.secondary{background:#254742;border-color:#70947e}button.danger{background:#6a3938;border-color:#ad775c}button:active{filter:brightness(1.24)}button:disabled{opacity:.5;cursor:default}button:focus-visible,input:focus-visible{outline:2px solid #ffe7a3;outline-offset:-3px}button[aria-pressed=true]{border-color:var(--green)}
.mast{max-width:1160px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 13px 7px;color:var(--dim);font:9px/1.3 var(--pixel);letter-spacing:.07em}.mast span:first-child{display:flex;align-items:center;gap:6px;color:var(--pale)}.mast img{width:15px;height:15px;image-rendering:pixelated}.mast-tag{display:none}.mast-index{text-align:right}main{width:min(100%,1160px);margin:auto;padding:0 10px}
.cabinet{position:relative;isolation:isolate;border:2px solid #a77651;box-shadow:0 3px #5b3c31,0 18px 42px #101318c0;background:var(--wood2)}.menu{display:grid;gap:0;padding:6px}.view{position:relative;border:1px solid var(--edge);overflow:hidden;background:#173632}.view canvas{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;image-rendering:pixelated}.view-label{position:absolute;bottom:8px;left:8px;color:#ffedba;background:#23202bd9;padding:4px 5px;font:8px/1.1 var(--pixel);letter-spacing:.055em}.view-label i{display:inline-block;width:5px;height:5px;background:#ec9a5b;margin-right:4px}
.intro{padding:10px 5px 3px}.kicker{color:var(--pink);letter-spacing:.075em;font:9px/1.3 var(--pixel);margin-bottom:6px}.intro h1{font:clamp(24px,7.8vw,47px)/1.01 var(--pixel);letter-spacing:.025em;text-shadow:2px 3px #5e3431}.intro h1 em{font-style:normal;color:var(--gold)}.tag{margin:5px 0 6px;font-size:clamp(16px,4.8vw,25px);font-style:italic;color:#ffedca}.blurb{display:none;color:var(--dim)}
.starts,.tools,.actions{display:grid;gap:4px}.starts{grid-template-columns:repeat(2,minmax(44px,1fr))}.tools{grid-template-columns:repeat(4,minmax(44px,1fr))}.menu-tools{margin-top:4px}.save-note{margin-top:4px;color:var(--green);font:8px/1.22 var(--pixel);letter-spacing:.045em;text-transform:uppercase}
.jacket{display:grid;gap:6px;margin-top:13px;padding:10px 2px 15px;border-top:1px solid #785740;color:var(--dim)}.jacket span{font:9px/1.35 var(--pixel);letter-spacing:.08em}.jacket span:first-child{color:var(--gold)}.jacket p{font-size:14px}
.field{display:grid;gap:5px;padding:5px}.field-left,.field-right{min-width:0}.table-head{display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:7px;padding:3px 6px 5px;background:#36272c;border:1px solid #77523e;border-bottom:none;min-height:46px}.portrait{width:38px;height:36px;border:1px solid #b08257;background:url(./assets/rivals.png) no-repeat;background-size:200% 200%;image-rendering:pixelated}.portrait.p1{background-position:100% 0}.portrait.p2{background-position:0 100%}.portrait.p3{background-position:100% 100%}.table-head h2{font:13px/1.1 var(--pixel);text-transform:uppercase}.table-head .dealer{color:var(--dim);font-size:12px;line-height:1.15;display:block;margin-top:2px}.score-tile{text-align:right;color:var(--amber);font:15px/1.15 var(--pixel)}.score-tile small{display:block;color:var(--dim);font:8px/1.3 var(--pixel);margin-top:2px}
.felt{position:relative;padding:4px 6px 6px;background-color:#174039;background-image:repeating-linear-gradient(135deg,#ebdf9d0a 0,#ebdf9d0a 1px,transparent 1px,transparent 4px),radial-gradient(ellipse at center,#275b48,#183a35 74%);border:1px solid #ba8d58;box-shadow:inset 0 0 0 3px #273932}.field[data-port=1] .felt{background-color:#23374c;background-image:repeating-linear-gradient(135deg,#e0e9ef0a 0,#e0e9ef0a 1px,transparent 1px,transparent 4px),radial-gradient(ellipse at center,#34526c,#202d45 74%)}.field[data-port=2] .felt{background-color:#472b35;background-image:repeating-linear-gradient(135deg,#e3b3940a 0,#e3b3940a 1px,transparent 1px,transparent 4px),radial-gradient(ellipse at center,#664135,#3c2b36 74%)}
.hand-lane{min-width:0;padding:4px 4px 5px;border:1px solid transparent}.hand-lane.on-turn{border-color:#efd08c;background:#e6c9771c}.dealer-row{border-bottom:1px dashed #ead38b75;padding-bottom:6px;margin-bottom:3px}.hand-title{display:flex;justify-content:space-between;gap:2px;align-items:center;font:9px/1.22 var(--pixel);color:#fae5b5;text-transform:uppercase;margin-bottom:4px;min-height:12px}.hand-title strong{color:#fff1c8;font-size:10px}.hands{display:grid;grid-template-columns:minmax(0,1fr);gap:2px}.hands.split{grid-template-columns:repeat(2,minmax(0,1fr))}.hands.split .hand-title{font-size:8px}.hands.split .hand-title strong{font-size:9px}
.cards{display:flex;align-items:center;min-height:54px;gap:3px;isolation:isolate}.card{display:inline-grid;grid-template-rows:auto 1fr auto;align-items:center;justify-items:center;flex:0 0 auto;width:38px;height:53px;background:#f6e9c2;color:#25363a;line-height:1;border:1px solid #ffe8ab;box-shadow:inset 0 0 0 2px #d5bd93,1px 2px #182c30;position:relative}.card.red{color:#9a413b}.card b,.card small{justify-self:start;margin:2px 0 0 4px;font:11px/1 var(--pixel)}.card small{font-size:8px;justify-self:end;margin:0 3px 2px 0;transform:rotate(180deg)}.card svg{width:16px;height:16px}.card.back{background:repeating-linear-gradient(45deg,#5c3337 0,#5c3337 2px,#844d44 2px,#844d44 4px);display:grid;place-items:center;box-shadow:inset 0 0 0 2px #d3a875,1px 2px #182c30}.card.back i{width:16px;height:16px;background:url(./assets/compass.svg) center/contain no-repeat}.card.slot{background:#14252c48;border:1px dashed #dabb7988;box-shadow:none}.cards.dense{gap:0}.cards.dense .card+.card{margin-left:-14px}.hands.split .cards.dense .card+.card{margin-left:-21px}.card.arrive{animation:deal .26s both}.quiet .card.arrive{animation:fade .44s both}@keyframes deal{0%{opacity:.35;transform:translate(9px,-4px)}100%{opacity:1;transform:translate(0)}}@keyframes fade{0%{opacity:.5}100%{opacity:1}}
.table-status{display:grid;gap:1px;padding:4px 4px 5px;line-height:1.15;min-height:36px}.table-status b{font:10px/1.22 var(--pixel);text-transform:uppercase;color:var(--gold)}.table-status span{font-size:13px;color:var(--dim)}.table-status .positive{color:var(--green)}.table-status .negative{color:var(--pink)}.table-status .chart-text{color:#f3dfad}.actions{grid-template-columns:repeat(4,minmax(44px,1fr));margin:1px 0 4px}.actions:empty{display:none}.actions .stretch{grid-column:1/-1}.actions .action-chart{grid-column:1/-1}.actions button{font-size:9px;padding-inline:3px}.field-tools button{font-size:9px;padding-inline:2px}
.shade{position:fixed;inset:0;z-index:6;display:grid;place-items:center;background:#16141cbd;padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))}.dialog{width:min(100%,544px);max-height:min(100%,calc(100dvh - max(8px,env(safe-area-inset-top)) - max(8px,env(safe-area-inset-bottom))));overflow:auto;overscroll-behavior:contain;background:#30262c;border:2px solid #be9460;box-shadow:4px 4px 0 #16161e,0 20px 52px #111117;scrollbar-color:#b18a66 #36272b}
.dialog-head{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:52px;padding:4px 6px 4px 12px;background:#513830;border-bottom:1px solid #b38656}.dialog-head h2{font:14px/1.22 var(--pixel);text-transform:uppercase}.dialog-body{padding:11px;display:grid;gap:8px}.dialog-body p{line-height:1.37}.dialog-body .fine{color:var(--dim);font-size:13px}.dialog-actions{display:flex;flex-wrap:wrap;gap:4px}.dialog-actions button{flex:1 1 98px}.note{padding:6px 8px;border:1px solid #785944;background:#271f27;line-height:1.31}.note b,.caption{display:block;color:var(--gold);font:9px/1.35 var(--pixel);letter-spacing:.045em;text-transform:uppercase;margin-bottom:3px}.note strong{color:var(--green)}.route-list{display:grid;gap:4px}.route-button{display:grid;grid-template-columns:39px 1fr;align-items:center;gap:7px;text-align:left;min-height:54px;background:#25423f}.route-button small{display:block;margin-top:3px;text-transform:none;font:13px/1.2 var(--serif);color:#e1cda5}.result-name{font:21px/1.16 var(--pixel);text-transform:uppercase;color:var(--gold)}.volume{display:grid;grid-template-columns:1fr auto;font:10px/1.4 var(--pixel);text-transform:uppercase;gap:3px}.volume input{grid-column:1/-1;width:100%;min-height:44px;margin:0;accent-color:var(--gold);touch-action:pan-y}.dock-name{display:flex;align-items:center;gap:7px}.dock-name .portrait{flex:none}.ticket{font:10px/1.25 var(--pixel);color:var(--green)}#storage-warning{padding:4px 8px;font-size:13px;color:var(--pink)}
.expanded-body{overflow:hidden}.cabinet.expanded,.cabinet:fullscreen{position:fixed;inset:0;width:100%;height:100dvh;z-index:10;border:0;box-shadow:none;background:#231e26;overflow:auto;overscroll-behavior:contain;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}.cabinet.expanded #content,.cabinet:fullscreen #content{width:min(100%,1090px);margin-inline:auto}.cabinet:fullscreen::backdrop{background:#231e26}
@media (orientation:portrait) and (max-height:620px){.view canvas{height:min(34dvh,211px)}.mast{padding:6px 8px}.intro{padding-block:6px 3px}.tag{margin:3px 0 4px}}
@media (orientation:landscape), (min-width:680px){.mast-tag{display:block}.menu{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:center}.intro{padding:12px 14px}.intro h1{font-size:clamp(24px,4vw,52px)}.tag{font-size:clamp(17px,2.3vw,27px)}.field{grid-template-columns:minmax(0,1.18fr) minmax(0,1fr);gap:8px}.field-right{align-self:center}.jacket{grid-template-columns:auto 1fr auto;gap:13px}.table-head h2{font-size:clamp(13px,2.15vw,24px)}.hands .card,.dealer-row .card{width:43px;height:61px}.cards{min-height:62px}}
@media (orientation:landscape) and (max-height:450px){main{padding-inline:6px}.mast{padding:4px 8px;font-size:8px}.intro{padding:2px 6px}.intro h1{font-size:clamp(21px,4vw,33px)}.tag{line-height:1.13;margin:3px 0 5px}.kicker{margin-bottom:4px}.view canvas{height:clamp(140px,calc(100dvh - 48px - env(safe-area-inset-top) - env(safe-area-inset-bottom)),328px)}.jacket{display:none}.dialog-body{padding:8px;gap:6px}}
@media (min-width:850px) and (min-height:500px){.mast{padding-block:17px 12px}.menu,.field{padding:9px}.intro{padding:20px}.blurb{display:block;margin-bottom:14px;max-width:38ch}.tag{margin:9px 0}.starts,.tools,.actions{gap:6px}.menu-tools{margin-top:6px}.field-right{padding:14px}.table-head{padding:7px 9px;grid-template-columns:52px minmax(0,1fr) auto}.portrait{width:46px;height:44px}.felt{padding:8px 12px}.hand-lane{padding:6px 8px}.hands .card,.dealer-row .card{width:55px;height:76px}.cards{min-height:77px}.card svg{width:21px;height:21px}.card b{font-size:14px}.card small{font-size:10px}.table-status{min-height:48px}.field-tools button,.actions button,.menu-tools button,.starts button{min-height:48px}}
@media (max-width:355px){.mast-index{font-size:7px}.intro{padding-inline:3px}main{padding-inline:7px}.actions button,.tools button{font-size:8px}.starts button{font-size:9px}}

.starts:has(>button:nth-child(3):last-child) #practice{grid-column:1/-1}
.felt::before{content:"";position:absolute;inset:0;pointer-events:none;background:url(./assets/compass.svg) 84% 50%/clamp(48px,12vw,92px) no-repeat;opacity:.105}
.hand-lane{position:relative}
.card.back{grid-template-rows:1fr}
.cards{--cw:38px}
.cards.dense .card+.card,.hands.split .cards.dense .card+.card{margin-left:min(0px,calc((100% - var(--n)*var(--cw))/(var(--n) - 1)))}
@media (orientation:landscape),(min-width:680px){.cards{--cw:43px}}
@media (min-width:850px) and (min-height:500px){.cards{--cw:55px}.field-tools button,.actions button,.menu-tools button,.starts button{font-size:11px}}
@media (orientation:landscape) and (max-height:380px){.route-button{min-height:48px;grid-template-columns:34px 1fr}.route-button .portrait{width:32px;height:32px}}

.log-button{display:grid;gap:4px;text-align:left;padding:7px 9px;min-height:48px;background:#29413f;border-color:#748371}.log-button small{font:13px/1.13 var(--serif);text-transform:none;color:var(--dim)}