:root{font-family:system-ui,-apple-system,"Segoe UI",sans-serif;color:#53483f;background:#fff4e9;color-scheme:light}*{box-sizing:border-box}body{margin:0;padding:max(10px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));background:radial-gradient(ellipse at top,#ffeadc,transparent 65%)}.game{max-width:480px;margin:auto}header{display:flex;align-items:center;justify-content:space-between;gap:8px}h1{font-size:clamp(22px,6vw,30px);margin:0}h1 span{color:#d58270;margin-left:8px}.eyebrow{font-size:10px;letter-spacing:1.5px;margin:4px 0;color:#947769}button{font:inherit;border:0;border-radius:14px;padding:10px 16px;background:#6f8975;color:white;cursor:pointer;min-height:44px}button:focus-visible,summary:focus-visible{outline:3px solid #664a9a;outline-offset:3px}.environment{font-size:11px;margin:6px 0;color:#806e62}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:8px 0 12px}.stats div{background:#fffcf7;border-radius:14px;text-align:center;padding:7px 2px;font-size:11px}.stats strong{display:block;font-size:19px;margin-top:2px}.board-area{display:flex;justify-content:center}#board{width:min(100%,440px,calc(100svh - 245px));display:grid;grid-template-columns:repeat(8,minmax(0,1fr));grid-template-rows:repeat(8,minmax(0,1fr));gap:clamp(2px,.8vw,5px);padding:7px;background:#e5d2bf;border-radius:19px;aspect-ratio:1}.piece{aspect-ratio:1;min-width:0;min-height:0;border-radius:25%;display:grid;place-items:center;font-size:clamp(8px,min(4.5vw,3svh),25px);box-shadow:inset 0 -3px #0000000a}.piece[data-type="cat"]{background:#f5b7b4}.piece[data-type="dog"]{background:#f6d78f}.piece[data-type="rabbit"]{background:#dbc9f1}.piece[data-type="panda"]{background:#d5dfeb}.piece[data-type="bear"]{background:#d9b898}.piece[data-type="frog"]{background:#b9d9b5}.caption{text-align:center;font-size:12px;line-height:1.6;color:#8c7869;margin:10px 0}.install{font-size:12px;background:#fffcf7;border-radius:12px;padding:10px;line-height:1.7}.install summary{cursor:pointer}#pwa-status{font-size:11px;text-align:center;color:#6a7c68}#update-panel{background:#fff;padding:12px;border-radius:12px}#update-panel button{margin:3px;font-size:12px}dialog{border:0;border-radius:24px;padding:24px;max-width:calc(100% - 32px);width:340px;box-shadow:0 15px 80px #53483f33}dialog::backdrop{background:#42382d66}dialog h2{margin-top:0}dialog label{display:flex;justify-content:space-between;padding:12px 0}dialog button{width:100%}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
.orientation-notice{display:none}
@media (orientation:landscape){
  .board-area{display:none}
  .orientation-notice{display:flex;align-items:center;justify-content:center;min-height:120px;margin:12px 0;padding:24px 12px;border-radius:19px;background:#fffcf7;text-align:center;font-weight:600}
}
.piece{padding:0;min-height:0;color:inherit;touch-action:none;user-select:none;-webkit-user-select:none}
#board{touch-action:none}
.piece[aria-selected="true"]{outline:3px solid #6f8975;outline-offset:-3px;filter:brightness(1.08)}
.piece[data-type="empty"]{background:transparent;box-shadow:none}
#board[aria-busy="true"]{cursor:wait}
#board[data-phase="invalid"]{outline:2px solid #d58270}
.stats div{min-width:0}.stats strong{overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.piece{position:relative}
.piece[data-special="line-row"],.piece[data-special="line-column"]{border:2px solid #536a95}
.piece[data-special="bomb"]{border:2px dashed #724e77}
.piece[data-special="rainbow"]{background:linear-gradient(135deg,#f5b7b4,#f6d78f,#b9d9b5,#dbc9f1);border:2px solid #fff}
.special-mark{position:absolute;right:0;bottom:0;min-width:45%;border-radius:5px;background:#fffef0;color:#453e53;font-size:clamp(9px,2.5vw,14px);font-weight:800;line-height:1.05;text-align:center}
.piece[data-special="line-row"]{background:#d5e2f6}
.piece[data-special="line-column"]{background:#e0d6f5}
.piece[data-special="bomb"]{background:#efd3df}
.piece .special-mark{position:static;min-width:0;background:transparent;font-size:inherit;line-height:1.2}
@keyframes hint-pulse{0%,100%{opacity:1;box-shadow:inset 0 0 0 3px #bd8b39}50%{opacity:.45;box-shadow:inset 0 0 0 3px #e9bd6b}}
.piece[data-hint="true"]{animation:hint-pulse 2.4s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.piece[data-hint="true"]{animation:none;box-shadow:inset 0 0 0 3px #bd8b39}}
#settings{max-height:calc(100svh - 32px);overflow-y:auto;overscroll-behavior:contain;scroll-padding-top:80px}
#settings button{min-height:48px}
#settings .settings-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;position:sticky;top:0;background:#fff;padding:8px 0;margin-bottom:24px;z-index:1}
#settings .settings-heading h2{margin:0}
#settings .settings-heading button{width:auto;min-width:96px;flex-shrink:0}
#settings .settings-management{margin-top:48px;padding-top:24px;border-top:1px solid #e5d2bf;display:grid;gap:16px}
#settings .settings-management h3{margin:0;font-size:17px}
#settings .backup-actions{display:grid;gap:14px;margin-top:24px;padding-top:24px;border-top:1px solid #e5d2bf}
#settings .backup-actions h4{margin:0;font-size:16px}
#settings .backup-actions p{font-size:12px;line-height:1.7;overflow-wrap:anywhere}
#settings #restore-preview,#settings #before-restore-actions{display:grid;gap:14px}
#settings [hidden]{display:none!important}
#settings button:disabled{opacity:.5;cursor:default}
