*{box-sizing:border-box;margin:0;padding:0}:root{--bg:#0f172a;--bg-secondary:#1e293b;--bg-card:#334155;--text:#e2e8f0;--text-muted:#94a3b8;--accent:#3b82f6;--accent-hover:#2563eb;--success:#22c55e;--error:#ef4444;--border:#475569;--accent-bg:#3b82f626;--sidebar-width:240px}body{background:var(--bg);color:var(--text);min-height:100vh;font-family:Segoe UI,Tahoma,sans-serif}.layout{min-height:100vh;display:flex}.sidebar{width:var(--sidebar-width);background:var(--bg-secondary);border-left:1px solid var(--border);flex-direction:column;height:100vh;display:flex;position:fixed;top:0;right:0}.sidebar-header{border-bottom:1px solid var(--border);align-items:center;gap:12px;padding:24px;display:flex}.sidebar-header .logo{font-size:32px}.sidebar-header h1{color:var(--text);font-size:18px;font-weight:600}.nav{flex:1;padding:16px 0}.nav-link{color:var(--text-muted);align-items:center;gap:12px;padding:12px 24px;text-decoration:none;transition:all .2s;display:flex}.nav-link:hover{color:var(--text);background:var(--bg-card)}.nav-link.active{color:var(--accent);border-right:3px solid var(--accent);background:#3b82f61a}.logout-btn{color:var(--text-muted);cursor:pointer;border:none;border-top:1px solid var(--border);background:0 0;align-items:center;gap:12px;width:100%;padding:16px 24px;font-size:14px;display:flex}.logout-btn:hover{color:var(--error);background:#ef44441a}.main-content{margin-right:var(--sidebar-width);flex:1;padding:24px}.page-header{margin-bottom:24px}.page-header h2{margin-bottom:4px;font-size:28px;font-weight:600}.page-header p{color:var(--text-muted)}.filters-bar{flex-wrap:wrap;gap:16px;margin-bottom:24px;display:flex}.filter-group{flex-direction:column;gap:6px;display:flex}.filter-group label{color:var(--text-muted);font-size:12px}.filter-group select,.filter-group input{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text);border-radius:6px;min-width:120px;padding:8px 12px;font-size:14px}.filter-group input[type=number]{width:100px}.view-toggle{background:var(--bg-secondary);border-radius:8px;gap:4px;padding:4px;display:flex}.view-toggle button{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:6px;align-items:center;padding:8px 12px;display:flex}.view-toggle button.active{background:var(--accent);color:#fff}.search-section{background:var(--bg-secondary);border-radius:12px;margin-bottom:24px;padding:20px}.search-row{flex-wrap:wrap;align-items:flex-end;gap:16px;margin-bottom:16px;display:flex}.search-box{background:var(--bg);border:1px solid var(--border);border-radius:8px;flex:1;align-items:center;gap:10px;min-width:200px;padding:10px 14px;display:flex}.search-box input{color:var(--text);background:0 0;border:none;outline:none;flex:1;font-size:14px}.search-box input::placeholder{color:var(--text-muted)}.search-box button{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:0;display:flex}.search-box svg{color:var(--text-muted)}.rating-range{align-items:center;gap:8px;display:flex}.rating-range input{background:var(--bg);border:1px solid var(--border);width:70px;color:var(--text);text-align:center;border-radius:6px;padding:8px 10px;font-size:14px}.rating-range span{color:var(--text-muted)}.themes-row{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.themes-label{color:var(--text-muted);white-space:nowrap;align-items:center;gap:6px;font-size:13px;display:flex}.theme-chips{flex-wrap:wrap;gap:8px;display:flex}.theme-chip{background:var(--bg);border:1px solid var(--border);color:var(--text-muted);cursor:pointer;border-radius:20px;align-items:center;gap:6px;padding:6px 12px;font-size:12px;transition:all .15s;display:flex}.chip-count{opacity:.7;font-size:10px}.clear-themes{color:var(--error);cursor:pointer;background:0 0;border:none;padding:6px 12px;font-size:12px}.clear-themes:hover{text-decoration:underline}.puzzles-container{flex:1}.puzzles-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px;margin-bottom:20px;display:grid}.puzzle-card{background:var(--bg-secondary);cursor:pointer;border:2px solid #0000;border-radius:10px;transition:all .2s;overflow:hidden}.puzzle-card:hover{transform:translateY(-2px);box-shadow:0 8px 20px #0000004d}.puzzle-card.selected{border-color:var(--accent)}.puzzle-board-mini{background:var(--bg);justify-content:center;padding:8px;display:flex}.puzzle-card-info{padding:10px}.puzzle-card-header{justify-content:space-between;align-items:center;margin-bottom:6px;display:flex}.puzzle-rating{color:var(--accent);align-items:center;gap:4px;font-size:13px;font-weight:600;display:flex}.puzzle-difficulty{color:#fff;border-radius:10px;padding:2px 8px;font-size:10px}.puzzle-title{color:var(--text);white-space:nowrap;text-overflow:ellipsis;margin-bottom:4px;font-size:12px;overflow:hidden}.puzzle-themes-mini{flex-wrap:wrap;gap:4px;margin-bottom:6px;display:flex}.puzzle-themes-mini span{color:var(--text-muted);background:var(--bg);border-radius:4px;padding:2px 6px;font-size:10px}.puzzle-id{color:var(--text-muted);font-family:monospace;font-size:10px}.puzzles-list{flex-direction:column;gap:8px;margin-bottom:20px;display:flex}.puzzles-list .puzzle-card{align-items:center;gap:16px;padding:8px;display:flex}.puzzles-list .puzzle-board-mini{flex-shrink:0;padding:4px}.puzzles-list .puzzle-card-info{flex:1;align-items:center;gap:16px;display:flex}.puzzles-list .puzzle-card-header{flex-direction:column;align-items:flex-start;gap:4px;margin-bottom:0}.puzzles-layout{grid-template-columns:1fr 350px;gap:24px;display:grid}.puzzles-table-container{background:var(--bg-secondary);border-radius:12px;overflow:hidden}.puzzles-table{border-collapse:collapse;width:100%;font-size:14px}.puzzles-table th{text-align:right;background:var(--bg-card);color:var(--text-muted);border-bottom:1px solid var(--border);padding:12px 16px;font-weight:500}.puzzles-table td{border-bottom:1px solid var(--border);padding:12px 16px}.puzzles-table tr{cursor:pointer;transition:background .2s}.puzzles-table tbody tr:hover{background:var(--bg-card)}.puzzles-table tr.selected{background:#3b82f626}.id-cell{color:var(--text-muted);font-family:monospace;font-size:12px}.themes-cell{font-size:12px}.rating-cell{color:var(--accent);font-weight:600}.editable-cell input{background:var(--bg);border:1px solid var(--accent);width:100%;color:var(--text);border-radius:4px;padding:6px 10px;font-size:13px}.editable-cell .empty{color:var(--text-muted)}.actions-cell{width:100px}.action-buttons{gap:8px;display:flex}.edit-btn{background:var(--bg-card);border:1px solid var(--border);color:var(--text);cursor:pointer;border-radius:4px;padding:4px 12px;font-size:12px}.edit-btn:hover{background:var(--accent);border-color:var(--accent)}.save-btn,.cancel-btn{cursor:pointer;border:none;border-radius:4px;align-items:center;padding:4px 8px;display:flex}.save-btn{background:var(--success);color:#fff}.cancel-btn{background:var(--bg-card);color:var(--text)}.pagination{border-top:1px solid var(--border);justify-content:center;align-items:center;gap:16px;padding:16px;display:flex}.pagination button{background:var(--bg-card);border:1px solid var(--border);color:var(--text);cursor:pointer;border-radius:6px;align-items:center;gap:6px;padding:8px 16px;font-size:14px;display:flex}.pagination button:hover:not(:disabled){background:var(--accent);border-color:var(--accent)}.pagination button:disabled{opacity:.5;cursor:not-allowed}.pagination span{color:var(--text-muted);font-size:14px}.puzzle-preview{background:var(--bg-secondary);border-radius:12px;height:fit-content;padding:20px;position:sticky;top:24px}.puzzle-preview h3{color:var(--text);margin-bottom:16px;font-size:16px}.board-container{flex-direction:column;align-items:center;margin-bottom:16px;display:flex}.puzzle-details{font-size:13px}.puzzle-details p{color:var(--text-muted);margin-bottom:8px}.puzzle-details strong{color:var(--text)}.puzzle-details code{background:var(--bg);word-break:break-all;border-radius:4px;padding:2px 6px;font-size:11px}.edit-puzzle-btn{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:8px;justify-content:center;align-items:center;gap:8px;width:100%;margin-top:16px;padding:12px;font-size:14px;transition:opacity .2s;display:flex}.edit-puzzle-btn:hover{opacity:.9}.no-selection{text-align:center;color:var(--text-muted)}.no-selection p{margin-top:16px}.move-controls{background:var(--bg);border-radius:8px;justify-content:center;align-items:center;gap:8px;margin-bottom:12px;padding:8px;display:flex}.move-controls button{background:var(--bg-card);color:var(--text);cursor:pointer;border:none;border-radius:6px;justify-content:center;align-items:center;padding:8px;transition:all .2s;display:flex}.move-controls button:hover:not(:disabled){background:var(--accent);color:#fff}.move-controls button:disabled{opacity:.4;cursor:not-allowed}.move-counter{color:var(--text-muted);text-align:center;min-width:50px;font-size:13px}.moves-list{background:var(--bg);border-radius:8px;flex-wrap:wrap;gap:6px;max-height:80px;margin-bottom:16px;padding:10px;display:flex;overflow-y:auto}.moves-list .move{background:var(--bg-card);color:var(--text-muted);cursor:pointer;border-radius:4px;padding:4px 8px;font-family:monospace;font-size:12px;transition:all .2s}.moves-list .move:hover{background:var(--accent-bg);color:var(--accent)}.moves-list .move.played{background:var(--accent);color:#fff}.moves-list .move.current{box-shadow:0 0 0 2px var(--success)}.loading,.error{text-align:center;color:var(--text-muted);padding:40px}.error{color:var(--error)}.login-page{background:var(--bg);justify-content:center;align-items:center;min-height:100vh;display:flex}.login-card{background:var(--bg-secondary);border-radius:16px;width:100%;max-width:400px;padding:40px;box-shadow:0 20px 50px #0000004d}.login-header{text-align:center;margin-bottom:32px}.login-logo{margin-bottom:16px;font-size:64px;display:block}.login-header h1{margin-bottom:8px;font-size:24px}.login-header p{color:var(--text-muted)}.form-group{margin-bottom:20px}.form-group label{color:var(--text-muted);margin-bottom:8px;font-size:14px;display:block}.form-group input{background:var(--bg);border:1px solid var(--border);width:100%;color:var(--text);border-radius:8px;padding:12px 16px;font-size:16px}.form-group input:focus{border-color:var(--accent);outline:none}.error-message{color:var(--error);text-align:center;margin-bottom:16px;font-size:14px}.login-btn{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:8px;width:100%;padding:14px;font-size:16px;font-weight:600;transition:background .2s}.login-btn:hover{background:var(--accent-hover)}.coming-soon{color:var(--text-muted);flex-direction:column;justify-content:center;align-items:center;padding:100px 20px;display:flex}.coming-soon span{margin-bottom:16px;font-size:64px}@media (width<=1024px){.puzzles-layout{grid-template-columns:1fr}.puzzle-preview{position:static}}@media (width<=768px){.sidebar{--sidebar-width:60px;width:60px}.sidebar-header h1,.nav-link span,.logout-btn span{display:none}.sidebar-header,.nav-link,.logout-btn{justify-content:center;padding:16px}.main-content{margin-right:60px;padding:16px}}.levels-list{flex-direction:column;gap:16px;display:flex}.level-card{background:var(--bg-secondary);border-radius:12px;overflow:hidden}.level-header{cursor:pointer;justify-content:space-between;align-items:center;padding:20px;transition:background .2s;display:flex}.level-header:hover{background:var(--bg-card)}.level-info{align-items:center;gap:16px;display:flex}.level-number{background:var(--accent);color:#fff;border-radius:12px;justify-content:center;align-items:center;width:48px;height:48px;font-size:20px;font-weight:700;display:flex}.level-text h3{color:var(--text);margin-bottom:4px;font-size:18px}.level-text p{color:var(--text-muted);font-size:14px}.level-stats{color:var(--text-muted);align-items:center;gap:20px;display:flex}.level-stats .stat{align-items:center;gap:6px;font-size:14px;display:flex}.level-content{border-top:1px solid var(--border);background:var(--bg);padding:20px}.lessons-list{flex-direction:column;gap:12px;display:flex}.lesson-item{background:var(--bg-secondary);border-radius:8px;align-items:center;gap:16px;padding:16px;display:flex}.lesson-order{background:var(--bg-card);width:32px;height:32px;color:var(--text-muted);border-radius:8px;justify-content:center;align-items:center;font-weight:600;display:flex}.lesson-info{flex:1}.lesson-info h4{color:var(--text);margin-bottom:2px;font-size:15px}.lesson-info p{color:var(--text-muted);font-size:13px}.lesson-puzzles{color:var(--accent);background:var(--accent-bg);border-radius:4px;padding:4px 10px;font-size:13px}.no-lessons{text-align:center;color:var(--text-muted);padding:40px}.lessons-layout{grid-template-columns:260px 1fr 320px;gap:20px;min-height:calc(100vh - 150px);display:grid}.lessons-sidebar{background:var(--bg-secondary);border-radius:12px;max-height:calc(100vh - 150px);padding:16px;overflow-y:auto}.level-group{margin-bottom:20px}.level-title{color:var(--accent);border-bottom:1px solid var(--border);margin-bottom:10px;padding-bottom:8px;font-size:14px}.lessons-sidebar .lessons-list{gap:8px}.lessons-sidebar .lesson-item{cursor:pointer;border:2px solid #0000;padding:10px 12px;transition:all .2s}.lessons-sidebar .lesson-item:hover{background:var(--bg-card)}.lessons-sidebar .lesson-item.selected{border-color:var(--accent);background:var(--accent-bg)}.lessons-sidebar .lesson-order{width:24px;height:24px;font-size:12px}.lessons-sidebar .lesson-info{flex-direction:column;gap:2px;display:flex}.lessons-sidebar .lesson-title{color:var(--text);font-size:13px}.lessons-sidebar .lesson-count{color:var(--text-muted);font-size:11px}.lesson-editor{background:var(--bg-secondary);border-radius:12px;flex-direction:column;gap:20px;padding:20px;display:flex}.editor-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding-bottom:16px;display:flex}.editor-header h3{color:var(--text);margin-bottom:4px;font-size:18px}.editor-header p{color:var(--text-muted);font-size:13px}.editor-header .save-btn{background:var(--success);color:#fff;cursor:pointer;border:none;border-radius:8px;align-items:center;gap:8px;padding:10px 20px;font-size:14px;transition:opacity .2s;display:flex}.editor-header .save-btn:hover{opacity:.9}.editor-header .save-btn:disabled{opacity:.5;cursor:not-allowed}.puzzle-search{position:relative}.search-input-wrapper{gap:8px;display:flex}.search-input-wrapper input{background:var(--bg);border:1px solid var(--border);color:var(--text);border-radius:8px;flex:1;padding:12px 16px;font-size:14px}.search-input-wrapper button{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:8px;padding:12px 16px}.search-results{background:var(--bg);border:1px solid var(--border);z-index:100;border-radius:8px;max-height:300px;margin-top:8px;position:absolute;top:100%;left:0;right:0;overflow-y:auto;box-shadow:0 10px 30px #0000004d}.search-results-header{border-bottom:1px solid var(--border);color:var(--text-muted);justify-content:space-between;align-items:center;padding:12px 16px;font-size:13px;display:flex}.search-results-header button{color:var(--text-muted);cursor:pointer;background:0 0;border:none}.search-results-list{padding:8px}.search-result-item{border-radius:6px;align-items:center;gap:12px;padding:8px;transition:background .2s;display:flex}.search-result-item:hover{background:var(--bg-secondary)}.search-result-item .puzzle-info{flex-direction:column;flex:1;gap:2px;display:flex}.search-result-item .puzzle-id{color:var(--text);font-family:monospace;font-size:12px}.search-result-item .puzzle-rating{color:var(--text-muted);font-size:11px}.search-result-item .add-btn{background:var(--success);color:#fff;cursor:pointer;border:none;border-radius:4px;padding:6px 12px}.assigned-puzzles h4{color:var(--text-muted);margin-bottom:12px;font-size:14px}.assigned-puzzles .no-puzzles{text-align:center;color:var(--text-muted);background:var(--bg);border-radius:8px;padding:40px}.assigned-puzzles .puzzles-list{flex-direction:column;gap:8px;display:flex}.assigned-puzzle{background:var(--bg);border-radius:8px;align-items:center;gap:12px;padding:12px;display:flex}.puzzle-order{flex-direction:column;align-items:center;gap:2px;display:flex}.puzzle-order span{color:var(--text-muted);font-size:14px;font-weight:600}.puzzle-order .move-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:2px 6px;font-size:10px}.puzzle-order .move-btn:hover:not(:disabled){color:var(--accent)}.puzzle-order .move-btn:disabled{opacity:.3;cursor:not-allowed}.assigned-puzzle .puzzle-details{flex-direction:column;flex:1;gap:2px;display:flex}.assigned-puzzle .puzzle-id{color:var(--text);font-family:monospace;font-size:12px}.assigned-puzzle .puzzle-rating{color:var(--accent);font-size:11px}.assigned-puzzle .puzzle-themes{color:var(--text-muted);font-size:11px}.assigned-puzzle .remove-btn{border:1px solid var(--error);color:var(--error);cursor:pointer;background:0 0;border-radius:4px;padding:8px}.assigned-puzzle .remove-btn:hover{background:var(--error);color:#fff}.lesson-editor .no-selection{height:300px;color:var(--text-muted);justify-content:center;align-items:center;display:flex}.search-filters{gap:8px;display:flex}.search-filters select{background:var(--bg);border:1px solid var(--border);color:var(--text);border-radius:8px;min-width:140px;padding:10px 12px;font-size:13px}.search-filters input{background:var(--bg);border:1px solid var(--border);color:var(--text);border-radius:8px;flex:1;padding:10px 12px;font-size:13px}.search-filters button{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:8px;padding:10px 14px}.puzzle-themes-small{color:var(--text-muted);font-size:10px}.result-actions{gap:4px;display:flex}.result-actions button{cursor:pointer;border:none;border-radius:4px;align-items:center;padding:6px 8px;display:flex}.preview-btn{background:var(--bg-card);color:var(--text)}.preview-btn:hover{background:var(--accent);color:#fff}.assigned-puzzle.previewing{border:2px solid var(--accent)}.puzzle-actions{gap:6px;display:flex}.puzzle-actions .preview-btn,.puzzle-actions .remove-btn{cursor:pointer;border-radius:4px;align-items:center;padding:8px;display:flex}.puzzle-actions .preview-btn{background:var(--bg-card);color:var(--text);border:none}.puzzle-actions .remove-btn{border:1px solid var(--error);color:var(--error);background:0 0}.no-lessons-text{color:var(--text-muted);padding:10px;font-size:12px}.preview-panel{background:var(--bg-secondary);border-radius:12px;height:fit-content;max-height:calc(100vh - 150px);padding:16px;position:sticky;top:24px;overflow-y:auto}.preview-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.preview-header h4{color:var(--text);font-size:14px}.preview-header button{color:var(--text-muted);cursor:pointer;background:0 0;border:none}.preview-board{justify-content:center;margin-bottom:12px;display:flex}.preview-controls{background:var(--bg);border-radius:6px;justify-content:center;align-items:center;gap:6px;margin-bottom:10px;padding:8px;display:flex}.preview-controls button{background:var(--bg-card);color:var(--text);cursor:pointer;border:none;border-radius:4px;padding:6px;display:flex}.preview-controls button:hover:not(:disabled){background:var(--accent);color:#fff}.preview-controls button:disabled{opacity:.4}.preview-controls span{color:var(--text-muted);text-align:center;min-width:40px;font-size:12px}.preview-moves{background:var(--bg);border-radius:6px;flex-wrap:wrap;gap:4px;max-height:60px;margin-bottom:12px;padding:8px;display:flex;overflow-y:auto}.preview-moves .move{background:var(--bg-card);color:var(--text-muted);cursor:pointer;border-radius:3px;padding:3px 6px;font-family:monospace;font-size:11px}.preview-moves .move.played{background:var(--accent);color:#fff}.preview-info{margin-bottom:12px;font-size:12px}.preview-info p{color:var(--text-muted);margin-bottom:4px}.preview-info strong{color:var(--text)}.add-to-lesson-btn{background:var(--success);color:#fff;cursor:pointer;border:none;border-radius:6px;justify-content:center;align-items:center;gap:6px;width:100%;padding:10px;font-size:14px;display:flex}.add-to-lesson-btn:hover{opacity:.9}.preview-empty{height:200px;color:var(--text-muted);text-align:center;justify-content:center;align-items:center;display:flex}@media (width<=1200px){.lessons-layout{grid-template-columns:240px 1fr}.preview-panel{display:none}}@media (width<=900px){.lessons-layout{grid-template-columns:1fr}.lessons-sidebar{max-height:300px}}.page-header{justify-content:space-between;align-items:center;margin-bottom:24px;display:flex}.page-header .add-btn{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:8px;align-items:center;gap:8px;padding:10px 20px;font-size:14px;transition:background .2s;display:flex}.page-header .add-btn:hover{background:var(--accent-hover)}.level-actions{gap:8px;margin-left:12px;display:flex}.icon-btn{background:var(--bg-card);color:var(--text-muted);cursor:pointer;border:none;border-radius:6px;align-items:center;padding:8px;transition:all .2s;display:flex}.icon-btn:hover{background:var(--accent);color:#fff}.icon-btn.danger:hover{background:var(--error)}.lessons-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.lessons-header h4{color:var(--text-muted);font-size:14px}.add-btn.small{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:6px;align-items:center;gap:6px;padding:6px 12px;font-size:12px;display:flex}.lesson-item.managed{align-items:center;gap:12px;display:flex}.lesson-themes{color:var(--accent)}.lesson-actions{gap:6px;display:flex}.entity-form{background:var(--bg);border:1px solid var(--border);border-radius:10px;margin-bottom:16px;padding:20px}.form-row{gap:16px;margin-bottom:16px;display:flex}.form-row:last-of-type{margin-bottom:0}.entity-form .form-group{flex:1;margin-bottom:0}.entity-form .form-group.small{flex:0 0 100px}.entity-form .form-group.full-width{flex:100%}.entity-form .form-group.flex-grow{flex:2}.entity-form label{color:var(--text-muted);margin-bottom:6px;font-size:12px;display:block}.entity-form input,.entity-form select{background:var(--bg-secondary);border:1px solid var(--border);width:100%;color:var(--text);border-radius:6px;padding:10px 12px;font-size:14px}.entity-form input:focus,.entity-form select:focus{border-color:var(--accent);outline:none}.themes-picker{flex-wrap:wrap;gap:8px;display:flex}.theme-tag{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-muted);cursor:pointer;border-radius:16px;padding:6px 12px;font-size:12px;transition:all .2s}.theme-tag:hover{border-color:var(--accent);color:var(--accent)}.theme-tag.selected{background:var(--accent);border-color:var(--accent);color:#fff}.form-actions{border-top:1px solid var(--border);gap:12px;margin-top:20px;padding-top:16px;display:flex}.form-actions .save-btn{background:var(--success);color:#fff;cursor:pointer;border:none;border-radius:8px;align-items:center;gap:8px;padding:10px 20px;font-size:14px;display:flex}.form-actions .save-btn:disabled{opacity:.5;cursor:not-allowed}.form-actions .cancel-btn{background:var(--bg-card);color:var(--text-muted);cursor:pointer;border:none;border-radius:8px;align-items:center;gap:8px;padding:10px 20px;font-size:14px;display:flex}.form-actions .cancel-btn:hover{background:var(--border)}.puzzle-creator-page{min-height:calc(100vh - 48px)}.puzzle-creator-page .page-header{margin-bottom:20px}.header-actions{align-items:center;gap:16px;display:flex}.save-success{color:var(--success);align-items:center;gap:6px;font-size:14px;display:flex}.reset-btn{background:var(--bg-card);color:var(--text-muted);cursor:pointer;border:none;border-radius:8px;align-items:center;gap:8px;padding:10px 20px;font-size:14px;display:flex}.reset-btn:hover{background:var(--border);color:var(--text)}.creator-layout{grid-template-columns:280px 1fr 300px;gap:24px;min-height:calc(100vh - 180px);display:grid}.creator-sidebar{background:var(--bg-secondary);border-radius:12px;flex-direction:column;gap:16px;padding:20px;display:flex}.control-section{border-bottom:1px solid var(--border);padding-bottom:16px}.control-section:last-of-type{border-bottom:none}.control-section h4{color:var(--text-muted);margin-bottom:12px;font-size:13px}.pieces-palette{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.piece-btn{cursor:pointer;background:#e8e8e8;border:2px solid #0000;border-radius:8px;justify-content:center;align-items:center;width:50px;height:50px;padding:4px;transition:all .15s;display:flex}.piece-btn svg{width:100%;height:100%}.piece-btn:hover{border-color:var(--accent);background:#fff;transform:scale(1.08)}.piece-btn.selected{border-color:var(--accent);background:var(--accent);box-shadow:0 0 0 3px var(--accent-bg)}.tools-row{flex-wrap:wrap;gap:8px;display:flex}.tool-btn{background:var(--bg);border:1px solid var(--border);color:var(--text-muted);cursor:pointer;border-radius:6px;align-items:center;gap:6px;padding:8px 12px;font-size:12px;transition:all .2s;display:flex}.tool-btn:hover{border-color:var(--accent);color:var(--accent)}.tool-btn.selected{border-color:var(--accent);background:var(--accent-bg);color:var(--accent)}.tool-btn.selected.danger{border-color:var(--error);color:var(--error);background:#ef444426}.tool-btn:disabled{opacity:.4;cursor:not-allowed}.side-selector{gap:8px;display:flex}.side-selector button{background:var(--bg);border:1px solid var(--border);color:var(--text-muted);cursor:pointer;border-radius:6px;flex:1;padding:10px;font-size:13px}.side-selector button.selected{background:var(--accent);border-color:var(--accent);color:#fff}.castling-options{grid-template-columns:1fr 1fr;gap:8px;display:grid}.castling-options label{color:var(--text-muted);cursor:pointer;align-items:center;gap:6px;font-size:12px;display:flex}.castling-options input[type=checkbox]{width:16px;height:16px;accent-color:var(--accent)}.action-btn{cursor:pointer;border:none;border-radius:8px;justify-content:center;align-items:center;gap:8px;width:100%;padding:14px;font-size:14px;font-weight:600;transition:opacity .2s;display:flex}.action-btn.primary{background:var(--accent);color:#fff}.action-btn.success{background:var(--success);color:#fff}.action-btn:hover{opacity:.9}.action-btn:disabled{opacity:.5;cursor:not-allowed}.hint-text{color:var(--text-muted);font-size:12px;line-height:1.5}.recorded-moves{background:var(--bg);border-radius:8px;flex-wrap:wrap;align-content:flex-start;gap:6px;min-height:80px;max-height:150px;padding:12px;display:flex;overflow-y:auto}.empty-text{color:var(--text-muted);text-align:center;width:100%;font-size:12px}.recorded-move,.review-move{background:var(--bg-card);color:var(--text);border-radius:4px;align-items:center;gap:2px;padding:4px 8px;font-family:monospace;font-size:12px;display:inline-flex}.move-num{color:var(--text-muted);margin-left:2px}.record-actions{gap:8px;display:flex}.review-controls{background:var(--bg);border-radius:8px;justify-content:center;align-items:center;gap:8px;padding:10px;display:flex}.review-controls button{background:var(--bg-card);color:var(--text);cursor:pointer;border:none;border-radius:4px;padding:8px;display:flex}.review-controls button:hover:not(:disabled){background:var(--accent);color:#fff}.review-controls button:disabled{opacity:.4}.review-controls span{color:var(--text-muted);text-align:center;min-width:50px;font-size:13px}.review-moves{background:var(--bg);border-radius:8px;flex-wrap:wrap;gap:6px;max-height:120px;padding:12px;display:flex;overflow-y:auto}.review-move{cursor:pointer;transition:all .2s}.review-move:hover{background:var(--accent-bg)}.review-move.played{background:var(--accent);color:#fff}.review-actions{gap:8px;display:flex}.creator-board{flex-direction:column;align-items:center;gap:16px;display:flex}.fen-display{background:var(--bg-secondary);border-radius:8px;align-items:center;gap:8px;width:100%;max-width:450px;padding:12px 16px;display:flex}.fen-display label{color:var(--text-muted);font-size:12px}.fen-display code{color:var(--accent);word-break:break-all;font-family:monospace;font-size:11px}.creator-meta{background:var(--bg-secondary);border-radius:12px;flex-direction:column;gap:20px;padding:20px;display:flex}.meta-section{border-bottom:1px solid var(--border);padding-bottom:16px}.meta-section:last-of-type{border-bottom:none}.meta-section h4{color:var(--text-muted);margin-bottom:12px;font-size:13px}.meta-field{margin-bottom:12px}.meta-field:last-child{margin-bottom:0}.meta-field label{color:var(--text-muted);margin-bottom:6px;font-size:12px;display:block}.meta-field input,.meta-field select{background:var(--bg);border:1px solid var(--border);width:100%;color:var(--text);border-radius:6px;padding:10px 12px;font-size:14px}.meta-field input:focus,.meta-field select:focus{border-color:var(--accent);outline:none}.themes-grid{flex-wrap:wrap;gap:6px;display:flex}.theme-chip{background:var(--bg);border:1px solid var(--border);color:var(--text-muted);cursor:pointer;border-radius:14px;padding:5px 10px;font-size:11px;transition:all .2s}.theme-chip:hover{border-color:var(--accent);color:var(--accent)}.theme-chip.selected{background:var(--accent);border-color:var(--accent);color:#fff}.save-puzzle-btn{background:var(--success);color:#fff;cursor:pointer;border:none;border-radius:8px;justify-content:center;align-items:center;gap:8px;width:100%;margin-top:auto;padding:14px;font-size:14px;font-weight:600;display:flex}.save-puzzle-btn:hover:not(:disabled){opacity:.9}.save-puzzle-btn:disabled{opacity:.5;cursor:not-allowed}.save-error{color:var(--error);text-align:center;background:#ef444426;border-radius:6px;padding:10px;font-size:13px}@media (width<=1200px){.creator-layout{grid-template-columns:250px 1fr}.creator-meta{display:none}}@media (width<=900px){.creator-layout{grid-template-columns:1fr}.creator-sidebar{order:2}}
