*{box-sizing:border-box;margin:0;padding:0}.no-transitions *{transition:none!important}:root{--bg-dark: #121212;--bg-card: #1e1e1e;--cell-bg: #2a2a3a;--cell-bg-hover: #3a3a4a;--sun-color: #e8a838;--moon-color: #7ba3c4;--constraint-equals: #4ecdc4;--constraint-cross: #ff6b6b;--text-primary: #ffffff;--text-secondary: #888888}body.light-theme{--bg-dark: #f5f5f5;--bg-card: #ffffff;--cell-bg: #e0e0e0;--cell-bg-hover: #d0d0d0;--text-primary: #1a1a1a;--text-secondary: #666666}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg-dark);color:var(--text-primary);min-height:100vh;display:flex;justify-content:center;align-items:center}#app{max-width:450px;width:100%;padding:20px;position:relative}.top-bar{position:fixed;top:20px;right:20px;display:flex;gap:8px;z-index:50}.top-bar button{width:36px;height:36px;border-radius:50%;border:1px solid #666;background:var(--cell-bg);color:var(--text-primary);font-size:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s;box-shadow:0 2px 4px #0000004d;line-height:2;padding-bottom:1px}.top-bar button:hover{background:var(--cell-bg-hover)}header{text-align:center;margin-bottom:20px}header h1{font-size:1.8rem;font-weight:600;margin-bottom:12px;color:var(--text-primary)}select{padding:10px 32px 10px 16px;border-radius:20px;border:1px solid #333;font-size:.9rem;cursor:pointer;background:var(--bg-card);color:var(--text-primary);appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='14' viewBox='0 0 12 14'%3E%3Cpath fill='%23888' d='M6 10L1 5h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;width:140px;text-align:center;text-align-last:center}select:focus{outline:none;border-color:#555}.puzzle-controls{display:flex;gap:8px;justify-content:center;align-items:center}#random-btn{width:36px;height:36px;border-radius:50%;border:1px solid #333;background:var(--bg-card);color:var(--text-primary);font-size:1.1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s}#random-btn:hover{background:var(--cell-bg)}.sidebar{position:fixed;top:0;right:0;height:100%;width:280px;background:var(--bg-card);padding:60px 24px 24px;z-index:100;box-shadow:-4px 0 20px #0000004d;transform:translate(100%)}.sidebar.hidden{transform:translate(100%)}.sidebar.ready{transition:transform .3s ease}.sidebar:not(.hidden){transform:translate(0)}.sidebar h2{margin-bottom:16px;color:var(--text-primary)}.sidebar ul{list-style:none;margin-bottom:16px}.sidebar li{margin-bottom:10px;color:var(--text-secondary);line-height:1.4;font-size:.9rem}.sidebar p{color:var(--text-secondary);font-size:.85rem}.help-section{margin-bottom:16px}.help-section p{margin-bottom:8px}.help-example{display:flex;gap:4px;align-items:center;justify-content:center}.help-example.with-constraint{gap:0;position:relative}.help-cell{width:36px;height:36px;background:var(--cell-bg);border-radius:6px;display:flex;justify-content:center;align-items:center}.help-cell.violation{background:#dc354533;box-shadow:inset 0 0 0 2px #dc354599}.help-cell .symbol{width:70%;height:70%}.help-cell .symbol.sun{background:var(--sun-color);border-radius:50%}.help-cell .symbol.moon{background:transparent;border-radius:50%;box-shadow:inset -8px -5px 0 0 var(--moon-color)}.help-constraint{width:20px;height:20px;background:var(--bg-card);border-radius:50%;display:flex;justify-content:center;align-items:center;font-weight:700;font-size:.9rem;z-index:1;margin:0 -4px;padding-bottom:5px}.help-constraint.equals,.help-constraint.cross{color:var(--constraint-equals)}.help-controls{margin-top:16px;padding-top:12px;border-top:1px solid var(--cell-bg)}.sidebar-close{position:absolute;top:16px;right:16px;width:28px;height:28px;border-radius:50%;border:none;background:var(--cell-bg);color:var(--text-primary);font-size:1.2rem;cursor:pointer;display:flex;align-items:center;justify-content:center}.modal-close:hover{background:var(--cell-bg-hover)}.hint-equals,.hint-cross{display:inline-block;width:20px;height:20px;line-height:16px;text-align:center;background:var(--bg-dark);border-radius:50%;color:var(--constraint-equals);font-weight:700;font-size:.85rem;vertical-align:middle}#timer{text-align:center;font-size:1.5rem;font-weight:500;color:var(--text-secondary);margin-bottom:16px}#grid-container{display:grid;grid-template-columns:repeat(6,1fr);gap:7px;background:var(--bg-card);padding:14px;border-radius:14px;position:relative;aspect-ratio:1;min-height:300px}.cell{background:var(--cell-bg);border-radius:9px;display:flex;justify-content:center;align-items:center;cursor:pointer;transition:background .15s,transform .1s;position:relative;-webkit-user-select:none;user-select:none;aspect-ratio:1}.cell:hover{background:var(--cell-bg-hover)}.cell:active{transform:scale(.95)}.cell.locked{cursor:default}.cell.locked:hover{background:var(--cell-bg)}.cell.violation{background:#dc354533;box-shadow:inset 0 0 0 2px #dc354599}.cell .symbol{width:70%;height:70%;display:flex;justify-content:center;align-items:center}.cell .symbol.sun{background:var(--sun-color);border-radius:50%}.cell .symbol.moon{width:60%;height:60%;background:transparent;border-radius:50%;box-shadow:inset -11px -7px 0 0 var(--moon-color)}.constraint{position:absolute;background:var(--bg-card);border-radius:50%;display:flex;justify-content:center;align-items:center;font-size:.9rem;font-weight:700;z-index:10;width:22px;height:22px;transform:translate(-50%,-50%);padding-bottom:4px}.constraint.equals,.constraint.cross{color:var(--constraint-equals)}.constraint.equals{font-size:1.1rem;padding-bottom:5px}.constraint.cross{font-size:1.05rem}.button-row{display:flex;gap:12px;margin-top:20px}.button-row button{flex:1;padding:14px 24px;border-radius:30px;border:1px solid #333;font-size:1rem;font-weight:500;cursor:pointer;background:var(--bg-card);color:var(--text-primary);transition:background .2s,border-color .2s}.button-row button:hover{background:#2a2a2a;border-color:#444}.button-row button:active{transform:scale(.98)}#victory-message{text-align:center;padding:24px;background:var(--bg-card);border-radius:12px;margin-top:20px;border:1px solid var(--constraint-equals)}#victory-message h2{color:var(--constraint-equals);margin-bottom:8px;font-size:1.4rem}#victory-message p{color:var(--text-secondary)}#victory-message.hidden{display:none}@media(max-width:420px){#app{padding:12px}header h1{font-size:1.5rem}#grid-container{gap:4px;padding:8px}.constraint{width:14px;height:14px;font-size:.65rem}.button-row button{padding:12px 16px;font-size:.9rem}}