:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#203e3c;background:#f5f1e9;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer;border:1px solid #b7bdb0;background:#fcfaf5;color:#294745;border-radius:6px;padding:.65rem .8rem}button:hover{border-color:#264d48;background:#e7ece3}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #bc613e;outline-offset:3px}button[aria-pressed=true]{background:#28514b;color:#fff}button:disabled{opacity:.45;cursor:not-allowed}input,select,textarea{width:100%;border:1px solid #b7bdb0;border-radius:5px;padding:.65rem;background:#fffef9;color:#203e3c}label{display:block;font-size:.84rem;margin:.8rem 0}label input,label textarea{margin-top:.4rem}.app{max-width:1500px;margin:auto;padding:36px 5vw;background:#f5f1e9;min-height:100vh}.app:fullscreen{overflow:auto;max-width:none}header{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}small{letter-spacing:.08em}h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(2.5rem,5vw,4.6rem);line-height:1.04;margin:15px 0}h1 em{color:#a95c42;font-weight:400}h2{font-size:1rem;font-weight:600;margin:1.7rem 0 .9rem}h3{font:1.15rem Georgia,serif;overflow-wrap:anywhere}p{line-height:1.5;font-size:.86rem}header p{font-size:1.1rem}.note{border-block:1px solid #d7d6c8;padding:16px 0;font-size:.83rem;margin:25px 0}main{display:grid;grid-template-columns:290px minmax(0,1fr);gap:5vw}.row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.row label{flex:1;min-width:100px}aside{padding-right:18px}.studio{background:#eae8dd;padding:24px;border-radius:12px}.studio-title{display:flex;justify-content:space-between;align-items:center;gap:10px;overflow-wrap:anywhere}.studio-title h2{margin:0 0 18px}.studio-title span{font-size:.8rem}.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:3px;max-width:570px;margin:auto}.grid button{aspect-ratio:1;padding:0;border-radius:3px;font-size:9px;min-width:0}.grid .outside{background:#e8e4da;color:#847e70;border:1px dashed #d2cbbc}.grid .inside{background:#f9f7ee}.grid .filled{background:#29554e;color:#edf3e8}.legend{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;font-size:.7rem;margin:16px 0}.status{background:#fffdf7;border-left:3px solid #ac6445;padding:14px;font-size:.85rem;min-height:48px}.family{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.family article{text-align:center;min-width:0}.family svg{width:100%;max-width:180px}.files{border-top:1px solid #b7bdb0;margin-top:36px}textarea{font-family:ui-monospace,monospace}footer{max-width:850px;font-size:.8rem;margin-top:40px;color:#5b6962}@media(max-width:780px){.app{padding:22px 5vw}main{grid-template-columns:1fr}.studio{padding:14px}aside{padding:0}.family{gap:9px}.grid button{font-size:8px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}@media print{header button,aside,.files,footer,.note,.grid,.legend,.status{display:none}main{display:block}.app{padding:0}.studio{background:#fff}.family{grid-template-columns:repeat(3,1fr)}}