[hidden]{display:none!important}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{color:#1a1a1a;background:#f8f7f4;font-family:system-ui,-apple-system,sans-serif;font-size:16px;line-height:1.5}body{flex-direction:column;align-items:center;gap:1.5rem;min-height:100dvh;padding:.75rem 0 4rem;display:flex}header{border-bottom:1px solid #ddd;align-items:center;gap:.75rem;width:100%;padding:0 1rem .75rem;display:flex}main{flex-direction:column;gap:1.25rem;width:100%;max-width:640px;display:flex}.wordmark{letter-spacing:-.03em;color:#1a1a1a;flex-shrink:0;align-items:center;gap:.5rem;font-size:1.25rem;font-weight:700;text-decoration:none;display:flex}.wordmark img{width:18px;height:18px}.wordmark:hover{color:#2e7d32}.tagline{color:#888;font-size:.8rem}.github-link{color:#999;flex-shrink:0;align-items:center;margin-left:auto;display:flex}.github-link:hover{color:#1a1a1a}.github-link svg{fill:currentColor;width:18px;height:18px}#status{color:#666}#sharing{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.share-link{text-overflow:ellipsis;white-space:nowrap;color:#1976d2;flex:1;min-width:0;font-family:ui-monospace,Cascadia Code,Source Code Pro,monospace;font-size:.78rem;overflow:hidden}button{cursor:pointer;font:inherit;border:none;border-radius:6px;transition:background .15s,opacity .15s}#download-btn{color:#fff;background:#2e7d32;padding:.55rem 1.4rem;font-size:.95rem;font-weight:600}#download-btn:hover{background:#1b5e20}#sgf-panel{background:#fff;border:1px solid #ddd;border-radius:8px;overflow:hidden}#sgf-panel>summary{color:#555;cursor:pointer;-webkit-user-select:none;user-select:none;padding:.65rem 1rem;font-size:.875rem;font-weight:600}#sgf-panel>summary:hover{color:#1a1a1a}#sgf-panel[open]>summary{border-bottom:1px solid #ddd}#drop-zone{background:#fff;flex-direction:column;gap:1rem;padding:1.25rem;transition:background .15s;display:flex}#drop-zone.dragover{background:#f0f7f1}#sgf-input{color:#1a1a1a;resize:vertical;background:#fafaf8;border:1px solid #ddd;border-radius:5px;outline:none;width:100%;height:180px;padding:.6rem .75rem;font-family:ui-monospace,Cascadia Code,Source Code Pro,monospace;font-size:.82rem;line-height:1.5;transition:border-color .15s}#sgf-input:focus{border-color:#2e7d32}.drop-hint{color:#999;text-align:center;font-size:.8rem}.file-label{color:#444;cursor:pointer;background:#f0f0ee;border:1px solid #ccc;border-radius:5px;align-self:center;padding:.4rem 1rem;font-size:.875rem;font-weight:500;transition:background .15s;display:inline-block}.file-label:hover{background:#e4e4e2}.file-label input[type=file]{display:none}.game-info{background:#fff;border:1px solid #e0e0e0;border-radius:6px;flex-direction:column;gap:.2rem;padding:.75rem 1rem;font-size:.9rem;display:flex}#construct-entry,#construct-toolbar{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}#construct-btn,#photo-btn,#construct-clear{color:#444;background:#f0f0ee;border:1px solid #ccc;border-radius:5px;padding:.4rem 1rem;font-size:.875rem;font-weight:500}#construct-btn:hover,#photo-btn:hover,#construct-clear:hover{background:#e4e4e2}#construct-close{color:#888;text-underline-offset:2px;background:0 0;border:none;border-radius:0;padding:.4rem .5rem;font-size:.875rem;text-decoration:underline}#construct-close:hover{color:#1a1a1a}.color-btn{color:#444;background:#f0f0ee;border:1px solid #ccc;border-radius:5px;padding:.4rem 1rem;font-size:.875rem;font-weight:500}.color-btn:hover{background:#e4e4e2}.color-btn.active{color:#fff;background:#2e7d32;border-color:#2e7d32}#copy-btn,#qr-btn,#download-btn{align-items:center;gap:.35em;display:inline-flex}#copy-btn,#qr-btn{color:#444;background:#f0f0ee;border:1px solid #ccc;border-radius:5px;padding:.4rem .8rem;font-size:.875rem;font-weight:500}#copy-btn:hover,#qr-btn:hover{background:#e4e4e2;border-color:#bbb}#qr-modal{z-index:100;background:#00000073;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#qr-modal-content{background:#fff;border-radius:12px;padding:1.75rem;position:relative;box-shadow:0 8px 40px #00000040}#qr-display{width:200px}#qr-display svg{width:100%;height:auto;display:block}#qr-close{color:#999;background:0 0;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;padding:0;display:flex;position:absolute;top:.4rem;right:.4rem}#qr-close:hover{color:#1a1a1a;background:#f0f0ee}#photo-modal{z-index:100;background:#0000008c;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}#photo-modal-content{background:#fff;border-radius:12px;flex-direction:column;gap:1rem;width:100%;max-width:960px;max-height:90vh;padding:1.5rem;display:flex;overflow-y:auto;box-shadow:0 8px 40px #00000040}#photo-modal-header{flex-direction:column;gap:.5rem;display:flex}#photo-dims-row{color:#555;align-items:center;gap:.5rem;font-size:.875rem;display:flex}#photo-dims-row label{align-items:center;gap:.35rem;display:flex}#photo-dims-row input[type=number]{width:4rem;font:inherit;text-align:center;border:1px solid #ccc;border-radius:5px;outline:none;padding:.3rem .5rem;font-size:.875rem}#photo-dims-row input[type=number]:focus{border-color:#2e7d32}#photo-edges-row{gap:.35rem;font-size:.8rem;display:flex}.edge-toggle{cursor:pointer;font:inherit;color:#555;background:#f5f5f5;border:1px solid #ccc;border-radius:4px;padding:.2rem .5rem;font-size:.8rem}.edge-toggle.elided{color:#e65100;background:#fff3e0;border-color:#e65100}#photo-status{color:#666;font-size:.875rem}#photo-modal-body{align-items:flex-start;gap:1.25rem;display:flex}.photo-modal-photo{flex:1;min-width:0}#photo-preview{border-radius:4px;max-width:100%;display:block}.photo-modal-board{flex:1;min-width:0}#photo-modal-footer{align-items:center;gap:.5rem;display:flex}#photo-accept-btn{color:#fff;background:#2e7d32;border:1px solid #2e7d32;border-radius:5px;padding:.4rem 1rem;font-size:.875rem;font-weight:500}#photo-accept-btn:hover{background:#1b5e20}#photo-cancel-btn{color:#888;text-underline-offset:2px;background:0 0;border:none;padding:.4rem .5rem;font-size:.875rem;text-decoration:underline}#photo-cancel-btn:hover{color:#1a1a1a}#photo-adjust-btn{color:#444;background:#f0f0ee;border:1px solid #ccc;border-radius:5px;padding:.4rem 1rem;font-size:.875rem;font-weight:500}#photo-adjust-btn:hover{background:#e4e4e2}#photo-preview.adjust-grid{cursor:crosshair}@media (width<=560px){#photo-modal-body{flex-direction:column}}.error{color:#b71c1c;background:#fff5f5;border:1px solid #ffcdd2;border-radius:5px;padding:.6rem .9rem;font-size:.875rem}
