/* Hallmark · shape: Product Showcase · genre: modern-minimal · theme: Cobalt (user shortlist) · redesign: full · job: buy, preview only
 * hero: Banner above product stage · nav: edge-aligned · footer: colophon · imagery: fictional product scenes and original SVG cover art by user request · signature: switchable workspace scenes with inspectable related records
 * axes: light/grotesk-sans/cool · posture: restrained on page, full palette inside fictional product covers · draw: b7f9d5, changed to product showcase because imagery and exploration are the explicit job · live responsive review: ship · static sweep:0 FAIL,0 REFLEX,0 WARN · v2.0.0 */
/* Hallmark · pre-emit critique: P4 H4 E4 S5 R4 V5 · weakest: R, removed decorative ASCII and kept only meaningful animated interactions */
/* Hallmark · waive 80 · original fictional cover art requested by the user · Product scenes are clearly illustrative, not proof of actual template appearance */
/* Hallmark · answered F24 · The product screen is a single large raised surface; its edge preserves contrast against the page */
/* Hallmark · dropped connected-title, rhythm-title · Rebuilt the text catalogue as an immersive product showcase at the user’s request */
:root { --color-ui:oklch(99.7% .002 250);--color-ui-soft:oklch(96.8% .004 250);--color-green:oklch(36% .07 160);--color-green-wash:oklch(93% .035 160);--color-amber:oklch(42% .08 75);--color-amber-wash:oklch(94% .055 85);--color-thumb-sand:oklch(88% .04 60);--color-dialog-shade:oklch(15% .025 260 / .6);--shadow-product:0 24px 80px oklch(30% .05 260 / .14),0 3px 10px oklch(30% .05 260 / .06);--text-ui: .875rem; }
html,body { overflow-x:clip; }
button,a,summary { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; }
button:disabled { opacity:.55;cursor:not-allowed; }
button[aria-busy=true] { cursor:progress; }
a { text-decoration-thickness:1px; }
a:hover { text-decoration-color:var(--color-accent); }
.skip { position:absolute;left:var(--space-md);top:calc(-1 * var(--space-3xl));z-index:var(--z-toast);padding:var(--space-sm) var(--space-lg);background:var(--color-ink);color:var(--color-paper); }
.skip:focus-visible { top:var(--space-md); }
.concept-note { padding:var(--space-xs) var(--gutter);font-size:var(--text-xs);text-align:center;background:var(--color-paper-3);color:var(--color-ink-2); }
.site-header { border-bottom:1px solid var(--color-rule); }
.site-header .container { display:flex;align-items:center;justify-content:space-between;min-height:80px;gap:var(--space-xl); }
.brand { display:inline-flex;align-items:center;gap:var(--space-sm);font:600 1.4rem/1 var(--font-display);letter-spacing:var(--tracking-display);text-decoration:none; }
.brand-mark { display:inline-grid;place-items:center;background:var(--color-accent);color:var(--color-paper);width:30px;height:34px;border-radius:5px;font-size:25px; }
.site-header nav { display:flex;align-items:center;gap:var(--space-xl);font:500 var(--text-sm)/1 var(--font-display); }
.site-header nav>a:not(.key) { padding-block:var(--space-md); }
.key { display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:var(--space-sm) var(--space-lg);border:1px solid var(--color-rule-2);border-radius:var(--radius-input);background:var(--color-key-face);color:var(--color-ink);font:500 var(--text-md)/1 var(--font-display);box-shadow:var(--shadow-key);text-decoration:none;white-space:nowrap;transition:transform var(--dur-micro) var(--ease-out),box-shadow var(--dur-micro) var(--ease-out); }
.key:hover { transform:translateY(-1px); }.key:active { transform:translateY(3px);box-shadow:var(--shadow-key-press); }.key-primary { background:var(--color-accent);border-color:var(--color-accent-edge);color:var(--color-accent-ink);box-shadow:var(--shadow-key-accent); }.key-small { min-height:40px;padding-inline:var(--space-md);font-size:var(--text-sm); }
.hero { padding-block:var(--space-xl) var(--section-gap); }
.hero-intro { display:flex;justify-content:space-between;align-items:end;gap:var(--space-xl);margin-bottom:var(--space-lg); }
h1 { font-size:clamp(3rem,4.2vw,4rem);line-height:1.02;max-width:none;font-weight:600; }
.hero-intro .lead { margin-top:var(--space-md);max-width:55ch;color:var(--color-ink-2); }
.hero-action { padding-bottom:var(--space-xs); }.hero-action p { font-size:var(--text-sm);color:var(--color-muted);margin-top:var(--space-lg);line-height:1.6; }
.tour-toolbar { display:flex;align-items:center;justify-content:space-between;gap:var(--space-lg);margin-bottom:var(--space-lg); }
.workspace-tabs,.view-switch { display:flex;gap:var(--space-2xs);padding:var(--space-2xs);background:var(--color-paper-3);border:1px solid var(--color-rule);border-radius:var(--radius-card); }
.workspace-tabs button,.view-switch button { border:1px solid transparent;padding:var(--space-sm) var(--space-lg);background:transparent;color:var(--color-ink-2);font:500 var(--text-md)/1 var(--font-display);border-radius:4px;min-height:44px;white-space:nowrap; }
.workspace-tabs button[aria-selected=true],.view-switch button[aria-selected=true] { border-color:var(--color-rule-2);background:var(--color-key-face);box-shadow:0 2px 1px var(--color-key-edge);color:var(--color-ink); }
.workspace-tabs button:hover,.view-switch button:hover { background:var(--color-paper-2); }
.play-button { display:inline-flex;align-items:center;gap:var(--space-xs);border:0;background:transparent;min-height:44px;color:var(--color-accent);font:500 var(--text-md)/1 var(--font-display); }
.play-button span { font-size:1.4rem; }.play-button:hover { text-decoration:underline; }
.product-screen { display:grid;grid-template-columns:200px minmax(0,1fr);border:1px solid var(--color-rule-2);border-radius:var(--radius-card);background:var(--color-ui);box-shadow:var(--shadow-product);overflow:clip; }
.product-sidebar { background:var(--color-ui-soft);border-right:1px solid var(--color-rule);padding:var(--space-lg) var(--space-sm);font-size:var(--text-ui); }
.workspace-logo { display:flex;align-items:center;gap:var(--space-xs);padding-inline:var(--space-xs);margin-bottom:var(--space-xl);font-weight:500; }.workspace-logo>b { display:grid;place-items:center;flex:none;width:30px;height:32px;border:1px solid var(--color-rule-2);border-radius:4px;background:var(--color-paper);font:600 22px var(--font-display); }.workspace-logo small { display:block;font-size:.67rem;color:var(--color-muted);font-weight:400; }
.sidebar-quiet { margin:var(--space-lg) var(--space-xs) var(--space-xs);font-size:.72rem;color:var(--color-muted); }.sidebar-line { display:flex;gap:var(--space-xs);padding:var(--space-xs);border-radius:4px;color:var(--color-ink-2); }.sidebar-line.active { background:var(--color-paper-3);color:var(--color-ink);font-weight:500; }.sidebar-foot { margin-top:var(--space-3xl);padding-inline:var(--space-xs);color:var(--color-muted);font-size:var(--text-xs); }
.product-main { min-width:0; }.product-breadcrumb { display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);padding:var(--space-md) var(--space-lg);border-bottom:1px solid var(--color-rule);font-size:.72rem;color:var(--color-muted); }.product-breadcrumb b { font-weight:400;color:var(--color-ink); }
.workspace-cover { position:relative;isolation:isolate;height:64px;overflow:clip;background:var(--color-accent-wash); }.cover-grid { position:absolute;inset:0;background-image:linear-gradient(var(--color-rule) 1px,transparent 1px),linear-gradient(90deg,var(--color-rule) 1px,transparent 1px);background-size:40px 40px; }.cover-type { position:absolute;left:var(--space-xl);top:var(--space-lg);font:500 clamp(1rem,1.6vw,1.4rem)/1.1 var(--font-display);letter-spacing:var(--tracking-display);color:var(--color-accent-deep);z-index:2; }.cover-orbit { position:absolute;width:340px;height:340px;border:44px solid var(--color-glyph-2);border-radius:50%;right:-40px;top:-130px; }.orbit-two { width:230px;height:230px;border-width:30px;right:140px;top:24px;border-color:var(--color-glyph-3); }
.scene-content { padding:var(--space-lg) var(--space-xl) var(--space-xl); }.scene-content h2 { font-size:2rem;font-weight:600;letter-spacing:-.025em; }.scene-subtitle { font-size:var(--text-ui);color:var(--color-muted);margin-top:var(--space-xs); }.ui-section-label { display:flex;justify-content:space-between;gap:var(--space-md);margin-top:var(--space-lg);margin-bottom:var(--space-sm);font-size:var(--text-ui); }.ui-section-label span { color:var(--color-muted);font-size:.75rem; }.ui-section-label strong { font-weight:500; }
.business-gallery { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-sm); }.business-tile { min-width:0;padding:0;border:1px solid var(--color-rule);border-radius:6px;overflow:clip;background:var(--color-ui);text-align:left;transition:transform var(--dur-short) var(--ease-out),box-shadow var(--dur-short) var(--ease-out); }.business-tile:hover { transform:translateY(-4px);box-shadow:0 8px 24px var(--color-rule); }.business-tile img { width:100%;height:108px;object-fit:cover; }.business-tile>strong { display:block;margin:var(--space-sm) var(--space-sm) var(--space-2xs);font:500 1rem/1.2 var(--font-display); }.business-tile>span { display:block;margin-inline:var(--space-sm);font-size:.72rem;color:var(--color-muted); }.tile-foot { display:flex;justify-content:space-between;align-items:center;gap:var(--space-2xs);margin:var(--space-md) var(--space-sm) var(--space-sm); }.tile-foot small { font-size:.65rem;color:var(--color-muted); }.status { font-variant-numeric:tabular-nums;display:inline-flex;font-style:normal;font-weight:400;font-size:.68rem;line-height:1.3;padding:var(--space-2xs) var(--space-xs);border-radius:3px;white-space:nowrap; }.status-blue { color:var(--color-accent-deep);background:var(--color-accent-wash); }.status-green { color:var(--color-green);background:var(--color-green-wash); }.status-amber { color:var(--color-amber);background:var(--color-amber-wash); }
.compact-table { font-variant-numeric:tabular-nums;border-top:1px solid var(--color-rule-2);font-size:.78rem; }.compact-table>div { display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,1fr);gap:var(--space-sm);align-items:center;padding-block:var(--space-sm);border-bottom:1px solid var(--color-rule); }.compact-table b { font-weight:500; }.compact-table span { color:var(--color-muted); }.compact-table em { justify-self:start; }
.scene-caption { display:flex;justify-content:space-between;gap:var(--space-xl);margin-top:var(--space-lg);font-size:var(--text-xs);color:var(--color-muted); }.scene-caption p { color:var(--color-ink-2); }.scene-caption>span { max-width:45ch;text-align:right; }
#dashboard-content { min-height:628px; }.scene-enter { animation:scene-in 300ms var(--ease-out); }@keyframes scene-in { from{opacity:.3;transform:translateY(6px)}to{opacity:1;transform:translateY(0)} }
.desk-layout { display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:var(--space-lg);margin-top:var(--space-lg); }.task-stack label { display:flex;gap:var(--space-sm);align-items:start;border-bottom:1px solid var(--color-rule);padding:var(--space-md) 0;font-size:var(--text-ui); }.task-stack input { accent-color:var(--color-accent);width:17px;height:17px;margin-top:var(--space-2xs); }.task-stack strong { display:block;font-weight:500; }.task-stack small { display:block;color:var(--color-muted);font-size:.72rem;margin-top:var(--space-2xs); }.task-stack label:has(input:checked) strong { text-decoration:line-through;color:var(--color-muted); }.focus-note { background:var(--color-accent-wash);padding:var(--space-lg);border:1px solid var(--color-rule);border-radius:6px;font-size:var(--text-ui); }.focus-note h3 { font-size:var(--text-xl);margin-block:var(--space-md); }.focus-note p { color:var(--color-ink-2);line-height:1.6; }.focus-note>span { font-size:.75rem;color:var(--color-accent-deep); }.review-scene { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-md);margin-top:var(--space-lg); }.review-scene article { border-top:3px solid var(--color-glyph-3);padding-top:var(--space-md); }.review-scene h3 { font-size:1.15rem; }.review-scene p { font-size:var(--text-ui);color:var(--color-ink-2);margin-block:var(--space-sm); }.review-scene small { color:var(--color-muted); }
.section-heading { display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:end;gap:var(--gap-columns);margin-bottom:var(--space-2xl); }.section-heading p { color:var(--color-muted);font-size:var(--text-lead);max-width:42ch; }.section-heading h2 { font-weight:600; }.connections-section { padding-block:var(--section-gap-s);background:var(--color-graphite);color:var(--color-graphite-ink); }.connections-section h2 { color:var(--color-graphite-ink); }.connections-section .section-heading p,.connections-section .section-caption { color:var(--color-graphite-muted); }
.connection-layout { display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:var(--gap-columns);align-items:center; }.relation-map { height:460px;position:relative; }.relation-lines { position:absolute;width:100%;height:100%;overflow:visible; }.relation-lines path { fill:none;stroke:var(--color-graphite-glyph-2);stroke-width:1.5; }.relation-lines .flow-path { stroke:var(--color-accent-2);stroke-width:2;stroke-dasharray:10 9; }.relation-map.flowing .flow-path { animation:flow-shift 800ms linear 2; }@keyframes flow-shift { from{stroke-dashoffset:38}to{stroke-dashoffset:0} }
.db-node { position:absolute;display:grid;justify-items:start;gap:var(--space-xs);width:29%;min-height:104px;border:1px solid var(--color-graphite-glyph-2);padding:var(--space-md);background:var(--color-graphite-2);color:var(--color-graphite-ink);text-align:left;border-radius:var(--radius-card);transition:transform var(--dur-short) var(--ease-out),border-color var(--dur-short) var(--ease-out); }.db-node strong { font:500 1.2rem/1 var(--font-display); }.db-node small { font-size:.72rem;color:var(--color-graphite-muted); }.db-node:hover { transform:translateY(-3px);border-color:var(--color-accent-2); }.db-node[aria-pressed=true] { border-color:var(--color-accent-2);background:var(--color-graphite); }.db-symbol { color:var(--color-accent-2);font-size:1.3rem; }.node-people { top:0;left:0; }.node-business { top:0;left:35.5%; }.node-project { top:36%;left:35.5%; }.node-action { top:36%;right:0; }.node-notes { bottom:0;left:35.5%; }.node-reviews { bottom:0;right:0; }
.relation-detail { min-height:340px;border:1px solid var(--color-graphite-glyph-2);padding:var(--space-xl);border-radius:var(--radius-card); }.detail-label { display:block;color:var(--color-accent-2);font-size:var(--text-sm); }.relation-detail h3 { color:var(--color-graphite-ink);font-size:2rem;margin-top:var(--space-lg); }.relation-detail p { font-size:var(--text-sm);color:var(--color-graphite-muted);margin-block:var(--space-sm) var(--space-lg); }.relation-row { display:flex;justify-content:space-between;gap:var(--space-md);padding-block:var(--space-sm);border-top:1px solid var(--color-graphite-glyph-1);font-size:var(--text-xs); }.relation-row span { color:var(--color-graphite-muted); }.relation-row strong { font-weight:400; }.section-caption { margin-top:var(--space-lg);font-size:var(--text-xs);color:var(--color-muted); }
.views-section { padding-block:var(--section-gap); }.view-comparison { border:1px solid var(--color-rule-2);border-radius:var(--radius-card);background:var(--color-ui);box-shadow:var(--shadow-product);overflow:clip; }.view-toolbar { display:flex;align-items:center;gap:var(--space-xl);padding:var(--space-lg);border-bottom:1px solid var(--color-rule); }.view-toolbar>strong { font:600 1.4rem var(--font-display); }.view-toolbar>span { margin-left:auto;font-size:var(--text-xs);color:var(--color-muted); }.view-switch button { min-height:36px;padding:var(--space-xs) var(--space-md);font-size:var(--text-sm); }.project-board { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-lg);padding:var(--space-lg); }.board-lane { min-width:0; }.board-lane h3 { display:flex;align-items:center;gap:var(--space-xs);font:500 var(--text-md) var(--font-display);margin-bottom:var(--space-lg); }.board-lane h3 small { margin-left:auto;color:var(--color-muted);font-weight:400;font-variant-numeric:tabular-nums; }.lane-square { width:9px;height:9px;background:var(--color-rule-2);border-radius:2px; }.lane-blue { background:var(--color-glyph-3); }.lane-green { background:var(--color-green); }.project-item { display:block;width:100%;border:1px solid var(--color-rule);border-radius:6px;padding:0;text-align:left;background:var(--color-ui);overflow:clip;transition:transform var(--dur-short) var(--ease-out); }.project-item:hover { transform:translateY(-4px); }.mini-cover { height:130px;background-size:cover;background-position:center; }.cover-northline { background-image:url('assets/northline.svg'); }.cover-forma { background-image:url('assets/forma.svg'); }.cover-morrow { background-image:url('assets/morrow.svg'); }.project-item>strong { display:block;margin:var(--space-lg) var(--space-lg) var(--space-xs);font:500 1.4rem var(--font-display); }.project-item>span { display:block;margin-inline:var(--space-lg);font-size:var(--text-xs);color:var(--color-muted); }.project-item>p { font-size:var(--text-sm);margin:var(--space-md) var(--space-lg) var(--space-lg);min-height:44px; }.project-meta { display:flex;align-items:center;justify-content:space-between;margin:var(--space-lg);font-size:var(--text-xs);color:var(--color-muted); }.project-meta b { display:grid;place-items:center;background:var(--color-accent-wash);color:var(--color-accent-deep);width:28px;height:28px;border-radius:50%;font-size:.65rem;font-weight:500; }
.projects-table { font-variant-numeric:tabular-nums;width:100%;border-collapse:collapse;font-size:var(--text-md); }.projects-table th { font-weight:400;color:var(--color-muted);font-size:var(--text-sm);text-align:left;background:var(--color-ui-soft); }.projects-table td,.projects-table th { padding:var(--space-lg);border-bottom:1px solid var(--color-rule); }.projects-table button { display:inline-flex;gap:var(--space-sm);align-items:center;border:0;padding:0;min-height:44px;background:transparent;color:var(--color-ink);font-weight:500;text-align:left; }.table-thumb { width:56px;height:40px;object-fit:cover;border-radius:4px; }
.formats-section { padding-block:var(--section-gap-s);background:var(--color-paper-3); }.formats-section .container { display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:var(--space-2xl);align-items:center; }.formats-copy>p { font-size:var(--text-lead);color:var(--color-ink-2);margin-block:var(--space-lg) var(--space-xl);max-width:32ch; }.formats-copy .format-help { font-size:var(--text-xs);color:var(--color-muted);max-width:38ch;margin-block:var(--space-lg) 0; }.review-sheet { background:var(--color-ui);border:1px solid var(--color-rule-2);border-radius:var(--radius-card);padding:var(--space-xl);box-shadow:var(--shadow-product); }.sheet-top { display:flex;justify-content:space-between;gap:var(--space-md);font-size:var(--text-xs);color:var(--color-muted);border-bottom:1px solid var(--color-rule);padding-bottom:var(--space-lg); }.review-sheet h3 { font-size:2rem;margin-block:var(--space-lg); }.review-line { border-bottom:1px solid var(--color-rule);padding-block:var(--space-md); }.review-line>span { font-size:var(--text-sm);font-weight:500; }.review-line p { font-size:var(--text-sm);color:var(--color-muted);margin-top:var(--space-sm);min-height:44px; }.review-line p.filled { color:var(--color-accent-deep);animation:scene-in 350ms var(--ease-out); }.sheet-related { display:flex;flex-wrap:wrap;gap:var(--space-xs);margin-top:var(--space-lg);font-size:var(--text-xs); }.sheet-related>span { width:100%;color:var(--color-muted); }.sheet-related>b { padding:var(--space-xs) var(--space-sm);background:var(--color-paper-2);border:1px solid var(--color-rule);border-radius:4px;font-weight:400; }
.offer-section { padding-block:var(--section-gap-l) var(--section-gap); }.offer-intro { margin-bottom:var(--space-2xl); }.offer-intro p { margin-top:var(--space-lg);color:var(--color-muted); }.offer-panel { display:grid;grid-template-columns:1fr 1fr auto;gap:var(--gap-columns);align-items:center;border-block:1px solid var(--color-rule-2);padding-block:var(--space-xl); }.offer-panel>div>span { font-size:var(--text-sm);color:var(--color-muted); }.price { font:600 clamp(3rem,5vw,5rem)/1 var(--font-display);font-variant-numeric:tabular-nums;letter-spacing:var(--tracking-display);margin-block:var(--space-md); }.offer-panel p { font-size:var(--text-xs);color:var(--color-muted); }.offer-included { display:grid;gap:var(--space-sm); }.offer-included span { color:var(--color-ink-2)!important; }.offer-action p { margin-top:var(--space-lg); }.offer-detail { margin-top:var(--space-lg);font-size:var(--text-sm);color:var(--color-muted); }
.faq-section { padding-bottom:var(--section-gap-s); }.faq-section .container { display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--gap-columns); }.faq-list { border-top:1px solid var(--color-rule-2); }details { border-bottom:1px solid var(--color-rule); }summary { display:flex;align-items:center;justify-content:space-between;gap:var(--space-lg);cursor:pointer;padding-block:var(--space-lg);list-style:none; }summary::-webkit-details-marker { display:none; }summary:hover { color:var(--color-accent); }details p { padding-bottom:var(--space-lg);font-size:var(--text-sm);color:var(--color-muted); }details[open] summary>span { transform:rotate(45deg); }.site-footer { padding-block:var(--space-2xl);border-top:1px solid var(--color-rule-2); }.site-footer .container { display:flex;align-items:start;justify-content:space-between;gap:var(--space-lg); }.site-footer p { margin-top:var(--space-lg);color:var(--color-muted);font-size:var(--text-sm); }.site-footer a:not(.brand),.site-footer span { font-size:var(--text-sm);color:var(--color-muted); }
#record-dialog { width:min(720px,calc(100% - 32px));max-height:90dvh;overflow:auto;border:1px solid var(--color-rule-2);border-radius:var(--radius-card);padding:0;color:var(--color-ink);background:var(--color-ui);box-shadow:var(--shadow-product); }#record-dialog::backdrop { background:var(--color-dialog-shade); }#record-dialog[open] { animation:scene-in 250ms var(--ease-out); }.dialog-actions { display:flex;justify-content:space-between;align-items:center;padding:var(--space-md) var(--space-lg);font-size:var(--text-xs);color:var(--color-muted); }.dialog-cover { height:150px;background-image:url('assets/northline.svg');background-position:center;background-size:cover; }.dialog-body { padding:var(--space-xl); }.dialog-body h2 { font-size:2.5rem; }.dialog-subtitle { font-size:var(--text-sm);color:var(--color-muted);margin-top:var(--space-sm); }.record-properties { margin-block:var(--space-lg) var(--space-xl); }.record-properties>div { display:grid;grid-template-columns:100px minmax(0,1fr);gap:var(--space-md);padding-block:var(--space-xs);font-size:var(--text-sm); }.record-properties dt { color:var(--color-muted); }.record-properties dd { margin:0; }.dialog-body h3 { font-size:1.5rem;margin-bottom:var(--space-lg); }.record-related>div { display:grid;grid-template-columns:80px minmax(0,1fr) 110px;gap:var(--space-md);padding-block:var(--space-md);border-top:1px solid var(--color-rule);font-size:var(--text-sm); }.record-related strong { font-weight:500; }.record-related span,.record-related small { color:var(--color-muted);font-size:var(--text-xs); }
@supports(corner-shape:bevel) { .product-screen,.view-comparison,.review-sheet,.db-node,.relation-detail { border-radius:var(--cut-l) 4px;corner-shape:bevel round bevel round; } }
@media(max-width:60rem) { .site-header nav { gap:var(--space-lg); }.hero-intro { align-items:start; }.hero-action p { display:none; }.hero-intro { flex-direction:column;gap:var(--space-lg); }.hero-intro h1 { font-size:clamp(3rem,7vw,4.6rem); }.product-screen { grid-template-columns:150px minmax(0,1fr); }.product-sidebar { padding-inline:var(--space-xs); }.workspace-logo { font-size:.7rem; }.workspace-logo small { display:none; }.scene-content { padding:var(--space-lg); }.business-tile img { height:85px; }.business-tile>strong { font-size:.9rem; }.tile-foot small { display:none; }.business-tile>span { font-size:.68rem; }.section-heading { grid-template-columns:minmax(0,1fr);gap:var(--space-lg); }.connection-layout { grid-template-columns:minmax(0,1fr); }.relation-map { max-width:680px;width:100%;margin-inline:auto; }.relation-detail { min-height:0; }.relation-detail h3 { margin-top:var(--space-sm); }.relation-row { font-size:var(--text-sm); }.formats-section .container { grid-template-columns:minmax(0,1fr); }.offer-panel { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }.offer-action { grid-column:1/-1;display:flex;gap:var(--space-lg);align-items:center; }.offer-action p { margin:0; }.site-footer .container { flex-wrap:wrap; }.project-board { gap:var(--space-md);padding:var(--space-md); }.project-item>strong { font-size:1.15rem; }.project-item>strong,.project-item>span,.project-item>p,.project-meta { margin-inline:var(--space-md); }.projects-table td,.projects-table th { padding:var(--space-md); } }
@media(max-width:40rem) { .concept-note { font-size:.7rem; }.site-header .container { min-height:68px;gap:var(--space-md); }.brand { font-size:1.2rem; }.brand-mark { width:25px;height:28px;font-size:21px; }.site-header nav>a:not(.key) { display:none; }.site-header .key { font-size:var(--text-xs);padding-inline:var(--space-sm); }.hero { padding-top:var(--space-xl); }.hero-intro { margin-bottom:var(--space-xl); }.hero-intro h1 { font-size:clamp(2.5rem,9vw,3.5rem); }.hero-intro .lead { font-size:1.125rem; }.tour-toolbar { flex-direction:column;align-items:stretch;gap:var(--space-xs); }.workspace-tabs { justify-content:space-between; }.workspace-tabs button { flex:1;padding-inline:var(--space-xs);font-size:var(--text-sm); }.play-button { align-self:end; }.product-screen { display:block; }.product-sidebar { display:none; }.product-breadcrumb { padding:var(--space-sm);font-size:.65rem; }.product-breadcrumb>span:last-child { display:none; }.workspace-cover { height:110px; }.cover-type { left:var(--space-lg);top:var(--space-lg);font-size:1.5rem;max-width:12ch; }.cover-orbit { width:220px;height:220px;right:-80px;top:-60px;border-width:28px; }.orbit-two { width:160px;height:160px;right:30px;top:50px;border-width:20px; }.scene-content { padding:var(--space-lg) var(--space-sm); }.scene-content h2 { font-size:1.65rem; }.scene-subtitle { font-size:.8rem; }.business-gallery { grid-template-columns:minmax(0,1fr);gap:var(--space-md); }.business-tile { display:grid;grid-template-columns:90px minmax(0,1fr);grid-template-rows:auto auto auto; }.business-tile img { grid-row:1/4;height:100%;min-height:110px;object-fit:cover; }.business-tile>strong { margin-top:var(--space-md);font-size:1.05rem; }.business-tile>span { font-size:.75rem; }.tile-foot { margin-top:var(--space-sm);margin-bottom:var(--space-md); }.tile-foot small { display:block;font-size:.65rem; }.status { font-size:.7rem; }.compact-table>div { grid-template-columns:minmax(0,1fr) auto; }.compact-table>div>span { display:none; }.ui-section-label span { font-size:.65rem; }.scene-caption { display:block; }.scene-caption>span { display:block;text-align:left;margin-top:var(--space-xs); }.scene-caption { font-size:.75rem; }#dashboard-content { min-height:730px; }.desk-layout,.review-scene { grid-template-columns:minmax(0,1fr); }.review-scene { gap:var(--space-lg); }.desk-layout { gap:var(--space-lg); }.focus-note { padding:var(--space-lg); }.relation-map { height:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-sm); }.relation-lines { display:none; }.db-node { position:static;width:100%;min-height:120px;padding:var(--space-md); }.db-node strong { font-size:1.1rem; }.db-node small { font-size:.72rem; }.relation-detail { padding:var(--space-lg); }.relation-detail h3 { font-size:1.6rem; }.relation-row { font-size:.8rem; }.section-heading { margin-bottom:var(--space-xl); }.section-heading p { font-size:var(--text-md); }.view-toolbar { gap:var(--space-md);padding:var(--space-sm);flex-wrap:wrap; }.view-toolbar>span { display:none; }.view-toolbar>strong { font-size:1.2rem; }.view-switch { margin-left:auto; }.view-switch button { padding-inline:var(--space-sm); }.project-board { grid-template-columns:minmax(0,1fr);gap:var(--space-xl); }.mini-cover { height:145px; }.project-item>strong { font-size:1.3rem; }.project-item>p { min-height:0; }.projects-table { font-size:.8rem; }.projects-table th:nth-child(2),.projects-table td:nth-child(2) { display:none; }.projects-table td,.projects-table th { padding:var(--space-sm); }.projects-table th:last-child,.projects-table td:last-child { display:none; }.table-thumb { width:40px;height:32px; }.projects-table button { gap:var(--space-xs); }.review-sheet { padding:var(--space-lg); }.review-sheet h3 { font-size:1.65rem; }.sheet-top { font-size:.7rem; }.formats-section .container { gap:var(--space-xl); }.formats-copy>p { font-size:var(--text-md); }.offer-panel { grid-template-columns:minmax(0,1fr);gap:var(--space-xl); }.offer-action { display:block; }.offer-action p { margin-top:var(--space-lg); }.offer-intro h2 { font-size:2rem; }.faq-section .container { grid-template-columns:minmax(0,1fr);gap:var(--space-xl); }.site-footer .container { flex-direction:column;gap:var(--space-lg); }.dialog-body { padding:var(--space-lg); }.dialog-body h2 { font-size:2rem; }.record-related>div { grid-template-columns:60px minmax(0,1fr);gap:var(--space-sm); }.record-related small { display:none; }.dialog-cover { height:110px; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important;transition:none!important;scroll-behavior:auto!important; }.business-tile:hover,.project-item:hover,.db-node:hover,.key:hover { transform:none; } }

.tour-controls { display:flex;align-items:center;gap:var(--space-lg); }.motion-button { min-height:44px;padding:0;border:0;background:transparent;color:var(--color-muted);font-size:var(--text-xs);text-decoration:underline; }.motion-button:hover { color:var(--color-accent); }html[data-motion=reduce] *,html[data-motion=reduce] *::before,html[data-motion=reduce] *::after { animation:none!important;transition:none!important;scroll-behavior:auto!important; }html[data-motion=reduce] .business-tile:hover,html[data-motion=reduce] .project-item:hover,html[data-motion=reduce] .db-node:hover,html[data-motion=reduce] .key:hover { transform:none; }@media(max-width:40rem) { .tour-controls { justify-content:space-between; } }

/* Brand name supplied by the user; preserve the existing showcase system. */
.brand-sub { font:inherit; }
@media(max-width:40rem) { .site-header .brand-sub { display:block;font-size:.72rem;line-height:1.3;letter-spacing:0; }.site-header .brand-name { line-height:1.1; } }

/* Connected walkthrough: meaningful navigation, linked records and browser-local review. */
html { scroll-behavior:smooth;scroll-padding-top:24px; }
.sr-only { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }
:focus-visible { outline:3px solid var(--color-accent);outline-offset:4px; }
.connections-section :focus-visible { outline-color:var(--color-accent-2); }
button.sidebar-line { width:100%;border:0;background:transparent;text-align:left;color:inherit;min-height:34px; }
button.sidebar-line:hover { background:var(--color-paper-3); }
button.sidebar-line.active { background:var(--color-accent-wash);color:var(--color-accent-deep); }
.workspace-jump { display:none; }
.text-action { border:0;background:transparent;padding:0;min-height:32px;text-align:left;color:inherit;font:inherit;text-decoration:none;line-height:1.4; }
.text-action:hover { color:var(--color-accent);text-decoration:underline; }
.compact-table .text-action { font-weight:500; }
.database-list { margin-top:var(--space-xl);border-top:1px solid var(--color-rule); }
.database-list>div { display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) auto;align-items:center;gap:var(--space-sm);padding-block:var(--space-sm);border-bottom:1px solid var(--color-rule);font-size:var(--text-ui); }
.database-list>div>span:not(.status) { color:var(--color-muted);font-size:var(--text-xs); }
.task-row { display:flex;gap:var(--space-sm);align-items:start;padding-block:var(--space-sm);border-bottom:1px solid var(--color-rule); }
.task-row input { margin-top:9px;flex:none; }
.task-row .text-action { font-size:var(--text-ui); }
.task-row:has(input:checked) .text-action { text-decoration:line-through;color:var(--color-muted); }
.focus-note>.text-action { margin-top:var(--space-lg);color:var(--color-accent-deep); }
.scene-caption>a { flex:none;color:var(--color-ink-2); }
.relation-detail h3 .text-action { font:inherit; }
.relation-detail .text-action:hover { color:var(--color-accent-2); }
.relation-row>.text-action { text-align:right;min-height:30px;max-width:70%; }
.database-open { margin-top:var(--space-lg);color:var(--color-accent-2); }
.project-filter { display:flex;gap:var(--space-sm);align-items:center;margin-left:auto;font-size:var(--text-xs);color:var(--color-muted); }
.project-filter select,.workspace-jump select { max-width:100%;min-height:40px;background:var(--color-ui);color:var(--color-ink);border:1px solid var(--color-rule-2);border-radius:4px;padding:var(--space-xs) var(--space-sm);font-size:var(--text-sm); }
.empty-lane { padding:var(--space-lg);border:1px dashed var(--color-rule-2);font-size:var(--text-sm);color:var(--color-muted);border-radius:6px; }
.review-line { display:block; }
.review-line textarea { display:block;width:100%;resize:vertical;min-height:72px;max-height:240px;margin-top:var(--space-sm);padding:var(--space-sm);border:1px solid var(--color-rule);border-radius:4px;background:var(--color-ui-soft);color:var(--color-ink);font:400 var(--text-sm)/1.5 var(--font-body); }
.review-line textarea::placeholder { color:var(--color-muted); }
.sheet-related button { border:1px solid var(--color-rule);padding:var(--space-xs) var(--space-sm);min-height:36px;border-radius:4px;background:var(--color-paper-2);color:var(--color-ink);font-size:var(--text-xs); }
.sheet-related button:hover { border-color:var(--color-accent); }
.review-save-row { display:flex;gap:var(--space-md);align-items:center;margin-top:var(--space-lg); }
.review-save-row>span { font-size:var(--text-xs);color:var(--color-muted); }
.package-name { margin-block:var(--space-md);font:600 clamp(2rem,3vw,3.5rem)/1.05 var(--font-display);letter-spacing:var(--tracking-display); }
.offer-included a { color:var(--color-ink-2);font-size:var(--text-sm);text-decoration:none;min-height:32px; }
.offer-included a:hover { color:var(--color-accent);text-decoration:underline; }
.offer-detail:not([hidden]) { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-xl);padding-block:var(--space-lg); }
.offer-detail h3 { font-size:1.35rem;color:var(--color-ink); }.offer-detail p { margin-block:var(--space-md); }.offer-detail .text-action { color:var(--color-accent-deep); }
.record-properties .text-action { min-height:26px; }
.record-related>div { align-items:center; }
.record-related .text-action { font-weight:500; }
.record-task { display:flex;gap:var(--space-sm);align-items:center;margin-bottom:var(--space-xl);font-size:var(--text-sm); }
.record-task input { width:20px;height:20px;accent-color:var(--color-accent); }
.focus-business { margin-top:var(--space-xl);white-space:normal; }
.record-reflection { margin-bottom:var(--space-xl);padding:var(--space-lg);background:var(--color-ui-soft);border-radius:6px; }
.record-reflection h3 { font-size:var(--text-sm);margin-bottom:var(--space-sm); }
.record-reflection p { font-size:var(--text-sm);color:var(--color-muted);margin-bottom:var(--space-lg);white-space:pre-wrap;overflow-wrap:anywhere; }
.dialog-body h2 { overflow-wrap:anywhere; }
@media(max-width:60rem) { .view-toolbar { flex-wrap:wrap; }.project-filter { margin-left:0; } }
@media(max-width:40rem) { .workspace-jump { display:flex;align-items:center;gap:var(--space-md);font-size:var(--text-xs);color:var(--color-muted);margin-bottom:var(--space-md); }.workspace-jump select { flex:1; }.database-list>div { grid-template-columns:minmax(0,1fr) auto; }.database-list>div>span:not(.status) { display:none; }.project-filter { width:100%;justify-content:space-between; }.project-filter select { flex:1;max-width:calc(100% - 65px); }.offer-detail:not([hidden]) { grid-template-columns:minmax(0,1fr); }.review-save-row { align-items:start;flex-direction:column; }.scene-caption>a { display:inline-block;margin-top:var(--space-sm); }.compact-table>div { grid-template-columns:minmax(0,1fr) auto; }.record-related>div { grid-template-columns:55px minmax(0,1fr); }.sheet-top { align-items:center; }.sheet-top span:last-child { text-align:right; } }
.review-save-row { flex-wrap:wrap; }
.clear-review { color:var(--color-muted);font-size:var(--text-xs);text-decoration:underline;min-height:40px; }
@media(max-width:40rem) { .review-save-row { flex-direction:row;align-items:center; }.review-save-row>span { flex-basis:100%; } }
.notion-badge { display:inline-flex;align-items:center;gap:12px;margin-bottom:18px;color:var(--color-ink);font:500 var(--text-sm)/1.2 var(--font-body); }
.notion-badge img { width:132px;height:60px;object-fit:contain;flex:none; }
.site-footer .brand-disclaimer { max-width:44ch;font-size:var(--text-xs);line-height:1.5; }
@media(max-width:40rem) { .notion-badge { margin-bottom:16px; } }

.purchase-status { margin-bottom:var(--space-lg);max-width:29ch; }
.purchase-status>span { display:block;font-size:var(--text-xs);margin-bottom:var(--space-xs); }
.purchase-status h3 { font:600 1.25rem/1.3 var(--font-display);margin:0 0 var(--space-sm); }
.purchase-status p { font-size:var(--text-sm);line-height:1.6;margin:0; }
@media(max-width:40rem) { .purchase-status { max-width:none; } }