:root{font-family:Arial,sans-serif;color:#25463d;background:#e6e0d2;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,textarea{font:inherit}button{cursor:pointer;border:1px solid #b7b9a7;background:#f8f3e8;color:#25463d;border-radius:8px;padding:10px 13px;text-align:left;transition:background .18s,transform .18s}button:hover{background:#e4e9d9}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #a45a39;outline-offset:2px}button:disabled{opacity:.5}.app{min-height:100dvh;padding:28px;max-width:1800px;margin:auto}header{display:flex;justify-content:space-between;align-items:center;gap:30px;border-bottom:1px solid #b7b9a7;padding-bottom:25px}.eyebrow{font-size:10px;letter-spacing:3px}h1{font-family:Georgia,serif;font-size:48px;line-height:.95;margin:14px 0 0;font-weight:400}h1 em{color:#a85f41}h2{font-size:12px;text-transform:uppercase;letter-spacing:2px;margin:24px 0 12px}.intro{max-width:330px;font-family:Georgia,serif;font-size:23px}.intro small{font-family:Arial,sans-serif;font-size:13px;line-height:1.7;display:block;margin-top:12px}main{display:grid;grid-template-columns:235px minmax(350px,1fr) 235px;gap:24px;margin-top:24px}aside{font-size:12px;line-height:1.6}aside>button{width:100%;margin:4px 0}.modes{display:grid;grid-template-columns:1fr 1fr;gap:5px}.selected,.primary{background:#254e43;color:#fff}.studio{background:#f7f0e2;border-radius:16px;border:1px solid #d0c8b8;padding:20px;align-self:start;box-shadow:0 12px 32px #4d584314}.studio-head{display:flex;justify-content:space-between;font-size:11px;gap:15px;margin-bottom:18px}.studio-head span:last-child{font-size:9px;letter-spacing:1px}.board{position:relative;width:100%;aspect-ratio:12/10;background:radial-gradient(#d4c9b5 .6px,transparent .6px);background-size:8px 8px}.threads{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.grid{position:absolute;inset:0;display:grid;grid-template-columns:repeat(12,1fr);grid-template-rows:repeat(10,1fr)}.grid button{background:none;border:none;padding:4px;display:grid;place-items:center;border-radius:50%}.grid button span{width:75%;height:75%;border-radius:50%;display:grid;place-items:center;max-width:30px;max-height:30px}.grid .bead span{border:1px solid #5b6650;box-shadow:inset -3px -3px 4px #0002,inset 2px 2px 3px #fff6}.grid .bead i{display:block;width:4px;height:4px;border-radius:50%;background:#f6efde;box-shadow:0 0 0 1px #635b4866}.grid .anchor span{outline:2px solid #ad792f;outline-offset:3px}.grid button:hover{background:#d5b99e44;transform:scale(1.08)}.grid .empty{color:#aaa08d}.metrics{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #d1c9b8;margin-top:15px;padding-top:16px}.metrics strong{display:block;font-family:Georgia,serif;font-size:29px;font-weight:400}.metrics span{font-size:10px}.status{background:#e7ebdd;border-radius:7px;padding:12px;font-size:12px;line-height:1.6}.small{font-size:11px;line-height:1.6;color:#637568}label{display:block;font-size:11px;margin:12px 0}input{display:block;width:100%;padding:9px;border:1px solid #b8b8a6;border-radius:6px;background:#fbf6eb;color:inherit}input[type=color]{height:40px;padding:4px}.ledger,.source{margin-top:22px;padding:20px;background:#f5efe2;border-radius:12px;font-size:12px;overflow-wrap:anywhere}.ledger p{line-height:1.7}textarea{width:100%;height:220px;background:#fffaf0;border:1px solid #b7b9a7;border-radius:8px;color:#304c43;padding:14px;font-family:monospace;font-size:12px}.row{display:flex;gap:8px;margin-top:10px}footer{font-size:11px;line-height:1.6;margin-top:24px;max-width:1000px}footer button{margin-right:8px}footer span{margin-left:10px}.focus main{display:block}.focus aside,.focus .source,.focus .ledger,.focus footer,.focus .intro{display:none}.focus .studio{max-width:850px;margin:auto}.focus header{padding-bottom:15px}.focus h1{font-size:28px}.focus .board{max-height:65dvh}@media(max-width:1100px){main{grid-template-columns:190px minmax(300px,1fr)}main>aside:last-child{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}main>aside:last-child h2,main>aside:last-child p{grid-column:1/-1}.intro{display:none}}@media(max-width:650px){.app{padding:14px}header{gap:15px}h1{font-size:35px}main{display:flex;flex-direction:column}.studio{order:-1;padding:12px;width:100%}main>aside:last-child{display:block}.metrics strong{font-size:24px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}}