.cjb-rosetas{font:15px/1.5 Arial,sans-serif;color:#30302e;background:#fff;color-scheme:light}.cjb-rosetas *{box-sizing:border-box}.cjb-rosetas header{padding:20px 24px;background:#30302e;color:#e8d8c3;border-bottom:4px solid #d54120}.cjb-rosetas header small{letter-spacing:1.5px;font-size:11px}.cjb-rosetas h2{font:normal 29px Georgia,serif;margin:6px 0}.cjb-rosetas h3{font:normal 22px Georgia,serif;margin:0 0 12px}.cjb-rosetas main{padding:24px}.cjb-rosetas .global{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:24px}.cjb-rosetas .panels{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:26px}.cjb-rosetas .fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:12px 0 16px}.cjb-rosetas label{display:block;font-size:13px}.cjb-rosetas input,.cjb-rosetas select{font:16px Arial;width:100%;padding:9px 8px;border:1px solid #b8afa4;border-radius:3px;background:#fff;color:#30302e;margin-top:5px;min-width:0;min-height:40px}.cjb-rosetas input:invalid{border-color:#b22d15}.cjb-rosetas input[type=range]{padding:0;border:0;accent-color:#865738}.cjb-rosetas button{font:14px Arial;border:1px solid #c6bcae;background:#fff;color:#30302e;padding:9px 11px;border-radius:3px;min-height:40px}.cjb-rosetas button[aria-pressed=true],.cjb-rosetas .primary{background:#30302e;color:#f4e5d2;border-color:#30302e}.cjb-rosetas button:disabled{opacity:.4}.cjb-rosetas .palette{display:flex;gap:7px;flex-wrap:wrap;margin:10px 0 15px}.cjb-rosetas .swatch{display:inline-block;width:14px;height:14px;border:1px solid #918575;vertical-align:middle;margin-right:5px}.cjb-rosetas input[type=color]{padding:3px;max-width:80px;margin:0;height:40px}.cjb-rosetas .custom{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.cjb-rosetas .grid{display:grid;gap:1px;background:#a99c89;padding:1px;width:100%;max-width:410px;touch-action:none}.cjb-rosetas .pixel{padding:0;min-height:0;aspect-ratio:1;border:0;border-radius:0;position:relative}.cjb-rosetas .pixel:focus-visible{outline:3px solid #d54120;z-index:1}.cjb-rosetas .note{font-size:12px;color:#665b4d;margin:10px 0}.cjb-rosetas .tools{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:12px 0}.cjb-rosetas canvas{display:block;width:100%;height:auto;background:#ead5b3}.cjb-rosetas .circle{aspect-ratio:1}.cjb-rosetas .strip{height:128px;aspect-ratio:auto;margin-top:12px}.cjb-rosetas .zoom{height:220px;aspect-ratio:auto}.cjb-rosetas .summary{font-size:14px;margin:12px 0}.cjb-rosetas .layer{display:grid;grid-template-columns:minmax(0,1fr) repeat(4,34px);gap:4px;margin-bottom:6px}.cjb-rosetas .layer button{padding:7px 0;min-height:36px}.cjb-rosetas .layer .choose{text-align:left;padding:7px 10px;min-width:0;overflow-wrap:anywhere}.cjb-rosetas .dim{display:block;font-size:11px;opacity:.8}.cjb-rosetas .edit{border-top:1px solid #e4dbce;margin-top:25px;padding-top:22px}.cjb-rosetas .entry{display:grid;grid-template-columns:minmax(0,1fr) 80px 65px 35px;gap:7px;align-items:end;margin:8px 0}.cjb-rosetas .entry.sequence{grid-template-columns:minmax(0,1fr) 110px 35px}.cjb-rosetas .entry button{padding:8px 0}.cjb-rosetas .paneltitle{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}.cjb-rosetas details{margin-top:22px;border-top:1px solid #e4dbce;padding-top:16px}.cjb-rosetas summary{font-family:Georgia,serif;font-size:20px;min-height:40px}.cjb-rosetas table{width:100%;border-collapse:collapse;font-size:13px}.cjb-rosetas td,.cjb-rosetas th{text-align:left;padding:9px 6px;border-bottom:1px solid #e4dbce;overflow-wrap:anywhere;font-weight:normal}.cjb-rosetas th{background:#f5f0e8}.cjb-rosetas .error{color:#a02413;margin:10px 0}.cjb-rosetas footer{padding:16px 24px;background:#f5f0e8;color:#605549;font-size:12px}.cjb-rosetas [hidden]{display:none!important}@media(max-width:680px){.cjb-rosetas .panels{grid-template-columns:1fr}.cjb-rosetas main{padding:16px}.cjb-rosetas .global{grid-template-columns:1fr}.cjb-rosetas h2{font-size:25px}.cjb-rosetas .layer{grid-template-columns:minmax(0,1fr) repeat(4,30px)}.cjb-rosetas .entry{grid-template-columns:minmax(0,1fr) 64px 49px 30px;gap:5px}.cjb-rosetas .entry.sequence{grid-template-columns:minmax(0,1fr) 90px 30px}}@media(pointer:coarse){.cjb-rosetas .layer button{min-height:44px}}
.cjb-rosetas .layer{grid-template-columns:22px 22px minmax(0,1fr) repeat(4,28px);gap:4px;align-items:center;padding:3px 0}.cjb-rosetas .layer input[type=checkbox]{width:18px;height:18px;min-height:0;margin:0;padding:0;accent-color:#865738}.cjb-rosetas .layer .grip{font-size:18px;touch-action:none;user-select:none}.cjb-rosetas .layer .choose .dim{white-space:normal}.cjb-rosetas .layer.group-child{padding-left:10px;border-left:3px solid #c8b292}.cjb-rosetas .group-head{display:grid;grid-template-columns:22px minmax(0,1fr) repeat(4,28px);gap:4px;align-items:center;background:#ece3d6;padding:7px 5px;margin-top:10px;border-radius:3px}.cjb-rosetas .group-head button{padding:6px 2px;min-height:36px}.cjb-rosetas .group-head .group-title{text-align:left;padding:6px 8px}.cjb-rosetas .moved{background:#fff0cb;box-shadow:inset 0 0 0 2px #aa702b}.cjb-rosetas .dragging{opacity:.45}.cjb-rosetas .drop-before{box-shadow:0 -4px 0 #d54120}.cjb-rosetas .drop-after{box-shadow:0 4px 0 #d54120}.cjb-rosetas .group-tools{display:flex;gap:7px;flex-wrap:wrap;margin:12px 0}.cjb-rosetas .group-tools button{font-size:12px;padding:8px}.cjb-rosetas .move-status{font-size:12px;color:#725020;min-height:22px;margin:8px 0}.cjb-rosetas .color-name{font-size:12px}.cjb-rosetas .group-child .grip{opacity:.6}@media(max-width:680px){.cjb-rosetas .layer{grid-template-columns:18px 18px minmax(0,1fr) repeat(4,25px);gap:3px}.cjb-rosetas .group-head{grid-template-columns:18px minmax(0,1fr) repeat(4,25px);gap:3px}.cjb-rosetas .layer.group-child{padding-left:5px}}@media(pointer:coarse){.cjb-rosetas .group-head button,.cjb-rosetas .layer button{min-height:44px}}
.cjb-rosetas .symmetry-option{display:flex;align-items:center;gap:10px;min-height:44px;margin:12px 0;font-size:14px}.cjb-rosetas .symmetry-option input{width:18px;height:18px;min-height:0;margin:0;padding:0;accent-color:#865738}

.cjb-rosetas .tools>label{max-width:100%}.cjb-rosetas input[type=file]{max-width:100%}