@charset "UTF-8";
.mq-page { padding-top:54px; padding-bottom:70px; }
.mq-hero { display:grid; grid-template-columns:1.35fr 1fr; gap:40px; align-items:center; margin-bottom:32px; }
.mq-hero h1 { font-size:clamp(43px,5.6vw,75px); }
.mq-hero p { max-width:590px; }
.mq-emblem { display:grid; grid-template-columns:repeat(3,1fr); grid-template-rows:repeat(3,55px); gap:9px; padding:28px; border:1px solid var(--line); border-radius:24px; background:var(--soft); }
.mq-emblem i { border:1px solid var(--blue); border-radius:8px; background:var(--lavender); }
.mq-emblem i:first-child { grid-column:span 2; grid-row:span 2; }
.mq-storage { border:1px solid var(--line); background:var(--soft); border-radius:10px; padding:13px 17px; }
.mq-memory { border-color:var(--blue); }
.mq-status { min-height:26px; color:var(--ink); overflow-wrap:anywhere; }
.mq-actions { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:16px 0; }
.mq-actions .btn { white-space:normal; }
.mq-actions [aria-pressed=true] { outline:2px solid var(--blue); outline-offset:2px; }
.mq-collection { display:flex; flex-wrap:wrap; gap:10px; margin:24px 0; }
.mq-collection button { background:var(--surface); color:var(--ink); border:1px solid var(--line); border-radius:10px; padding:11px 16px; min-height:46px; text-align:left; overflow-wrap:anywhere; }
.mq-collection [aria-pressed=true] { border:2px solid var(--blue); }
.mq-main { border-top:1px solid var(--line); padding-top:24px; }
.mq-heading { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:10px; }
.mq-heading h2 { overflow-wrap:anywhere; margin-bottom:12px; }
.mq-draft-label { color:var(--blue); font-size:13px; }
.mq-intro { white-space:pre-wrap; overflow-wrap:anywhere; }
.mq-workspace { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:25px; align-items:start; }
.mq-inspector,.mq-metadata,.mq-add,.mq-source,.mq-about,.mq-empty { padding:20px; background:var(--surface); border:1px solid var(--line); border-radius:14px; min-width:0; }
.mq-metadata,.mq-add,.mq-source { margin:20px 0; }
.mq-metadata summary,.mq-add summary { font-weight:bold; font-size:18px; cursor:pointer; min-height:44px; line-height:1.5; }
.mq-about { margin-top:32px; padding:28px; }
.mq-about h2,.mq-empty h2,.mq-source h2 { font-size:27px; }
.mq-page input,.mq-page select,.mq-page textarea { width:100%; font-size:16px; }
.mq-page label { display:block; margin:12px 0; }
.mq-page label>input,.mq-page label>select,.mq-page label>textarea { display:block; margin-top:5px; }
.mq-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.mq-tile-list { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:18px; }
.mq-tile-list button { background:var(--surface); border:1px solid var(--line); border-radius:9px; padding:10px 13px; color:var(--ink); min-height:44px; text-align:left; overflow-wrap:anywhere; }
.mq-tile-list [aria-pressed=true] { border:2px solid var(--blue); }
.mq-inspector h2 { font-size:25px; }
.mq-field-error { color:var(--ink); overflow-wrap:anywhere; }
.mq-coordinate-hint { margin-top:20px; }
.mq-stage { position:relative; width:100%; aspect-ratio:4/3; background-color:var(--soft); background-image:linear-gradient(to right,var(--line) 1px,transparent 1px),linear-gradient(to bottom,var(--line) 1px,transparent 1px); background-size:calc(100% / 12) calc(100% / 12); border-radius:12px; box-shadow:0 0 0 1px var(--line); isolation:isolate; }
.mq-tile { position:absolute; border:3px solid var(--paper); background:var(--surface); overflow:hidden; border-radius:9px; }
.mq-tile[data-selected=true] { outline:2px solid var(--blue); outline-offset:-2px; }
.mq-picture { position:absolute; inset:0 0 25px; overflow:hidden; background:#11141c; }
.mq-picture svg { display:block; width:100%; height:100%; overflow:hidden; }
.mq-caption { position:absolute; bottom:0; left:0; right:0; height:25px; display:flex; align-items:center; gap:7px; padding:0 7px; color:var(--ink); background:var(--surface); }
.mq-caption span { color:var(--blue); font-size:10px; font-weight:bold; }
.mq-caption strong { font-size:11px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; }
.mq-hit { position:absolute; inset:0; width:100%; height:100%; min-height:0; border:0; background:transparent; border-radius:6px; padding:0; }
.mq-hit:focus-visible { outline-offset:-4px; }
.mq-stage[data-tool=move] .mq-hit { cursor:grab; touch-action:none; }
.mq-stage[data-tool=move] .mq-hit:active { cursor:grabbing; }
.mq-ghost { position:absolute; z-index:2; pointer-events:none; border:3px dashed var(--blue); border-radius:9px; background:var(--lavender); opacity:.75; }
.mq-unavailable { display:grid; place-items:center; padding:8px; text-align:center; background:var(--soft); color:var(--ink); font-size:11px; }
.mq-list { display:none; grid-template-columns:minmax(0,1fr); gap:16px; }
.mq-list-item { border:1px solid var(--line); border-radius:12px; padding:18px; background:var(--surface); min-width:0; }
.mq-list-item h3 { font-size:21px; overflow-wrap:anywhere; }
.mq-list-item .cx-frame { margin:15px auto; }
.mq-list-item p { overflow-wrap:anywhere; }
.mq-canvas[data-view=board] .mq-stage-wrap { display:block; }
.mq-canvas[data-view=board] .mq-list { display:none; }
.mq-canvas[data-view=list] .mq-stage-wrap { display:none; }
.mq-canvas[data-view=list] .mq-list { display:grid; }
.mq-presentation { max-width:920px; margin:26px auto 0; }
.mq-presentation header { text-align:center; }
.mq-presentation h2 { font-size:clamp(28px,4vw,45px); overflow-wrap:anywhere; }
.mq-presentation-context { font-size:13px; }
.mq-slide-frame { margin:24px 0; }
.mq-slide-question { max-width:720px; margin:20px auto; font-size:clamp(20px,3vw,28px); line-height:1.4; color:var(--ink); overflow-wrap:anywhere; }
.mq-slide-observation { max-width:720px; margin:20px auto; padding:18px; border:1px solid var(--line); border-radius:12px; background:var(--soft); }
.mq-slide-observation summary { cursor:pointer; font-weight:bold; min-height:36px; line-height:1.5; }
.mq-slide-observation p { white-space:pre-wrap; overflow-wrap:anywhere; margin-top:12px; }
.mq-presentation>.mq-actions { justify-content:center; }
.mq-layout-dialog { max-width:1040px; }
.mq-layout-preview { max-width:850px; margin:20px auto; }
.mq-entry { display:inline-block; padding:12px 0; }
.mq-page [hidden] { display:none!important; }
@media(max-width:1000px) {
  .mq-workspace { grid-template-columns:minmax(0,1fr); }
  .mq-inspector { max-width:760px; width:100%; margin:auto; }
}
@media(max-width:760px) {
  .mq-hero { grid-template-columns:minmax(0,1fr); gap:16px; }
  .mq-hero h1 { font-size:clamp(42px,7vw,62px); }
  .mq-emblem { display:none; }
}
@media(max-width:640px) {
  .mq-stage-wrap { display:none; }
  .mq-list { display:grid; }
  .mq-caption strong { display:none; }
  .mq-caption { padding:0 4px; height:19px; }
  .mq-picture { bottom:19px; }
}
@media(max-width:520px) {
  .mq-page { padding-top:30px; }
  .mq-form-grid { grid-template-columns:minmax(0,1fr); gap:0; }
  .mq-actions>.btn { flex:1 1 145px; }
  .mq-inspector,.mq-metadata,.mq-add,.mq-source,.mq-about,.mq-empty { padding:18px; }
}
@media(prefers-reduced-motion:reduce) {
  .mq-page * { animation:none; transition:none; scroll-behavior:auto; }
}