:root{--bg-color: #c0c0c0;--bg-highlight: #ffffff;--bg-shadow-light: #dfdfdf;--bg-shadow-dark: #808080;--bg-shadow-darker: #404040;--bg-black: #000000;--text-color: #000000;--text-highlight: #ffffff;--accent-red: #ff0000;--mine-bg: #ff8080;--digit-1: #0000ff;--digit-2: #008000;--digit-3: #ff0000;--digit-4: #000080;--digit-5: #800000;--digit-6: #008080;--digit-7: #000000;--digit-8: #808080;--prob-safe: #00aa00;--prob-medium: #ff8800;--prob-high: #cc0000;--border-width: 3px;--border-width-thin: 2px;--border-width-cell: 1px}*{box-sizing:border-box}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:"MS Sans Serif",Arial,sans-serif;background-color:var(--bg-color);margin:0;padding:0;display:flex;justify-content:center;align-items:flex-start;min-height:100vh;touch-action:manipulation}.app-container{width:100%;max-width:100%}.bevel-up{border-style:solid;border-color:var(--bg-shadow-light) var(--bg-shadow-dark) var(--bg-shadow-dark) var(--bg-shadow-light);box-shadow:inset 1px 1px 0 0 var(--bg-highlight),inset -1px -1px 0 0 var(--bg-black)}.bevel-down{border-style:solid;border-color:var(--bg-shadow-dark) var(--bg-shadow-light) var(--bg-shadow-light) var(--bg-shadow-dark);box-shadow:inset 1px 1px 0 0 var(--bg-black),inset -1px -1px 0 0 var(--bg-highlight)}.game-container{background:linear-gradient(135deg,var(--bg-shadow-light) 0%,var(--bg-shadow-dark) 100%);border:var(--border-width) solid;border-color:var(--bg-shadow-light) var(--bg-shadow-dark) var(--bg-shadow-dark) var(--bg-shadow-light);box-shadow:inset 1px 1px 0 0 var(--bg-highlight),inset 2px 2px 0 0 var(--bg-shadow-light),inset -1px -1px 0 0 var(--bg-shadow-dark),inset -2px -2px 0 0 var(--bg-black)}h1{text-align:center;margin:0 0 10px;font-size:18px;font-weight:700;color:var(--text-color);text-shadow:1px 1px 0 var(--bg-shadow-light)}.game-header{background:linear-gradient(135deg,var(--bg-shadow-light) 0%,var(--bg-shadow-dark) 100%);border:var(--border-width-thin) solid;border-color:var(--bg-shadow-light) var(--bg-shadow-darker) var(--bg-shadow-darker) var(--bg-shadow-light);padding:6px;margin-bottom:10px;box-shadow:inset 1px 1px 0 0 var(--bg-highlight),inset -1px -1px 0 0 var(--bg-shadow-dark)}.info-display{display:flex;justify-content:center;align-items:center;gap:8px;flex-wrap:nowrap;position:relative}.info-left{position:absolute;left:6px;display:flex;align-items:center}.info-right{position:absolute;right:6px;display:flex;align-items:center;gap:4px}.counter-container,.timer-container{display:flex;align-items:center;gap:4px;flex:0 1 auto;min-width:auto}.label{font-size:10px;font-weight:700;white-space:nowrap}.display{background:var(--bg-black);color:var(--accent-red);font-family:Courier New,monospace;font-size:18px;font-weight:700;flex:1;max-width:70px;height:24px;padding:2px 4px;text-align:center;line-height:20px;border:var(--border-width-thin) solid;border-color:var(--bg-shadow-dark) var(--bg-shadow-light) var(--bg-shadow-light) var(--bg-shadow-dark);box-shadow:inset 1px 1px 2px #00000080;letter-spacing:1px}.smiley-btn{width:36px;height:36px;min-width:36px;min-height:36px;padding:0;font-size:24px;border:var(--border-width-thin) solid;border-color:var(--bg-shadow-light) var(--bg-shadow-dark) var(--bg-shadow-dark) var(--bg-shadow-light);background:linear-gradient(135deg,var(--bg-shadow-light) 0%,var(--bg-shadow-dark) 100%);cursor:pointer;transition:all .1s;box-shadow:inset 1px 1px 0 0 var(--bg-highlight),inset -1px -1px 0 0 var(--bg-black);flex-shrink:0;-webkit-tap-highlight-color:transparent}.smiley-btn:active{border-color:var(--bg-shadow-dark) var(--bg-shadow-light) var(--bg-shadow-light) var(--bg-shadow-dark);box-shadow:inset -1px -1px 0 0 var(--bg-highlight),inset 1px 1px 0 0 var(--bg-black)}.undo-btn-header{width:32px;height:32px;min-width:32px;min-height:32px;padding:0;font-size:16px;line-height:1;border:var(--border-width-thin) solid;border-color:var(--bg-shadow-light) var(--bg-shadow-dark) var(--bg-shadow-dark) var(--bg-shadow-light);background:linear-gradient(135deg,var(--bg-shadow-light) 0%,var(--bg-shadow-dark) 100%);cursor:pointer;transition:all .1s;box-shadow:inset 1px 1px 0 0 var(--bg-highlight),inset -1px -1px 0 0 var(--bg-black);flex-shrink:0;-webkit-tap-highlight-color:transparent;margin-left:auto;position:relative;left:10px}.undo-btn-header:hover:not(:disabled){background:linear-gradient(135deg,#e8e8e8 0%,var(--bg-shadow-dark) 100%)}.undo-btn-header:active:not(:disabled){border-color:var(--bg-shadow-dark) var(--bg-shadow-light) var(--bg-shadow-light) var(--bg-shadow-dark);box-shadow:inset -1px -1px 0 0 var(--bg-highlight),inset 1px 1px 0 0 var(--bg-black)}.undo-btn-header:disabled{opacity:.5;cursor:not-allowed}.message{text-align:center;min-height:36px;margin-bottom:10px;font-size:12px;font-weight:700;color:var(--text-color);word-wrap:break-word;display:flex;align-items:center;justify-content:center;gap:8px;padding:6px 8px;border:1px solid transparent;border-radius:3px;box-shadow:inset 1px 1px 0 transparent,inset -1px -1px 0 transparent}.message.has-alert{background:#ffffffd9;border-color:var(--bg-shadow-dark);box-shadow:inset 1px 1px 0 var(--bg-highlight),inset -1px -1px #a0a0a0}.message .hint,.message .alert-text{display:none}.message .message-btn{display:none;margin-left:8px;padding:4px 8px;font-size:11px;font-weight:700;border:var(--border-width-thin) solid;border-color:var(--bg-shadow-light) var(--bg-shadow-dark) var(--bg-shadow-dark) var(--bg-shadow-light);background:linear-gradient(135deg,var(--bg-shadow-light) 0%,var(--bg-color) 100%);cursor:pointer;box-shadow:inset 1px 1px 0 0 var(--bg-highlight),inset -1px -1px 0 0 var(--bg-black)}.message .message-btn:active{border-color:var(--bg-shadow-dark) var(--bg-shadow-light) var(--bg-shadow-light) var(--bg-shadow-dark);box-shadow:inset -1px -1px 0 0 var(--bg-highlight),inset 1px 1px 0 0 var(--bg-black)}.message.has-alert .hint{display:none}.message.has-alert .alert-text{display:inline}.message.has-alert .message-btn{display:inline-block}.mobile-instructions{text-align:center;font-size:12px;color:var(--text-color);margin-bottom:10px;padding:8px 10px;background:#ffffffbf;border-radius:3px;border:1px solid var(--bg-shadow-dark);box-shadow:inset 1px 1px 0 var(--bg-highlight),inset -1px -1px #a0a0a0}.board-container{margin-bottom:10px;background:transparent;border:none;padding:0;display:flex;justify-content:center}.board-container-inner{box-shadow:none;overflow-x:auto;-webkit-overflow-scrolling:touch;display:flex;justify-content:safe center;width:fit-content}.board{display:inline-grid;gap:0px;background:transparent;padding:0}.cell{width:clamp(16px,6vw,64px);height:clamp(16px,6vw,64px);min-width:clamp(16px,6vw,64px);min-height:clamp(16px,6vw,64px);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:clamp(9px,1.6vw,14px);user-select:none;-webkit-user-select:none;touch-action:manipulation;cursor:pointer;border:var(--border-width-cell) solid;border-color:var(--bg-shadow-light) var(--bg-shadow-dark) var(--bg-shadow-dark) var(--bg-shadow-light);background:linear-gradient(135deg,var(--bg-shadow-light) 0%,var(--bg-color) 100%);box-shadow:inset 1px 1px 0 0 var(--bg-highlight),inset -1px -1px 0 0 var(--bg-black);transition:all 50ms;-webkit-tap-highlight-color:transparent}.cell.unrevealed:hover{background:linear-gradient(135deg,#e8e8e8 0%,var(--bg-color) 100%)}.cell.unrevealed:active{border-color:var(--bg-shadow-dark) var(--bg-shadow-light) var(--bg-shadow-light) var(--bg-shadow-dark);box-shadow:inset -1px -1px 0 0 var(--bg-highlight),inset 1px 1px 0 0 var(--bg-black)}.cell.revealed{border-color:var(--bg-shadow-dark) var(--bg-shadow-light) var(--bg-shadow-light) var(--bg-shadow-dark);background:var(--bg-color);box-shadow:inset 1px 1px 0 0 var(--bg-shadow-dark),inset -1px -1px 0 0 var(--bg-shadow-light);cursor:default}.cell.flagged{background:linear-gradient(135deg,var(--bg-shadow-light) 0%,var(--bg-color) 100%)}.cell.mine{background:var(--mine-bg)}.cell.number-1{color:var(--digit-1)}.cell.number-2{color:var(--digit-2)}.cell.number-3{color:var(--digit-3)}.cell.number-4{color:var(--digit-4)}.cell.number-5{color:var(--digit-5)}.cell.number-6{color:var(--digit-6)}.cell.number-7{color:var(--digit-7)}.cell.number-8{color:var(--digit-8)}.cell .probability{font-size:clamp(8px,1.5vw,10px);font-weight:700;text-shadow:0 0 2px rgba(255,255,255,.8)}.cell .probability.prob-safe,.cell .probability.prob-low{color:var(--prob-safe)}.cell .probability.prob-medium{color:var(--prob-medium)}.cell .probability.prob-high{color:var(--prob-high)}.cell .probability.prob-mine{color:var(--prob-high);font-weight:700}.board.game-won .cell.unrevealed,.board.game-lost .cell.unrevealed{cursor:default;opacity:.7}.controls{background:linear-gradient(135deg,var(--bg-shadow-light) 0%,var(--bg-shadow-dark) 100%);border:var(--border-width-thin) solid;border-color:var(--bg-shadow-light) var(--bg-shadow-dark) var(--bg-shadow-dark) var(--bg-shadow-light);padding:8px;margin-bottom:10px;box-shadow:inset 1px 1px 0 0 var(--bg-highlight),inset -1px -1px 0 0 var(--bg-black)}.controls-row{display:flex;gap:6px;align-items:center;margin-bottom:8px;flex-wrap:wrap}.controls-row:last-child{margin-bottom:0}.controls-row label{font-size:10px;font-weight:700;white-space:nowrap}.learning-mode-label{display:flex;align-items:center;gap:4px;font-size:10px;font-weight:700;white-space:nowrap;margin-left:auto;cursor:pointer}.learning-mode-label input[type=checkbox]{width:16px;height:16px;cursor:pointer;margin:0}.learning-mode-label span{font-size:9px}.modal{position:fixed;inset:0;background:#0006;display:none;align-items:center;justify-content:center;z-index:1000;padding:16px}.modal.is-open{display:flex}.modal-content{background:var(--bg-color);border:var(--border-width) solid;border-color:var(--bg-shadow-light) var(--bg-shadow-dark) var(--bg-shadow-dark) var(--bg-shadow-light);padding:12px;box-shadow:inset 1px 1px 0 0 var(--bg-highlight),inset -1px -1px 0 0 var(--bg-black);width:100%;max-width:320px}.modal-content h2{font-size:14px;margin:0 0 8px}.modal-body{display:grid;grid-template-columns:1fr;gap:6px}.modal-body label{font-size:11px;font-weight:700}.modal-body input{height:28px;padding:4px 6px;border:var(--border-width-thin) solid;border-color:var(--bg-shadow-dark) var(--bg-shadow-light) var(--bg-shadow-light) var(--bg-shadow-dark);background:var(--bg-highlight);font-size:12px}.modal-error{min-height:16px;font-size:11px;color:#a00000}.modal-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:8px}.difficulty-buttons{display:flex;gap:4px;flex-wrap:wrap;flex:1}.difficulty-btn,.action-btn{font-size:10px;font-weight:400;border:var(--border-width-thin) solid;border-color:var(--bg-shadow-light) var(--bg-shadow-dark) var(--bg-shadow-dark) var(--bg-shadow-light);background:linear-gradient(135deg,var(--bg-shadow-light) 0%,var(--bg-color) 100%);cursor:pointer;transition:all .1s;box-shadow:inset 1px 1px 0 0 var(--bg-highlight),inset -1px -1px 0 0 var(--bg-black);white-space:nowrap;min-height:48px;flex:1;min-width:60px;-webkit-tap-highlight-color:transparent}.difficulty-btn:hover,.action-btn:hover{background:linear-gradient(135deg,#e8e8e8 0%,var(--bg-color) 100%)}.difficulty-btn:active,.action-btn:active{border-color:var(--bg-shadow-dark) var(--bg-shadow-light) var(--bg-shadow-light) var(--bg-shadow-dark);box-shadow:inset -1px -1px 0 0 var(--bg-highlight),inset 1px 1px 0 0 var(--bg-black)}.difficulty-btn.active{border-color:var(--bg-shadow-dark) var(--bg-shadow-light) var(--bg-shadow-light) var(--bg-shadow-dark);box-shadow:inset -1px -1px 0 0 var(--bg-highlight),inset 1px 1px 0 0 var(--bg-black);background:linear-gradient(135deg,var(--bg-color) 0%,var(--bg-shadow-dark) 100%)}.action-btn:disabled{opacity:.5;cursor:not-allowed}.stats{background:linear-gradient(135deg,var(--bg-shadow-light) 0%,var(--bg-shadow-dark) 100%);border:var(--border-width-thin) solid;border-color:var(--bg-shadow-light) var(--bg-shadow-dark) var(--bg-shadow-dark) var(--bg-shadow-light);padding:8px;box-shadow:inset 1px 1px 0 0 var(--bg-highlight),inset -1px -1px 0 0 var(--bg-black)}.stats h3{margin:0 0 8px;font-size:12px;font-weight:700}.high-scores{display:grid;grid-template-columns:1fr;gap:10px}.score-section h4{margin:0 0 4px;font-size:11px;font-weight:700;border-bottom:1px solid var(--bg-shadow-dark);padding-bottom:2px}.score-list{margin:0;padding-left:20px;font-size:10px;line-height:1.5}.score-list li{margin-bottom:2px}@media (max-width: 767px){.message .mobile-hint{display:inline}}@media (min-width: 768px){body{padding:0}.game-container{padding:12px}h1{font-size:20px;margin-bottom:12px}.cell{width:clamp(20px,3.5vw,28px);height:clamp(20px,3.5vw,28px);min-width:clamp(20px,3.5vw,28px);min-height:clamp(20px,3.5vw,28px);font-size:clamp(10px,1.2vw,12px)}.display{font-size:20px;line-height:20px;max-width:70px}.smiley-btn{width:40px;height:40px;min-width:40px;min-height:40px;font-size:28px}.mobile-instructions{display:flex;flex-direction:row;justify-content:center;gap:16px}.mobile-instructions small{display:inline}.mobile-instructions .mobile-text{display:none}.mobile-instructions .desktop-text{display:inline}.high-scores{grid-template-columns:repeat(3,1fr)}.difficulty-buttons{gap:8px}.difficulty-btn{min-width:120px}.action-btn{padding:8px 12px;min-height:36px}.undo-btn{min-width:80px}}@media (min-width: 1024px){.app-container{max-width:100%;width:100%}.cell{width:clamp(22px,2.8vw,30px);height:clamp(22px,2.8vw,30px);min-width:clamp(22px,2.8vw,30px);min-height:clamp(22px,2.8vw,30px);font-size:clamp(11px,1vw,13px)}.display{font-size:22px}.high-scores{grid-template-columns:repeat(3,1fr);gap:20px}.stats{padding:12px}.controls{padding:10px}.controls-row{gap:10px}}@media (min-width: 1440px){body{padding:0}.cell{width:clamp(24px,2.5vw,48px);height:clamp(24px,2.5vw,48px);min-width:clamp(24px,2.5vw,48px);min-height:clamp(24px,2.5vw,48px);font-size:clamp(12px,.9vw,14px)}.display{font-size:24px;height:28px;line-height:24px;max-width:80px}.smiley-btn{width:44px;height:44px;min-width:44px;min-height:44px;font-size:48px}h1{font-size:24px}}