:root{font-family:Georgia,serif;color:#4e3b35;background:#eee5db}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 85% 0,#f6d9cf66,transparent 65%)}main{max-width:1050px;margin:auto;padding:36px 24px}header{margin-bottom:25px}.eyebrow{font:11px system-ui;letter-spacing:3px;color:#8c7367}h1{font-size:54px;line-height:1.05;margin:12px 0}h1 span{font-size:23px;font-weight:normal;margin-left:20px;color:#a16f60}p{line-height:1.6}.bar{display:flex;justify-content:space-between;align-items:center;margin:20px 0;font:14px system-ui}button,select{font:14px system-ui;color:inherit;background:#fffaf1;border:1px solid #ccb5a5;border-radius:9px;padding:10px;cursor:pointer}button:hover{background:#f1e2d4}button:focus-visible,select:focus-visible{outline:3px solid #538d83;outline-offset:3px}.layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(250px,1fr);gap:24px}.tray,aside,details{background:#fffaf1;border:1px solid #d7c3b2;border-radius:22px;padding:24px;box-shadow:0 14px 30px #836e4f10}#palette{display:flex;gap:6px;margin-bottom:20px;flex-wrap:wrap}#palette [aria-pressed=true]{background:#75554a;color:#fffaf1;border-color:#75554a}#grid{display:grid;gap:5px;max-width:550px;margin:auto;padding:8px;border:1px solid #c9b6a1;border-radius:13px;background:#d9c5ad}.cell{position:relative;aspect-ratio:1;border:1px solid #ddcdbb;background:#f7eddf;border-radius:7px;padding:0;overflow:hidden;min-width:0;isolation:isolate}.cell img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}.cell.shade{background:#dcc8b7}.cell.clue{background:#f9f0dd}.cell.clue span{position:absolute;left:43%;top:47%;transform:translate(-50%,-50%);font:bold clamp(16px,2.2vw,28px) system-ui;color:#fff9d9;text-shadow:0 1px 4px #20100d,0 0 3px #20100d;z-index:2}.cell.empty:after{content:'·';font:bold 35px Georgia;color:#9c8876}.cell.selected{outline:3px solid #4e857a;outline-offset:0;z-index:3}.cell.attached{box-shadow:inset 0 0 0 4px #d49b40}.cell.attached:after{content:'';position:absolute;inset:0;border:4px solid #d49b40;border-radius:6px;pointer-events:none}.cell.bad{outline:3px solid #bd5d52;outline-offset:-3px}.cell.good{border:3px solid #7a9b7b}#status{font:15px/1.5 system-ui;min-height:70px;padding:18px 0 10px}.actions{display:flex;gap:8px;flex-wrap:wrap}.keys{font:12px/1.6 system-ui;color:#8a766a}aside h2{font-size:24px;margin-top:0}#inspector{font:16px/1.7 system-ui;min-height:150px;padding:18px;background:#f1e6d7;border-radius:14px}#inspector strong{display:block;font:32px Georgia;margin-bottom:10px}.rule-card{padding:18px 0;border-bottom:1px solid #e2d4c6}.rule-card p,.legend{font:14px/1.7 system-ui}.swatch{display:inline-block;width:14px;height:14px;border:3px solid #d49b40;border-radius:4px;vertical-align:middle}details{margin-top:22px;line-height:1.7}summary{cursor:pointer;font-weight:bold}li{margin:8px 0}footer{margin-top:25px;font:12px/1.7 system-ui;color:#85766b}a{color:#47776b}@media(max-width:650px){main{padding:22px 12px}h1{font-size:43px}h1 span{display:block;margin:8px 0;font-size:23px}.layout{grid-template-columns:1fr;gap:16px}.tray,aside,details{padding:14px}#grid{gap:4px;padding:6px}.cell.clue span{font-size:19px}#palette button{font-size:12px;padding:9px}#inspector{min-height:110px}#status{min-height:75px}}
