.viewer{background:var(--qi-color-surface);grid-template-rows:68px minmax(0,1fr);height:100dvh;display:grid;overflow:hidden}.viewer-header{border-bottom:1px solid var(--qi-app-line);grid-template-columns:1fr auto 1fr;align-items:center;padding:0 24px;display:grid}.viewer-back{justify-self:start;align-items:center;gap:6px;min-height:48px;font-size:17px;font-weight:700;text-decoration:none;display:inline-flex}.viewer-heading{text-align:center}.viewer-title{font-size:18px;font-weight:700;line-height:1.2}.viewer-meta{font-family:var(--qi-font-mono);color:var(--qi-color-text-muted);font-size:13px}.viewer-tools{justify-self:end;gap:8px;display:flex}.viewer-body{grid-template-columns:minmax(0,1fr) 340px;min-height:0;display:grid}.viewer-main{grid-template:minmax(0,1fr)/minmax(0,1fr);min-width:0;min-height:0;display:grid}.quilt-canvas{background-color:var(--qi-color-surface-sunken);background-image:radial-gradient(var(--qi-neutral-300) 1px, transparent 1px);background-size:18px 18px;min-height:0;position:relative;overflow:hidden}.quilt-canvas-surface{touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none;outline-offset:-3px;place-items:center;padding:96px 24px;display:grid;position:absolute;inset:0;container-type:size}.quilt-canvas-surface:active{cursor:grabbing}.quilt-canvas--notice .quilt-canvas-surface{padding:106px 24px 146px}.quilt-canvas-picture{position:relative}.quilt-canvas-img{height:min(100cqh, calc(100cqw * var(--pic-h) / var(--pic-w)));-webkit-user-drag:none;width:auto;display:block;box-shadow:0 30px 60px -30px #161a2e73}.quilt-canvas-picture--placed{position:absolute}.quilt-canvas-picture--placed .quilt-canvas-img{width:100%;height:100%}.quilt-canvas-picture .viewer-picture-tag{position:absolute;top:12px;left:12px}.picture-tag.viewer-picture-tag{color:var(--qi-neutral-700)}.picture-switch{background:var(--qi-color-surface);border:1px solid var(--qi-app-line);box-shadow:var(--qi-app-shadow-card);border-radius:12px;padding:4px;display:flex;position:absolute;top:20px;left:24px}.picture-switch-option{height:44px;color:var(--qi-color-text-muted);cursor:pointer;background:0 0;border:0;border-radius:9px;margin:0;padding:0 16px;font-size:15px;font-weight:700}.picture-switch-option[aria-pressed=true]{background:var(--qi-app-tint);color:var(--qi-color-primary)}.picture-switch-option[aria-pressed=false]:not([aria-disabled=true]):hover{color:var(--qi-color-text)}.picture-switch-option--unavailable{color:var(--qi-color-text-subtle);cursor:not-allowed;align-items:center;gap:8px;padding:0 12px 0 16px;display:inline-flex}.look-switch{z-index:3;background:var(--qi-color-surface);border:1px solid var(--qi-app-line);box-shadow:var(--qi-app-shadow-card);border-radius:12px;padding:4px;display:flex;position:absolute;top:20px;right:24px}.look-switch-option{height:44px;color:var(--qi-color-text-muted);cursor:pointer;background:0 0;border:0;border-radius:9px;align-items:center;gap:8px;margin:0;padding:0 14px;font-size:15px;font-weight:700;display:inline-flex}.look-switch-option[aria-pressed=true]{background:var(--qi-app-tint);color:var(--qi-color-primary)}.look-switch-option[aria-pressed=false]:hover{color:var(--qi-color-text)}.look-switch-option:focus-visible{outline:3px solid var(--qi-color-focus);outline-offset:0}.look-switch--quilting{flex-direction:column;gap:2px;width:136px}.look-switch--quilting .look-switch-option{white-space:nowrap;justify-content:flex-start;padding:0 10px}.look-switch-rule{background:var(--qi-app-line);height:1px;margin:4px 6px}.look-switch-overline{letter-spacing:.07em;text-transform:uppercase;color:var(--qi-color-text-subtle);margin:0;padding:4px 10px 2px;font-size:12px;font-weight:700}.look-switch-quilting{flex-direction:column;gap:2px;display:flex}.look-switch-radio{height:40px}.look-switch-radio[aria-checked=true]{background:var(--qi-app-tint);color:var(--qi-color-primary)}.look-switch-dot{border:2px solid var(--qi-color-border-strong);border-radius:999px;flex:none;place-items:center;width:16px;height:16px;display:grid}.look-switch-radio[aria-checked=true] .look-switch-dot{border-color:var(--qi-color-primary)}.look-switch-radio[aria-checked=true] .look-switch-dot:after{content:"";background:var(--qi-color-primary);border-radius:999px;width:8px;height:8px}@media (max-width:599.98px){.look-switch{top:12px;right:12px}.look-switch-option{gap:6px;padding:0 10px;font-size:14px}}.zoom-dock{align-items:center;gap:14px;display:flex;position:absolute;bottom:20px;left:50%;transform:translate(-50%)}.zoom-bar{background:var(--qi-color-surface);border:1px solid var(--qi-app-line);box-shadow:var(--qi-app-shadow-card);border-radius:12px;align-items:center;padding:4px;display:flex}.zoom-bar--sunken{background:var(--qi-color-surface-sunken);box-shadow:none;border:0;flex:none}.zoom-bar-step{width:44px;height:44px;color:var(--qi-color-text);cursor:pointer;background:0 0;border:0;border-radius:9px;place-items:center;margin:0;padding:0;display:grid}.zoom-bar-fit{height:44px;color:var(--qi-color-text);cursor:pointer;background:0 0;border:0;border-radius:9px;margin:0;padding:0 14px;font-size:15px;font-weight:700}.zoom-bar-step:hover,.zoom-bar-fit:hover{background:var(--qi-color-surface-sunken)}.zoom-bar--sunken .zoom-bar-step:hover{background:var(--qi-color-surface)}.zoom-bar-step[aria-disabled=true]{color:var(--qi-neutral-400);cursor:not-allowed;background:0 0}.zoom-bar-level{text-align:center;min-width:64px;font-family:var(--qi-font-mono);font-size:15px}.zoom-bar--sunken .zoom-bar-level{min-width:56px}.zoom-bar-rule{background:var(--qi-app-line);width:1px;height:26px;margin:0 4px}.zoom-hint{color:var(--qi-color-text-muted);white-space:nowrap;background:#ffffffeb;border-radius:999px;padding:8px 12px;font-size:14px}.zoom-hint-touch{display:none}.zoom-hint--corner{position:absolute;bottom:16px;right:20px}.viewer-notice{background:var(--qi-color-surface);border:1px solid var(--qi-app-line);border-radius:16px;align-items:center;gap:16px;padding:14px 18px;display:flex;position:absolute;bottom:20px;left:24px;right:24px;box-shadow:0 2px 6px #161a2e0f,0 16px 40px -16px #161a2e40}.viewer-notice-icon{color:var(--qi-color-primary);flex:none}.viewer-notice-text{color:var(--qi-neutral-700);font-size:16px;line-height:1.45}.minimap{pointer-events:none;background:var(--qi-color-surface);border:1px solid var(--qi-app-line);border-radius:12px;width:96px;padding:8px;position:absolute;top:16px;right:16px;box-shadow:0 2px 8px #161a2e1f}.minimap-inner{position:relative}.minimap-img{width:80px;height:auto;display:block}.minimap-frame{border:2px solid var(--qi-madder-500);border-radius:2px;position:absolute}.viewer-canvas--undrawn{place-items:center;padding:24px;display:grid}.viewer-canvas--undrawn .undrawn-panel{background:0 0;max-width:760px}.undrawn-panel{background-color:var(--qi-color-surface-sunken);background-image:radial-gradient(var(--qi-app-dots) 1px, transparent 1px);background-size:18px 18px;grid-template-columns:196px minmax(0,1fr);align-items:center;gap:28px;padding:24px 32px;display:grid}.undrawn-frame.undrawn-frame--viewer{border-radius:6px;width:196px;height:237px}.undrawn-frame--viewer svg{width:48px;height:48px}.undrawn-panel-body{flex-direction:column;gap:10px;display:flex}.undrawn-panel-title{font-family:var(--qi-font-display);font-size:24px;font-weight:600;line-height:1.15}.undrawn-panel-facts{font-family:var(--qi-font-mono);color:var(--qi-color-text-muted);font-size:14px}.undrawn-panel-text{color:var(--qi-color-text-muted);font-size:16px;line-height:1.45}.undrawn-panel-link{align-items:center;gap:6px;min-height:44px;font-size:16px;font-weight:700;text-decoration:none;display:inline-flex}.viewer-panel{border-left:1px solid var(--qi-app-line);flex-direction:column;gap:14px;min-height:0;padding:22px 24px;display:flex;overflow:hidden}.viewer-panel-section{display:contents}.viewer-label{letter-spacing:.07em;text-transform:uppercase;color:var(--qi-color-text-subtle);font-size:12px;font-weight:700}.viewer-label--spaced{margin-top:6px}.viewer-report{display:contents}.viewer-report-pill{align-self:flex-start}.viewer-report-note{color:var(--qi-color-text-muted);font-size:15px;line-height:1.45}.viewer:has(.quilt-canvas[data-picture=eq]) .viewer-report-note--ours{display:none}.viewer:not(:has(.quilt-canvas[data-picture=eq])) .viewer-report-note--eq{display:none}.viewer-no-picture{color:var(--qi-color-text-subtle);align-items:flex-start;gap:8px;font-size:14px;line-height:1.4;display:flex}.viewer-no-picture svg{flex:none;margin-top:2px}.viewer-link{align-items:center;gap:6px;min-height:44px;font-size:15px;font-weight:700;text-decoration:none;display:inline-flex}.viewer-link:hover,.viewer-file-link:hover{text-underline-offset:4px;text-decoration:underline}.viewer-report-rows{flex-direction:column;display:flex}.viewer-report-row{border-top:1px solid var(--qi-app-line);justify-content:space-between;align-items:center;gap:12px;padding:10px 0;display:flex}.viewer-report-what{font-size:15.5px;font-weight:700}.viewer-report-detail{font-family:var(--qi-font-mono);color:var(--qi-color-text-muted);font-size:13px}.viewer-fabrics{flex-direction:column;gap:8px;display:flex}.viewer-fabric{grid-template-columns:44px minmax(0,1fr);align-items:center;gap:10px;font-size:15px;display:grid}.viewer-fabric-words{flex-direction:column;min-width:0;line-height:1.3;display:flex}.viewer-fabric-match{color:var(--qi-color-text-subtle);font-size:14px}.viewer-siblings{gap:10px;display:flex}.viewer-sibling{background:var(--qi-color-surface-sunken);border-radius:12px;place-items:center;width:76px;height:76px;padding:8px;display:grid}.viewer-sibling:hover{box-shadow:inset 0 0 0 2px var(--qi-color-border-strong)}.viewer-sibling[aria-current=true]{background:var(--qi-app-tint);box-shadow:inset 0 0 0 2px var(--qi-color-focus)}.viewer-sibling-img{max-width:100%;max-height:60px;display:block}.viewer-file-link{min-height:44px;font-family:var(--qi-font-mono);align-items:center;font-size:15px;font-weight:700;text-decoration:none;display:inline-flex}.viewer-states{background:var(--qi-color-surface-sunken);flex-direction:column;gap:26px;height:100dvh;padding:44px 56px 40px;display:flex;overflow:hidden}.viewer-states-title{font-family:var(--qi-font-display);letter-spacing:-.024em;font-size:44px;font-weight:600;line-height:1.04}.viewer-states-grid{flex-grow:1;grid-template-rows:repeat(2,minmax(0,1fr));grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;min-height:0;display:grid}.viewer-states-section{flex-direction:column;gap:10px;min-height:0;display:flex}.viewer-states-label{letter-spacing:.07em;text-transform:uppercase;color:var(--qi-color-text-subtle);font-size:13px;font-weight:700}.viewer-states-card{flex-grow:1}.viewer-states-card.quilt-canvas,.viewer-states-card.undrawn-panel{border:1px solid var(--qi-app-line);border-radius:20px}.viewer-states-card .zoom-dock{gap:12px;bottom:16px;left:16px;transform:none}.viewer-states-card .zoom-bar-level{min-width:60px}@media (min-width:1024px) and (max-width:1279.98px){.viewer-header{padding:0 20px}.viewer-tools .viewer-tool{height:48px}.viewer-body{grid-template-columns:minmax(0,1fr) 300px}.viewer-panel{gap:12px;padding:20px 22px}.viewer-label--spaced{margin-top:4px}.quilt-canvas-surface{padding:46px 20px 86px}.zoom-dock{gap:12px;bottom:18px}.zoom-bar-step{width:48px;height:48px}.zoom-bar-level{min-width:60px}.zoom-dock .zoom-bar-rule,.zoom-dock .zoom-bar-fit{display:none}}@media (min-width:1024px) and (max-width:1279.98px),(hover:none) and (pointer:coarse){.zoom-hint-mouse{display:none}.zoom-hint-touch{display:inline}}@media (min-width:1280px){.viewer-report--note{flex-direction:column;align-items:flex-start;gap:8px;display:flex}}@media (max-width:1023.98px){.viewer{grid-template-rows:68px auto;height:auto;min-height:100dvh;overflow:visible}.viewer-header{padding:0 16px}.viewer-back{padding:0 4px}.viewer-tools .viewer-tool{height:48px;padding:0 14px}.viewer-body{grid-template-rows:clamp(420px,100dvh - 490px,900px) auto;grid-template-columns:minmax(0,1fr)}.quilt-canvas-surface{padding:95px 20px 55px}.picture-switch{top:16px;left:20px}.viewer-panel{border-left:0;border-top:1px solid var(--qi-app-line);grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-content:start;gap:32px;padding:22px 28px;display:grid}.viewer-panel-section{flex-direction:column;gap:10px;display:flex}.viewer-label--spaced{margin-top:0}.viewer-fabric{grid-template-columns:44px minmax(0,1fr) auto}.viewer-fabric-words{line-height:normal;display:contents}.viewer-fabric-match{white-space:nowrap}.viewer-file-link--count{font-size:14px;font-weight:500}}@media (max-width:599.98px){.viewer-header{grid-template-columns:auto minmax(0,1fr) auto;column-gap:8px;padding:0 8px}.viewer-heading{text-align:left;min-width:0}.viewer-tools{display:none}.viewer-panel{grid-template-columns:minmax(0,1fr);padding:20px 16px}.undrawn-panel{grid-template-columns:minmax(0,1fr)}.viewer-body:has(.quilt-canvas--notice){grid-template-rows:auto auto}.quilt-canvas.quilt-canvas--notice{flex-direction:column;display:flex}.quilt-canvas--notice .quilt-canvas-surface{flex:none;height:clamp(420px,100dvh - 490px,900px);padding:76px 16px 24px;position:relative;inset:auto}.quilt-canvas--notice .viewer-notice{border:0;border-top:1px solid var(--qi-app-line);box-shadow:none;border-radius:0;align-items:flex-start;gap:12px;padding:14px 16px;position:static}.quilt-canvas--notice .viewer-notice-text{font-size:15px}}.viewer-phone-change{display:none}@media (max-width:1023.98px){.viewer-phone-change{padding:16px calc(16px + var(--qi-safe-right)) 4px calc(16px + var(--qi-safe-left));background:var(--qi-color-surface);flex-direction:column;gap:10px;display:flex}.viewer-phone-change .button--primary{gap:10px}.viewer-phone-change-more{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}}.viewer-tools .viewer-tool--change{gap:8px;display:inline-flex}.viewer-header:has(.viewer-tool--change){grid-template-columns:auto minmax(0,1fr) auto;column-gap:16px}.viewer-header:has(.viewer-tool--change) .viewer-heading{text-align:left;min-width:0}:is(.viewer-header:has(.viewer-tool--change) .viewer-title,.viewer-header:has(.viewer-tool--change) .viewer-meta){white-space:nowrap;text-overflow:ellipsis;overflow:hidden}@media (max-width:1023.98px){.viewer-tools .viewer-tool--change{display:none}}@media (max-height:499.98px) and (pointer:coarse){.viewer-body{grid-template-rows:calc(100dvh - 68px) auto}.quilt-canvas-surface{padding:72px 20px 16px}.viewer-phone-change{display:none}.viewer-tools .viewer-tool--change{display:inline-flex}}@media (max-width:743.98px){.viewer-phone-change{display:flex}.viewer-tools .viewer-tool--change{display:none}}.viewer-tools .viewer-tool[aria-expanded=true]{border-color:var(--qi-color-focus);background:var(--qi-app-tint);color:var(--qi-color-primary)}.quilt-canvas-quilting{pointer-events:none;-webkit-user-drag:none;width:100%;height:100%;position:absolute;inset:0}.viewer-quilting{flex-direction:column;gap:12px;display:flex}.viewer-quilting-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.viewer-quilting-head .viewer-label{margin:0}.viewer-quilting .viewer-quilting-pill--head{display:none}.viewer-quilting-rows{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.viewer-quilting-rows li{grid-template-columns:44px minmax(0,1fr);align-items:center;gap:14px;display:grid}.viewer-quilting-rows li>span{flex-direction:column;min-width:0;line-height:1.35;display:flex}.viewer-quilting-rows strong{font-size:15px}.viewer-quilting-meta{font-family:var(--qi-font-mono,"Atkinson Hyperlegible Mono", monospace);color:var(--qi-color-text-muted);font-size:13.5px}.viewer-quilting-rows .quilting-picture{box-shadow:inset 0 0 0 1px var(--qi-app-line);border-radius:6px}.viewer-quilting-pill{border-radius:999px;align-self:flex-start;align-items:center;gap:6px;min-height:28px;margin:0;padding:0 12px;font-size:14px;font-weight:700;display:inline-flex}.viewer-quilting-pill--exact{background:var(--qi-color-success-bg);color:var(--qi-color-success)}.viewer-quilting-pill--not-yet{background:var(--qi-color-surface-sunken);color:var(--qi-color-text-muted)}.viewer-quilting-note{color:var(--qi-color-text-muted);margin:0;font-size:15px;line-height:1.5}.viewer-quilting-note strong{color:var(--qi-color-text)}.viewer-fabrics-fold>summary{cursor:pointer;justify-content:space-between;align-items:center;min-height:44px;list-style:none;display:flex}.viewer-fabrics-fold>summary::-webkit-details-marker{display:none}.viewer-fabrics-fold>summary .viewer-label{margin:0}.viewer-fabrics-show{color:var(--qi-color-primary);font-size:15px;font-weight:700}.viewer-fabrics-fold[open] .viewer-fabrics-show:before{content:"Hide"}.viewer-fabrics-fold:not([open]) .viewer-fabrics-show:before{content:"Show"}.viewer-look-row{display:none}@media (max-width:743.98px){.quilt-canvas--look-row .look-switch{display:none}.viewer-look-row{background:var(--qi-color-surface);flex-direction:column;gap:12px;padding:16px 16px 4px;display:flex}.viewer-look-buttons{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.viewer-look-buttons button{border:2px solid var(--qi-app-line);background:var(--qi-color-surface);height:48px;color:var(--qi-color-text);font:inherit;cursor:pointer;border-radius:12px;justify-content:center;align-items:center;gap:8px;font-size:15px;font-weight:700;display:inline-flex}.viewer-look-buttons button[aria-pressed=true]{border-color:var(--qi-color-focus);background:var(--qi-app-tint);color:var(--qi-color-primary)}.viewer-look-segmented{background:var(--qi-color-surface-sunken);border-radius:12px;grid-template-columns:1fr 1fr;gap:2px;padding:4px;display:grid}.viewer-look-segmented button{height:44px;color:var(--qi-color-text-muted);font:inherit;cursor:pointer;background:0 0;border:0;border-radius:9px;font-size:15px;font-weight:600}.viewer-look-segmented button[aria-checked=true]{background:var(--qi-color-surface);color:var(--qi-color-text);font-weight:700;box-shadow:0 1px 2px #161a2e1f}.viewer-quilting .viewer-quilting-pill--head{display:inline-flex}.viewer-quilting>.viewer-quilting-pill,.viewer-quilting-rows~.viewer-quilting-note{display:none}}