html{overflow-y:scroll}.cp{display:grid;grid-template-columns:1fr 1fr;min-height:100vh;color:#1d1d1b}.cp .displays{background:#ededed;padding:16px;position:sticky;top:0;height:100vh;box-sizing:border-box;overflow:auto}.cp .controls{background:#fff;padding:16px 20px;min-width:0}@media(max-width:1100px){.cp{grid-template-columns:1fr}.cp .displays{position:static;height:auto}}.cp header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:4px}.cp h1{font-size:20px;margin:0 0 12px;text-wrap:balance}.cp .ok{color:#2e7d32}.cp .bad{color:#c62828}.cp .muted{color:#666;font-size:13px}.previews{display:flex;flex-direction:column;gap:14px;margin:0 auto}@media(min-width:1101px){.previews{width:min(100%,calc((100vh - 32px - 3 * 22px - 2 * 14px - 12px) / 1.06))}}.previews .top{order:1}.previews .side{order:2}.previews .validator{order:3;width:28%;align-self:center}.previews figure{margin:0}.previews iframe{width:100%;border:0;box-shadow:0 0 0 1px #ccc;display:block;background:#fff}.previews .side iframe{aspect-ratio:878 / 240}.previews .top iframe{aspect-ratio:698 / 222}.previews .validator iframe{aspect-ratio:91 / 152}.previews figcaption{font-size:12px;color:#555;margin-top:4px}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px;align-items:start}@media(max-width:640px){.grid{grid-template-columns:minmax(0,1fr)}}fieldset{border:1px solid #ddd;border-radius:6px;padding:12px;display:flex;flex-direction:column;gap:8px;min-width:0}legend{font-weight:600;padding:0 4px}fieldset label{display:flex;flex-direction:column;gap:2px;font-size:13px}fieldset label.check{flex-direction:row;align-items:center;gap:6px}fieldset select,fieldset input,fieldset textarea{font:inherit;font-size:14px;padding:3px;width:100%;max-width:100%;box-sizing:border-box}fieldset .row select,fieldset label.check input{width:auto}.row{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:13px}.row.indent{margin-left:22px}button{font:inherit;font-size:13px;padding:4px 8px;cursor:pointer}button.link{border:0;background:none;padding:0;color:#0063af;text-decoration:underline;font-size:12px}.row.windows{margin:4px 0}.cp .spec{font-size:13px;display:flex;align-items:center;gap:6px;min-width:0;max-width:100%}.cp .spec select{font:inherit;padding:3px;min-width:0;max-width:100%}.cp p.bad{margin:0 0 8px;font-size:13px}.info{margin-top:12px}.info ul{margin:0;padding-left:20px;font-size:13px;line-height:1.5}.cp header .reset{flex:none}.cp header h1{min-width:0}.cp .note{margin:0 0 12px;padding:8px 12px;background:#fff8c4;border-left:4px solid #FFED00;font-size:14px}.cp textarea.autogrow{resize:none;overflow:hidden}