*{box-sizing:border-box}body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;color:#24292f}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spinner{animation:spin 1s linear infinite;display:inline-block;margin-right:4px}.app{min-height:100vh;background:linear-gradient(145deg,#fff,#f6f8fa,#eef1f4);padding:16px}.container{max-width:900px;margin:0 auto;width:100%}.header{text-align:center;margin-bottom:16px}.header h1{font-size:24px;font-weight:600;margin:0;color:#0969da}.btn{transition:all .15s ease;border:1px solid #d0d7de;cursor:pointer;background:#f6f8fa;color:#24292f;padding:8px 16px;font-size:13px;border-radius:6px}.btn:hover:not(:disabled){filter:brightness(.95);transform:translateY(-1px)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn.primary{background:#2da44e;color:#fff;border:none}.btn.danger{background:#cf222e;color:#fff;border:none}.btn.warning{background:#bf8700;color:#fff;border:none;font-weight:600}.btn.small{padding:4px 8px;font-size:11px;border-radius:4px}.btn.cancel{background:#ffebe9;color:#cf222e;border:1px solid #ff8182}.board-size-controls{display:flex;gap:8px;flex-wrap:wrap;align-items:center;padding:12px;background:#fff;border-radius:8px;border:1px solid #d0d7de;margin-bottom:12px;box-shadow:0 1px 3px #0000000f}.board-size-controls .label{font-size:12px;color:#57606a}.board-size-controls .preset-btn{padding:4px 8px;font-size:11px}.board-size-controls .preset-btn.active{background:#2da44e;color:#fff}.board-size-controls .divider{width:1px;height:20px;background:#d0d7de}.board-size-controls .multiply{font-size:12px;color:#8b949e}.board-size-controls .blocked-count{font-size:12px;color:#bf8700}.board-size-controls input[type=number]{background:#fff;border:1px solid #d0d7de;border-radius:4px;color:#24292f;padding:4px 8px;width:50px;text-align:center}.action-bar{display:flex;gap:8px;align-items:center;padding:12px;background:#fff;border-radius:8px;border:1px solid #d0d7de;margin-bottom:12px;flex-wrap:wrap;box-shadow:0 1px 3px #0000000f}.action-bar .divider{width:1px;height:24px;background:#d0d7de}.action-bar .attempts{font-size:12px;color:#57606a;min-width:120px}.action-bar .attempts.searching{color:#bf8700}.action-bar .time{font-size:12px;color:#57606a;min-width:60px}.action-bar .status{font-size:12px;color:#1a7f37}.action-bar .status.error{color:#cf222e;font-weight:600}.action-bar .status.muted{color:#57606a}.action-bar .status.warning{color:#bf8700}.action-bar .status.success{color:#1a7f37}.solution-nav{display:flex;align-items:center;gap:6px;margin-left:auto}.solution-nav.disabled{opacity:.3}.solution-nav .nav-btn{padding:4px 8px;font-size:12px}.solution-nav .solution-index{font-size:12px;color:#0969da;min-width:60px;text-align:center}.edit-mode-hint{padding:8px 12px;background:#fff8c5;border-radius:6px;border:1px solid #d4a72c;margin-bottom:12px;font-size:12px;color:#6e5a00}.piece-placement-hint{padding:8px 12px;background:#dafbe1;border-radius:6px;border:1px solid #4ac26b;margin-bottom:12px;font-size:12px;color:#116329;display:flex;align-items:center;gap:12px;flex-wrap:wrap}.piece-placement-hint .variant-info{color:#57606a}.piece-placement-hint .hint-text{color:#57606a;font-size:11px}.board-container{background:#fff;border-radius:8px;padding:12px;border:1px solid #d0d7de;margin-bottom:12px;overflow-x:auto;box-shadow:0 1px 3px #0000000f}.board-grid{display:grid;gap:2px;background:#eef1f4;padding:2px;border-radius:4px;width:100%;margin:0 auto}.cell{aspect-ratio:1;border-radius:3px;display:flex;align-items:center;justify-content:center;font-size:clamp(6px,2vw,9px);font-weight:600;color:#0006;border:1px solid #d0d7de;transition:background-color .05s ease;cursor:default}.cell:hover{filter:brightness(.92)}.cell.edit-mode{border:2px dashed #d4a72c;cursor:pointer}.cell.placing{cursor:crosshair}.cell.clickable{cursor:pointer}.piece-selector{background:#fff;border-radius:8px;padding:12px;border:1px solid #d0d7de;box-shadow:0 1px 3px #0000000f}.piece-selector-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;flex-wrap:wrap;gap:8px}.piece-selector-controls{display:flex;align-items:center;gap:8px}.piece-selector-controls .label{font-size:12px;color:#57606a}.piece-selector-controls .btn{padding:2px 6px;font-size:10px;border-radius:3px}.piece-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(55px,1fr));gap:6px}.piece-item{text-align:center;padding:6px 4px;border-radius:6px;background:#f6f8fa;border:1px solid #d0d7de;position:relative;cursor:pointer;transition:all .15s ease}.piece-item:hover{transform:scale(1.03)}.piece-item.selected{background:#dafbe1;border:2px solid #4ac26b}.piece-item.disabled{opacity:.35}.piece-item.used{opacity:.5;cursor:not-allowed}.piece-item .delete-btn{position:absolute;top:2px;right:2px;width:12px;height:12px;padding:0;font-size:9px;background:#cf222e;border:none;border-radius:50%;color:#fff;cursor:pointer;line-height:12px}.piece-preview{display:inline-grid;gap:1px;margin-bottom:2px}.piece-cell{width:8px;height:8px;border-radius:1px}.piece-name{font-size:9px;font-weight:600}.enable-dot{width:8px;height:8px;border-radius:2px;margin:2px auto 0;background:#d0d7de;cursor:pointer}.enable-dot.enabled{background:#2da44e}.piece-selector-footer{font-size:10px;color:#8c959f;text-align:center;margin-top:10px}.editor-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.editor-modal{background:#fff;border-radius:12px;padding:20px;border:1px solid #d0d7de;max-width:280px;box-shadow:0 8px 24px #00000026}.editor-title{font-size:14px;color:#0969da;margin:0 0 16px;text-align:center}.editor-grid{display:grid;grid-template-columns:repeat(5,32px);gap:2px;margin-bottom:12px;justify-content:center}.editor-cell{width:32px;height:32px;border-radius:4px;cursor:pointer;border:1px solid #d0d7de}.color-picker{margin-bottom:12px}.color-picker .color-label{font-size:11px;color:#57606a;margin-bottom:4px}.color-options{display:flex;gap:4px;flex-wrap:wrap}.color-option{width:20px;height:20px;border-radius:4px;cursor:pointer;border:2px solid transparent}.color-option.selected{border:2px solid #24292f}.name-input{margin-bottom:16px}.name-input .name-label{font-size:11px;color:#57606a;margin-bottom:4px}.name-input .name-field{width:100%;padding:8px;font-size:13px;background:#fff;border:1px solid #d0d7de;border-radius:4px;color:#24292f;text-transform:uppercase}.editor-actions{display:flex;gap:8px}.editor-actions .btn{flex:1;padding:8px;font-size:12px}