:root{font-family:Arial,'Hiragino Kaku Gothic ProN',Meiryo,sans-serif;color:#26342d;background:#eeeee8}
*{box-sizing:border-box}
body{margin:0;height:100dvh;display:flex;flex-direction:column}
button,a{font:inherit}
.toolbar{display:flex;align-items:center;gap:20px;flex-wrap:wrap;padding:13px 24px;background:#fff;border-bottom:1px solid #d7dcd4}
.heading{margin-right:auto}.eyebrow{font-size:9px;letter-spacing:.13em;color:#66756b}.heading h1{font-size:19px;line-height:1.3;margin:3px 0 0}
.view-controls{display:flex;gap:4px;padding:4px;background:#edf0eb;border-radius:999px}.view-controls button{border:0;border-radius:999px;padding:10px 17px;min-height:40px;background:transparent;color:#31443a;cursor:pointer;font-size:13px;font-weight:700;white-space:nowrap}.view-controls button[aria-pressed=true]{background:#244d3b;color:#fff;box-shadow:0 2px 6px #0002}.view-controls button:focus-visible,.preview-heading a:focus-visible{outline:2px solid #244d3b;outline-offset:2px}
.hint{margin:0;font-size:11px;color:#66756b}
.previews{display:grid;grid-template-columns:1fr;gap:12px;min-height:0;flex:1;padding:12px}.previews[data-view=both]{grid-template-columns:repeat(2,minmax(0,1fr))}.preview{display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden;background:#fff;border:1px solid #d7dcd4;border-radius:12px;box-shadow:0 5px 20px #1a34200a}.preview[hidden]{display:none}.preview-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:45px;padding:7px 14px;border-bottom:1px solid #e6e9e3}.preview-heading>div{display:flex;align-items:baseline;gap:10px;min-width:0}.preview-heading strong{font-size:12px;white-space:nowrap}.preview-heading span{font-size:10px;color:#657469;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.preview-heading a{font-size:11px;color:#244d3b;font-weight:700;white-space:nowrap;text-decoration:none}.preview-heading a:hover{text-decoration:underline}.preview iframe{display:block;width:100%;height:100%;min-height:0;flex:1;border:0;background:#fff}
@media(max-width:700px){.toolbar{padding:10px 12px;gap:9px}.heading{width:100%}.heading h1{font-size:16px}.view-controls{width:100%}.view-controls button{flex:1;padding:8px 5px;font-size:12px}.hint{display:none}.previews{padding:8px;gap:8px}.previews[data-view=both]{grid-template-columns:1fr;grid-template-rows:repeat(2,minmax(0,1fr))}.preview-heading{min-height:38px}.preview-heading span{display:none}}