:root{font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;color:#173a31;background:#f7f5ef;font-synthesis:none}*{box-sizing:border-box}body{margin:0}.shell{width:min(100%,760px);margin:auto;padding:0 18px 38px}.top{height:70px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dce5de}.brand{display:flex;gap:10px;align-items:center;font-size:15px;font-weight:800;letter-spacing:.02em}.brand-mark{display:grid;place-items:center;width:35px;height:35px;border-radius:10px;background:#114b3b;color:#fff;font-size:11px;letter-spacing:-.04em}.brand-mark span{font-size:9px}.tag{border:1px solid #bed2c7;border-radius:100px;padding:5px 10px;color:#497464;font-size:11px}.intro{padding:36px 4px 28px}.eyebrow{font-size:11px;font-weight:800;letter-spacing:.15em;color:#5b9275}.intro h1{font-size:clamp(34px,8vw,54px);line-height:1.14;letter-spacing:-.055em;margin:11px 0 13px;color:#113c30}.intro h1 em{font-style:normal;color:#2b9561}.intro p{margin:0;color:#61746c;font-size:14px;line-height:1.65}.upload-card,.workspace{background:#fff;border:1px solid #e0e9e0;border-radius:22px;box-shadow:0 14px 42px rgba(19,70,48,.055)}.upload-card{padding:15px}.upload{display:flex;align-items:center;gap:13px;min-height:82px;border:1.5px dashed #8fbd9f;background:#f5faf4;border-radius:16px;padding:16px;cursor:pointer}.upload:active{background:#eaf6eb}.upload-icon{width:42px;height:42px;border-radius:13px;background:#dbefe2;color:#218255;display:grid;place-items:center;font-size:28px;font-weight:300;flex:none}.upload strong{display:block;font-size:15px}.upload small{display:block;color:#748a7d;font-size:11px;margin-top:4px}input[type=file]{position:absolute;width:1px;height:1px;opacity:0}.image-wrap{position:relative;max-height:250px;overflow:hidden;background:#edf3ef;border-radius:14px;margin-top:14px;text-align:center}.image-wrap img{display:block;max-width:100%;max-height:250px;margin:auto}.image-wrap #crop-label{position:absolute;bottom:9px;left:9px;background:#0b533ddc;color:#fff;border-radius:7px;padding:5px 8px;font-size:11px}.status{font-size:12px;color:#668175;margin:10px 4px 0;min-height:18px}.status.error{color:#bb4c35}.workspace{margin-top:18px;padding:20px 15px 17px}.section-head{display:flex;align-items:center;justify-content:space-between;padding:0 3px}.section-head h2{margin:4px 0 14px;font-size:22px;letter-spacing:-.03em}.text-button{border:0;background:none;color:#557968;text-decoration:underline;font-size:12px;padding:8px;cursor:pointer}.rule-list{display:flex;gap:7px;flex-wrap:wrap}.rule-chip{border:1px solid #d6e1d8;background:#fff;color:#557466;border-radius:10px;padding:8px 11px;font-size:12px;font-weight:700;cursor:pointer}.rule-chip.active{background:#164f3a;border-color:#164f3a;color:#fff}.helper{font-size:11px;color:#7b8e83;line-height:1.5;margin:9px 2px 14px}.board-wrap{max-width:560px;margin:16px auto 18px}.board{display:grid;grid-template-columns:repeat(9,1fr);aspect-ratio:1/1;border:3px solid #146e47;background:#e7eee9;box-shadow:0 8px 24px rgba(23,80,50,.08);touch-action:manipulation}.cell{position:relative;border:0;border-right:1px solid #b5d0bd;border-bottom:1px solid #b5d0bd;border-radius:0;background:#fff;color:#15392e;font-size:clamp(18px,5vw,30px);font-weight:550;padding:0;display:grid;place-items:center;cursor:pointer;min-width:0;min-height:0}.cell.box-r{border-right:2px solid #26784e}.cell.box-b{border-bottom:2px solid #26784e}.cell:nth-child(9n){border-right:0}.cell:nth-child(n+73){border-bottom:0}.cell.given{font-weight:750}.cell.answer{color:#2a9961}.cell.uncertain:before{content:"";position:absolute;inset:3px;border:1px dashed #e9a563;pointer-events:none}.cell.parity-odd:after{content:"";position:absolute;inset:12%;border:2px solid #8bbcf0;border-radius:50%;pointer-events:none}.cell.parity-even:after{content:"";position:absolute;inset:12%;border:2px solid #edb074;pointer-events:none}.cell.selected{background:#e7f5e9}.cell.cage-picked{background:#e1f1e1}.cell.cage-outline{box-shadow:inset 0 0 0 2px #f2b257}.cell .cage-label{position:absolute;top:2px;left:3px;font-size:9px;font-weight:800;color:#8b6942;line-height:1}.cell .link-right,.cell .link-bottom{position:absolute;background:#d7853d;z-index:2;border-radius:3px}.cell .link-right{right:-3px;width:6px;height:16px;top:calc(50% - 8px)}.cell .link-bottom{bottom:-3px;height:6px;width:16px;left:calc(50% - 8px)}.editor{border-top:1px solid #ebf0eb;padding-top:15px}.editor-top{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;font-weight:750}.segmented{background:#f0f5f0;border-radius:10px;padding:3px;display:flex;gap:2px}.segmented button{border:0;background:transparent;border-radius:8px;padding:7px 8px;color:#668070;font-size:11px;font-weight:700;cursor:pointer}.segmented button.active{background:#fff;color:#12553a;box-shadow:0 2px 6px #173c241f}.numpad{display:grid;grid-template-columns:repeat(10,1fr);gap:5px}.numpad button{aspect-ratio:1/1;border:1px solid #dae9dd;background:#f6faf6;border-radius:9px;color:#176943;font-size:17px;font-weight:750;cursor:pointer}.numpad button:last-child{font-size:13px;color:#777}.cage-tools{display:flex;gap:6px}.cage-tools input{width:110px;border:1px solid #d4e0d7;border-radius:8px;padding:9px;font-size:14px}.cage-tools button{border:0;background:#e4f1e7;color:#165d3c;border-radius:8px;padding:8px;font-size:12px;font-weight:750}.cage-tools .quiet{background:#f3f3ef;color:#6b776e}.solve-button{width:100%;border:0;border-radius:13px;background:#0f6a45;color:white;padding:16px 17px;margin-top:18px;text-align:left;font-size:15px;font-weight:800;display:flex;justify-content:space-between;cursor:pointer;box-shadow:0 6px 16px #1a764e30}.solve-button:active{transform:translateY(1px)}.result{margin-top:12px;border-radius:11px;background:#edf7ef;color:#1e6642;padding:12px 14px;font-size:12px;line-height:1.6}.result.error{background:#fff1eb;color:#a94d37}.hidden{display:none!important}footer{text-align:center;color:#8a9b90;font-size:11px;line-height:1.6;padding:20px 8px}@media(min-width:700px){.shell{padding:0 30px 40px}.workspace{padding:25px 28px}.intro{padding-top:48px}.cell{font-size:30px}.numpad{gap:8px}}
.board-photo-wrap{margin:14px auto 0;max-width:560px}.board-photo-wrap .eyebrow{margin:0 0 8px 2px}.board-photo-wrap canvas{display:block;width:100%;height:auto;aspect-ratio:1/1;border-radius:10px;border:1px solid #d5e2d9}
@media(max-width:520px){.numpad{grid-template-columns:repeat(5,minmax(0,1fr))}.numpad button{width:100%;min-width:0;min-height:0;height:44px;aspect-ratio:auto}}