/* Capt. Whiskers' Cabin Cats 1.0.0 (SCDO Laboratory) */
*{box-sizing:border-box}
html,body{margin:0;background:#0e2436;color:#fff4dc;font:15px/1.4 system-ui,-apple-system,"Segoe UI","PingFang TC","Microsoft JhengHei",sans-serif;-webkit-tap-highlight-color:transparent}
button{font:inherit;color:inherit;cursor:pointer}
#game{--top:36px;min-height:calc(100vh - var(--top));min-height:calc(100dvh - var(--top));display:flex;flex-direction:column;align-items:center;padding:6px 8px 8px;gap:6px;max-width:560px;margin:0 auto;position:relative}
#hd{width:100%}
#hd .r1{display:flex;align-items:center;gap:8px;flex-wrap:nowrap}
#hd h1{font:700 17px/1.2 Georgia,"Times New Roman",serif;color:#ffd166;margin:0;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#pno{font:600 12px system-ui;color:#9fd3ff}
#stk{font-size:12px;color:#ffd166;white-space:nowrap}
.tmw{font-size:13px;white-space:nowrap;color:#cfe6ff}
#hd .r2{display:flex;gap:8px;margin-top:5px;justify-content:space-between;flex-wrap:wrap}
.seg{display:inline-flex;border:1px solid #3a6386;border-radius:9px;overflow:hidden}
.seg button{background:#16324b;border:0;padding:5px 9px;font-size:13px}
.seg button[aria-pressed=true]{background:#ffd166;color:#1d1d1f;font-weight:700}
.seg button:disabled{opacity:.45}
#rule{margin:0;font-size:12.5px;color:#cfe6ff;text-align:center;line-height:1.3}
#bdw{flex:1;width:100%;display:flex;align-items:center;justify-content:center;min-height:0}
#bd{display:grid;width:min(100%,calc(100dvh - var(--top) - 190px),520px);aspect-ratio:1;border:3px solid #3b2a14;border-radius:8px;overflow:hidden;background:#3b2a14;touch-action:manipulation;user-select:none;-webkit-user-select:none}
@supports not (height:100dvh){#bd{width:min(100%,calc(100vh - var(--top) - 190px),520px)}}
.c{position:relative;border:0;padding:0;display:flex;align-items:center;justify-content:center;background:var(--rc);box-shadow:inset 0 0 0 .5px rgba(59,42,20,.35)}
.c.bt{border-top:2.5px solid #3b2a14}.c.bl{border-left:2.5px solid #3b2a14}
.c .x{font:700 clamp(12px,4.2vw,22px)/1 system-ui;color:rgba(40,28,10,.55)}
.c svg{width:82%;height:82%;filter:drop-shadow(0 1px 1px rgba(0,0,0,.35))}
.c.bad svg{animation:sh .35s 2}.c.bad::after{content:"";position:absolute;inset:2px;border:2px solid #e2574c;border-radius:4px}
.c.hint::after{content:"";position:absolute;inset:2px;border:3px dashed #1d6fb8;border-radius:4px}
.c:focus-visible{outline:3px solid #fff;outline-offset:-3px}
@keyframes sh{0%,100%{transform:none}30%{transform:translateX(-2px)}70%{transform:translateX(2px)}}
#tl{display:flex;gap:6px;width:100%;justify-content:center;flex-wrap:nowrap}
#tl button{flex:1;min-width:0;background:#16324b;border:1px solid #3a6386;border-radius:10px;padding:8px 2px;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#tl button[aria-pressed=true]{border-color:#ffd166;color:#ffd166}
.ov{position:absolute;inset:0;background:rgba(8,23,35,.86);display:flex;align-items:center;justify-content:center;z-index:5;padding:16px}
.ov[hidden]{display:none}
.ov .box{background:#123049;border:2px solid #ffd166;border-radius:14px;padding:16px;max-width:330px;width:100%;text-align:center}
.ov h2{margin:0 0 6px;color:#ffd166;font:700 21px Georgia,serif}
.ov p{margin:6px 0}
.ov .row{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:10px}
.ov button{background:#ffd166;color:#1d1d1f;border:0;border-radius:9px;padding:8px 12px;font-weight:700}
.ov button.sec{background:#16324b;color:#fff4dc;border:1px solid #3a6386}
#toast{position:absolute;left:50%;bottom:64px;transform:translateX(-50%);background:#081723;border:1px solid #ffd166;border-radius:10px;padding:7px 12px;font-size:13px;opacity:0;pointer-events:none;transition:opacity .2s;max-width:90%;text-align:center;z-index:6}
#toast.on{opacity:1}
#below{max-width:560px;margin:0 auto;padding:4px 14px 10px}
#below .how{background:#123049;border-radius:12px;padding:10px 12px;font-size:14px}
#below ol{margin:6px 0 0;padding-left:20px}
#below footer{font-size:12px;color:#9fb8cc;text-align:center;margin-top:10px}
#below a{color:#9fd3ff}
@media (min-width:900px){#hd h1{font-size:20px}#bd{width:min(100%,calc(100dvh - var(--top) - 200px),560px)}}