.creative-tool { padding:24px 0; border-top:1px solid #ffffff26; }
.creative-tool[hidden] { display:none; }
.tool-heading,.chess-toolbar,.chess-share { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.tool-heading { justify-content:space-between; margin-bottom:16px; }
.creative-tool h3 { font-size:24px; margin:0; }
.creative-tool button,.creative-tool input,.creative-tool select,.creative-tool textarea { font:inherit; color:inherit; background:#1c2422; border:1px solid #6c7771; padding:10px; border-radius:4px; max-width:100%; }
.creative-tool button { cursor:pointer; }
.creative-tool button:disabled { opacity:.45; cursor:default; }
.creative-tool button:focus-visible,.creative-tool input:focus-visible { outline:2px solid #e6bd75; outline-offset:3px; }
.creative-tool label { display:grid; gap:6px; font-size:13px; }
.creative-tool form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin:20px 0; }
.creative-tool textarea { min-height:100px; }
#chess-status,#moodboard-status { min-height:24px; margin:16px 0; }
#chess-boards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.chess-board-head { display:flex; justify-content:space-between; align-items:center; min-height:44px; }
.chess-grid { display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); aspect-ratio:1; width:100%; border:2px solid #88918b; }
.chess-grid .chess-square { position:relative; border:0; border-radius:0; padding:0; min-width:0; aspect-ratio:1; background:#bec9c2; color:#15221c; }
.chess-grid .chess-square.dark { background:#334e43; color:#e7eee8; }
.chess-grid .chess-square.selected { box-shadow:inset 0 0 0 3px #df9f4b; }
.chess-grid .chess-square.legal::after { content:''; position:absolute; inset:40%; border-radius:50%; background:#dd7c55; pointer-events:none; }
.chess-piece { display:block; position:absolute; inset:4%; background-image:url('assets/enchanted-chess.webp'); background-size:300% 400%; background-repeat:no-repeat; pointer-events:none; }
.square-label { position:absolute; left:3px; bottom:2px; font-size:9px; z-index:1; }
.chess-bank { display:flex; align-items:center; flex-wrap:wrap; gap:5px; min-height:62px; padding:8px 0; }
.chess-bank strong { font-size:12px; width:70px; }
.chess-bank button { position:relative; width:43px; height:48px; padding:0; }
.chess-bank .chess-piece { inset:0 8px 8px 0; }
.chess-bank small { position:absolute; bottom:1px; right:3px; }
.chess-clock { font-variant-numeric:tabular-nums; font-size:13px; }
#chess-seats { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; }
.chess-share input { flex:1; min-width:150px; }
#chess-history { font:13px/1.8 monospace; margin:16px 0; overflow-wrap:anywhere; }
.chess-rules { max-width:850px; font-size:13px; line-height:1.7; }
#moodboard-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.mood-item { border:1px solid #59635d; border-radius:4px; padding:12px; }
.mood-item img { width:100%; aspect-ratio:4/3; object-fit:cover; }
.mood-item h4 { margin:10px 0; overflow-wrap:anywhere; }
.mood-item p { font-size:13px; overflow-wrap:anywhere; }
#brief-output label { display:flex; align-items:center; margin:12px 0; font-size:15px; }
.lodge-experiment .studio-grain { opacity:.075; }
.chess-lab { padding:24px 0; border-top:1px solid #ffffff26; }
.chess-lab[hidden] { display:none; }
.chess-controls { display:flex; align-items:end; gap:12px; flex-wrap:wrap; }
.chess-lab button,.chess-lab input,.chess-lab select { font:inherit; color:inherit; background:#1c2422; border:1px solid #6c7771; padding:10px; border-radius:4px; max-width:100%; }
.chess-lab button { cursor:pointer; }
.chess-lab button:disabled { opacity:.45; cursor:default; }
.chess-lab label { display:grid; gap:6px; font-size:13px; }
.chess-lab button:focus-visible { outline:2px solid #e6bd75; outline-offset:2px; }
#chess-code { width:130px; }
@media(max-width:720px) { #chess-boards { grid-template-columns:1fr; } .creative-tool form { grid-template-columns:1fr; } #moodboard-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .creative-tool { padding:16px 0; } }
@media(prefers-reduced-motion:reduce) { .lodge-experiment .studio-grain { opacity:.045; } }