:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-color:#0b0f19;--surface-main:#131a2a;--surface-highlight:#1e293b;--surface-border:#334155;--surface-glass:#131a2ab3;--text-main:#f8fafc;--text-dim:#94a3b8;--text-primary:#34d399;--color-primary:#10b981;--color-primary-glow:#10b98166;--color-error:#ef4444;--color-error-bg:#ef44441a;--color-success:#10b981;--color-accent:#8b5cf6;--cell-size:clamp(30px, 9.5vw, 60px);--cell-border:1px solid #33415580;--cell-border-thick:2px solid #34d399;--cell-bg:var(--surface-main);--cell-bg-selected:#10b98133;--cell-bg-related:#1e293b80;--cell-bg-same-number:#34d39940;--cell-text-initial:#fff;--cell-text-user:#34d399;--cell-text-error:#ff4d4d;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;font-weight:400;line-height:1.5}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);min-width:320px;min-height:100vh;color:var(--text-main);background-image:radial-gradient(ellipse at top, #1e293b 0%, transparent 80%), radial-gradient(ellipse at bottom, var(--color-primary-glow) 0%, transparent 60%);place-items:center;margin:0;display:flex}#root{width:100%;max-width:1280px;margin:0 auto;padding:1rem}@media (width<=600px){#root{padding:.5rem}}button{background-color:var(--surface-highlight);color:var(--text-main);cursor:pointer;outline-offset:2px;border:1px solid #0000;border-radius:8px;outline:2px solid #0000;padding:.6em 1.2em;font-family:inherit;font-size:1em;font-weight:500;transition:all .2s cubic-bezier(.4,0,.2,1),outline-color .3s ease-out}button:active{outline-color:var(--color-primary);transition:outline-color}@media (hover:hover){button:hover{border-color:var(--color-primary);background-color:var(--surface-border);box-shadow:0 0 10px var(--color-primary-glow)}}button:focus{outline:none}button:focus-visible{outline-color:var(--color-primary)}.glass-panel{background:var(--surface-glass);-webkit-backdrop-filter:blur(10px);border:1px solid var(--surface-border);border-radius:12px}.text-gradient{background:linear-gradient(90deg,#34d399,#8b5cf6);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.sudoku-board{border:var(--cell-border-thick);background:var(--surface-main);box-shadow:var(--board-shadow);aspect-ratio:1;grid-template-rows:repeat(9,1fr);width:100%;max-width:100%;margin:0 auto;display:grid;overflow:hidden;container-type:inline-size}.sudoku-row{grid-template-columns:repeat(9,1fr);display:grid}.sudoku-row:nth-child(3n){border-bottom:var(--cell-border-thick)}.sudoku-row:last-child{border-bottom:none}.sudoku-cell{border-right:var(--cell-border);border-bottom:var(--cell-border);cursor:pointer;background:var(--cell-bg);-webkit-user-select:none;user-select:none;width:100%;height:100%;color:var(--cell-text-user);justify-content:center;align-items:center;font-size:9.9cqw;font-weight:500;line-height:1;transition:all .15s;display:flex;position:relative}.sudoku-cell:nth-child(3n){border-right:var(--cell-border-thick)}.sudoku-cell:last-child{border-right:none}.sudoku-cell.initial{color:var(--cell-text-initial);text-shadow:0 0 1px #fff3;font-weight:800}@media (hover:hover){.sudoku-cell:hover{background:var(--surface-highlight)}}.sudoku-cell.related{background:var(--cell-bg-related)}.sudoku-cell.same-number{background:var(--cell-bg-same-number);text-shadow:0 0 10px var(--color-primary)}.sudoku-cell.selected{background:var(--cell-bg-selected);outline:2px solid var(--color-primary);outline-offset:-2px;z-index:10}.sudoku-board.notes-mode .sudoku-cell.selected{outline-style:dashed}.sudoku-cell.error{background:var(--color-error-bg);color:var(--color-error);text-shadow:0 0 8px var(--color-error);animation:2s infinite pulse-error}@keyframes pulse-error{0%{box-shadow:inset 0 0 0 2px #0000}50%{box-shadow:inset 0 0 0 2px #ef444480}to{box-shadow:inset 0 0 0 2px #0000}}.notes-grid{grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);width:100%;height:100%;padding:6%;display:grid}.note{color:#0000;justify-content:center;align-items:center;font-size:2.8cqw;font-weight:600;line-height:1;transition:color .2s;display:flex}.note.visible{color:var(--text-primary);text-shadow:-.5px -.5px #fff,.5px -.5px #fff,-.5px .5px #fff,.5px .5px #fff}.controls-container{flex-direction:column;gap:1.5rem;width:100%;display:flex}.controls-container.disabled{opacity:.6;pointer-events:none}.actions-row{justify-content:space-between;gap:.5rem;width:100%;max-width:440px;margin:0 auto;display:flex}.action-btn{color:var(--text-dim);background:0 0;border:none;border-radius:12px;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:.4rem;padding:.75rem .2rem;display:flex;position:relative}.action-btn span{letter-spacing:.5px;font-size:.75rem;font-weight:600}.action-btn .notes-badge{background:var(--surface-border);border-radius:6px;margin-top:-2px;padding:2px 6px;font-size:.6rem}.action-btn.active.notes-active .notes-badge{background:var(--color-primary);color:var(--bg-color)}@media (hover:hover){.action-btn:hover:not(:disabled){color:var(--color-primary);background:var(--surface-main);box-shadow:none}}.action-btn:disabled{opacity:.3;cursor:not-allowed}.action-btn.active.notes-active{color:var(--color-primary);background:var(--surface-main);box-shadow:inset 0 0 0 1px var(--color-primary), 0 0 15px var(--color-primary-glow)}.hint-icon-wrapper{display:inline-block;position:relative}.badge{background:var(--color-primary);color:var(--bg-color);border-radius:9px;justify-content:center;align-items:center;min-width:18px;height:18px;padding:0 4px;font-size:.7rem;font-weight:700;display:flex;position:absolute;top:-8px;right:-12px}.numpad{grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);gap:1rem;width:100%;max-width:440px;margin:0 auto;display:grid}.numpad-btn{color:var(--color-primary);aspect-ratio:1;background:var(--surface-main);border:1px solid var(--surface-border);border-radius:12px;justify-content:center;align-items:center;width:100%;height:auto;padding:0;font-size:4.5rem;font-weight:800;transition:all .2s;display:flex}.numpad-btn:active:not(:disabled){background:var(--surface-highlight);transform:scale(.95)}.numpad-btn.completed{visibility:hidden;opacity:0;pointer-events:none}@media (width<=1023px){.actions-row{gap:.4rem;max-width:100%;margin-bottom:.25rem}.action-btn{gap:.15rem;min-width:0;padding:.5rem 0}.action-btn span{font-size:.7rem}.numpad{background:var(--surface-border);border-radius:8px;grid-template-rows:auto;grid-template-columns:repeat(9,1fr);gap:1px;width:100%;max-width:100%;padding:1px;overflow:hidden}.numpad-btn{aspect-ratio:auto;background:var(--surface-main);border:none;border-radius:0;min-width:0;height:44px;font-size:2.9rem;font-weight:900}}.app-container{flex-direction:column;min-height:100vh;padding:1rem;display:flex}@media (width<=600px){.app-container{padding:.5rem .25rem}}.header{flex-direction:column;align-items:center;gap:1.5rem;width:100%;padding:0 0 2rem;display:flex}@media (width<=600px){.header{gap:.75rem;padding-bottom:.75rem}.header-top,.header-actions{gap:.5rem}}.header-top{justify-content:space-between;align-items:center;gap:1.5rem;width:100%;max-width:600px;display:flex}.header-actions{align-items:center;gap:1rem;display:flex}.theme-picker-container{align-items:center;display:flex;position:relative}.theme-picker-btn{border:2px solid var(--surface-border);cursor:pointer;border-radius:8px;width:32px;height:32px;padding:0;transition:all .2s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 10px #0003}.theme-picker-btn:hover{box-shadow:0 0 15px var(--color-primary-glow);border-color:#fff;transform:scale(1.1)}.hidden-color-input{opacity:0;pointer-events:none;width:0;height:0;position:absolute}.difficulty-dropdown-container{z-index:50;position:relative}.diff-dropdown-trigger{background:var(--surface-main);border:1px solid var(--surface-border);color:var(--color-primary);border-radius:12px;justify-content:space-between;align-items:center;gap:.8rem;min-width:140px;padding:.6rem 1.2rem;font-size:1rem;font-weight:700;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex;box-shadow:0 4px 12px #0000001a}.diff-dropdown-trigger:hover{border-color:var(--color-primary);background:var(--surface-highlight);transform:translateY(-1px)}.diff-dropdown-trigger.open{border-color:var(--color-primary);background:var(--surface-highlight);box-shadow:0 0 15px var(--color-primary-glow)}.diff-dropdown-trigger .chevron{color:var(--text-dim);transition:transform .3s}.diff-dropdown-trigger.open .chevron{color:var(--color-primary);transform:rotate(180deg)}.difficulty-menu{background:var(--surface-glass);-webkit-backdrop-filter:blur(12px);border:1px solid var(--surface-border);border-radius:16px;flex-direction:column;gap:.2rem;min-width:160px;padding:.5rem;animation:.2s ease-out slide-up;display:flex;position:absolute;top:calc(100% + .5rem);right:0;box-shadow:0 10px 25px #0006}@keyframes slide-up{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.menu-item{text-align:left;width:100%;color:var(--text-dim);background:0 0;border:1px solid #0000;border-radius:10px;padding:.75rem 1rem;font-size:.95rem;font-weight:500;transition:all .2s}.menu-item:hover{color:var(--text-main);background:#ffffff0d;border-color:#ffffff1a}.menu-item.active{background:var(--surface-highlight);color:var(--color-primary);border-color:var(--color-primary-glow);font-weight:700}.logo{letter-spacing:2px;text-transform:lowercase;color:var(--color-primary);text-shadow:0 0 20px var(--color-primary-glow);flex-shrink:1;margin:0;font-size:2.5rem;font-weight:800}@media (width<=600px){.logo{font-size:1.8rem}}.header-bottom{justify-content:center;align-items:center;gap:1rem;width:100%;display:flex}.seed-btn,.share-btn{color:var(--text-dim);border:1px solid var(--surface-border);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);cursor:pointer;background:#131a2a66;border-radius:99px;align-items:center;gap:.5rem;padding:.5rem 1.25rem;font-family:monospace;font-size:.85rem;transition:all .3s;display:flex}.seed-btn:hover,.share-btn:hover{border-color:var(--color-primary);color:var(--text-main);background:var(--surface-main);box-shadow:0 0 15px var(--color-primary-glow)}.install-banner{justify-content:center;width:100%;padding:0 0 1.5rem;display:flex}.install-btn{background:var(--color-primary);color:#fff;width:100%;max-width:450px;box-shadow:0 4px 15px var(--color-primary-glow);border:none;border-radius:99px;justify-content:center;align-items:center;gap:.5rem;padding:.8rem 1rem;font-size:1rem;font-weight:600;display:flex}.install-btn:hover{filter:brightness(1.1);transform:translateY(-2px)}.ios-instructions{color:var(--text-main);flex-direction:column;gap:1rem;padding:.5rem 0;font-size:1.1rem;font-weight:500;display:flex}.main-content{flex-direction:column;align-items:center;gap:1.5rem;width:100%;max-width:100vw;display:flex;overflow-x:hidden}.board-wrapper{flex-direction:column;gap:.5rem;width:100%;max-width:450px;display:flex}.board-header{color:var(--text-dim);justify-content:space-between;align-items:center;width:100%;padding:.25rem .5rem;font-size:1rem;font-weight:500;display:flex}.difficulty-label strong{color:var(--color-primary)}.timer{cursor:pointer;border-radius:6px;align-items:center;gap:.5rem;padding:.2rem .5rem;transition:background .2s;display:flex}.timer:hover{background:var(--surface-main);color:var(--text-main)}.board-container{position:relative}.board-blurred{filter:blur(8px);pointer-events:none;opacity:.3}.overlay{z-index:20;text-align:center;flex-direction:column;align-items:center;gap:1rem;min-width:250px;padding:2rem 3rem;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.overlay h2{color:var(--text-main);margin:0;font-size:2rem}.overlay.error h2{color:var(--color-error)}.overlay.success h2{color:var(--color-success)}.overlay-actions{flex-direction:column;gap:.75rem;width:100%;display:flex}.resume-btn,.new-game-btn-large,.continue-btn-large{background:var(--color-primary);color:#fff;cursor:pointer;border:none;border-radius:20px;padding:.8rem 2rem;font-size:1.2rem;font-weight:600;transition:all .2s}.continue-btn-large{background:linear-gradient(135deg, var(--color-primary), var(--color-accent));box-shadow:0 4px 15px #38bdf833}.resume-btn:hover,.new-game-btn-large:hover,.continue-btn-large:hover{filter:brightness(1.1);transform:translateY(-2px)}.new-game-btn-secondary{color:var(--text-dim);border:1px solid var(--surface-border);cursor:pointer;background:0 0;border-radius:20px;padding:.6rem 2rem;font-size:1rem;font-weight:500;transition:all .2s}.new-game-btn-secondary:hover{color:var(--text-main);border-color:var(--text-dim);background:#ffffff0d}.controls-section{flex-direction:column;align-items:center;gap:1.5rem;width:100%;display:flex}.new-game-btn{background:var(--surface-main);border:1px solid var(--color-primary);color:var(--color-primary);cursor:pointer;border-radius:99px;width:100%;max-width:440px;padding:.8rem 2rem;font-size:1.2rem;font-weight:600;transition:all .2s}.new-game-btn:hover{background:var(--color-primary);color:#fff}.dialog-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;background:#0009;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.dialog-content{flex-direction:column;gap:1rem;width:90%;max-width:400px;max-height:85vh;padding:2rem;display:flex;overflow-y:auto}.dialog-content h3{color:var(--text-main);margin:0}.dialog-desc{color:var(--text-dim);margin:0;font-size:.9rem}.dialog-content input{border:1px solid var(--surface-border);background:var(--surface-main);color:var(--text-primary);border-radius:8px;padding:.8rem;font-family:monospace;font-size:1.1rem}.dialog-content input:focus{outline:2px solid var(--color-primary);border-color:#0000}.dialog-actions{justify-content:flex-end;gap:1rem;margin-top:1rem;display:flex}.dialog-actions .secondary{border:1px solid var(--surface-border);background:0 0}.dialog-actions .primary{background:var(--color-primary);color:#fff}.share-dialog{max-width:440px;padding:1.5rem}.share-dialog h3{margin:0;font-size:1.5rem;font-weight:700}.dialog-header{justify-content:space-between;align-items:center;margin-bottom:1.5rem;display:flex}.close-btn{color:var(--text-dim);background:0 0;border:none;justify-content:center;align-items:center;padding:.5rem;display:flex}.close-btn:hover{color:var(--text-main);background:#ffffff0d}.qr-section{flex-direction:column;align-items:center;gap:1rem;margin-bottom:2rem;display:flex}.qr-container{background:#fff;border-radius:16px;padding:1rem;box-shadow:0 10px 30px #0000004d}.qr-hint{color:var(--text-dim);margin:0;font-size:.9rem}.share-actions-grid{flex-direction:column;gap:1.5rem;display:flex}.copy-url-field{border:1px solid var(--surface-border);background:#0003;border-radius:12px;gap:.5rem;padding:.5rem;display:flex}.copy-url-field input{color:var(--text-dim);background:0 0;border:none;outline:none;flex:1;padding:0 .5rem;font-family:monospace;font-size:.85rem}.copy-btn{background:var(--surface-highlight);border:1px solid var(--surface-border);border-radius:8px;justify-content:center;align-items:center;gap:.5rem;min-width:100px;padding:.6rem 1rem;font-size:.9rem;display:flex}.copy-btn.copied{background:var(--color-primary);color:#fff;border-color:#0000}.sns-share-row{gap:.75rem;display:flex}.sns-link{background:var(--surface-main);border:1px solid var(--surface-border);color:var(--text-main);border-radius:12px;flex-direction:column;flex:1;align-items:center;gap:.5rem;padding:1rem .5rem;font-size:.8rem;font-weight:600;text-decoration:none;transition:all .2s;display:flex}.sns-link:hover{border-color:#fff3;transform:translateY(-2px)}.sns-link.twitter:hover{background:#000;box-shadow:0 4px 15px #00000080}.sns-link.facebook:hover{background:#1877f2;box-shadow:0 4px 15px #1877f24d}.sns-link.line:hover{background:#06c755;box-shadow:0 4px 15px #06c7554d}.line-icon{letter-spacing:-1px;font-size:1rem}.lang-selector-btn{border:1px solid var(--surface-border);color:var(--text-dim);cursor:pointer;background:#ffffff0d;border-radius:12px;justify-content:center;align-items:center;width:42px;height:42px;padding:0;transition:all .2s;display:flex;overflow:hidden}.lang-selector-btn:hover,.lang-selector-btn.open{border-color:var(--color-primary);box-shadow:0 0 10px var(--color-primary-glow);background:#ffffff1a}.current-flag-img{object-fit:cover;width:100%;height:100%;transition:transform .2s}.lang-selector-btn:hover .current-flag-img{transform:scale(1.1)}.language-dialog{max-width:480px;padding:1.5rem}.language-grid{grid-template-columns:repeat(2,1fr);gap:.75rem;max-height:50vh;margin-top:1rem;padding-right:.5rem;display:grid;overflow-y:auto}@media (width<=480px){.language-grid{grid-template-columns:1fr}}.lang-menu-item{border:1px solid var(--surface-border);color:var(--text-main);cursor:pointer;text-align:left;background:#ffffff08;border-radius:12px;align-items:center;gap:1rem;padding:1rem;transition:all .2s;display:flex}[dir=rtl] .lang-menu-item{text-align:right;flex-direction:row-reverse}.lang-menu-item:hover{background:#ffffff14;border-color:#fff3;transform:translateY(-2px)}.lang-menu-item.active{background:var(--surface-highlight);border-color:var(--color-primary);color:var(--color-primary);font-weight:600}.menu-flag-img{object-fit:cover;border:1px solid #ffffff1a;border-radius:4px;width:32px;height:22px;box-shadow:0 2px 5px #0003}.menu-lang-name{font-size:1rem}.lang-code-tag{background:var(--surface-highlight);color:var(--color-primary);border-radius:4px;padding:2px 4px;font-size:.7rem;font-weight:800;line-height:1}[dir=rtl]{text-align:right}[dir=rtl] .header-actions{flex-direction:row-reverse}[dir=rtl] .chevron{transform:rotate(0)}[dir=rtl] .seed-btn,[dir=rtl] .share-btn{flex-direction:row-reverse}[dir=rtl] .mistakes-counter,[dir=rtl] .timer{text-align:right;direction:ltr}[dir=rtl] .action-btn{flex-direction:row-reverse}[dir=rtl] .numpad{direction:ltr}@media (width>=1024px){.header{padding-left:0}.main-content{flex-direction:row;justify-content:center;align-items:flex-start;gap:5rem;padding-top:1rem}.board-wrapper{max-width:580px}.controls-section{max-width:440px}}
