:root{--color-background: #FFFFFF;--color-foreground: rgba(18, 18, 18, .75);--color-foreground-rgb: 18, 18, 18;--color-heading: rgb(18, 18, 18);--color-body-text: rgb(55, 65, 81);--color-muted: rgba(18, 18, 18, .6);--color-border: rgba(0, 0, 0, .08);--color-border-strong: rgba(0, 0, 0, .15);--color-button-bg: rgb(18, 18, 18);--color-button-text: rgb(255, 255, 255);--color-filter-bg: rgba(0, 0, 0, .02);--font-heading: "Playfair Display", Georgia, serif;--font-ui: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-story: "Poiret One", sans-serif;--font-symbols: -apple-system, BlinkMacSystemFont, "Segoe UI Symbol", "Noto Sans Symbols", sans-serif;--font-size-h1: 45.6px;--font-size-h2: 32px;--font-size-h3: 20.7px;--font-size-body: 19.2px;--font-size-base: 16px;--font-size-small: 15px;--font-size-tiny: 14px;--font-size-micro: 11px;--line-height-tight: 1.15;--line-height-normal: 1.26;--line-height-relaxed: 1.65;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--spacing-3xl: 3.75rem;--graph-padding: 50;--transition-fast: .15s ease;--transition-medium: .2s ease;--transition-slow: .3s ease;--touch-target-min: 44px;--beat-point-radius: 8;--beat-point-radius-hover: 12;--beat-point-radius-active: 14;--border-radius: 0px;--border-radius-pill: 999px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-text-size-adjust:100%}body{font-family:var(--font-ui);background-color:var(--color-background);color:var(--color-foreground);min-height:100vh;min-height:100dvh;line-height:var(--line-height-relaxed);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}#app{display:flex;flex-direction:column;height:100vh;height:100dvh;padding:var(--spacing-xs) 0;padding-bottom:0;max-width:600px;margin:0 auto;transition:transform .4s cubic-bezier(.4,0,.2,1),opacity .4s ease}#app.swiping-up{transform:translateY(-20px);opacity:.8}#app.swiping-down{transform:translateY(20px);opacity:.8}@media (max-height: 700px){#app{padding:2px 0 0}}.header{display:flex;align-items:center;justify-content:space-between;padding:4px 0;flex-shrink:0}@media (max-height: 700px){.header{padding:2px 0}}.header__left{flex:0 0 auto}.header__center{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-align:center}.header__right{flex:0 0 auto;width:32px}.header__back-btn{display:flex;align-items:center;background:none;border:none;color:var(--color-foreground);font-size:1.25rem;cursor:pointer;padding:var(--spacing-xs);opacity:.7}.header__back-btn:hover{opacity:1}.header__back-label{display:none}.header__title{font-family:var(--font-story);font-size:1rem;letter-spacing:.02em;white-space:nowrap}.header__meta{font-family:var(--font-ui);font-size:.75rem;opacity:.7;white-space:nowrap}.header__archetype{font-style:italic}.shape-notation{display:flex;justify-content:center;gap:.75rem;padding:4px 0 0;flex-shrink:0;min-height:32px;align-items:center}@media (max-height: 700px){.shape-notation{padding:2px 0 0;gap:.5rem}}.notation-symbol{font-family:var(--font-symbols);font-size:1.5rem;letter-spacing:.1em;opacity:.4;transition:opacity .2s ease,transform .2s ease;will-change:transform;transform-origin:center center;display:inline-block}.notation-symbol.active{opacity:1;transform:scale(1.1)}.notation-symbol.hidden{opacity:0;pointer-events:none}.graph-container{flex:1 0 auto;max-height:60vh;width:100%;contain:layout size;display:flex;align-items:center;justify-content:center;min-height:0;overflow:visible;padding:8px 0}#story-graph{width:100%!important;height:100%;display:grid;place-items:center;overflow:visible}#story-graph svg{width:auto;height:auto;max-width:100%;max-height:100%;display:block}.description-panel{position:relative;background:#0003;border-radius:8px;padding:var(--spacing-sm);flex:1 1 auto;min-height:90px;max-height:180px;height:auto;overflow:hidden;display:flex;flex-direction:column;margin:8px;transition:transform .3s cubic-bezier(.4,0,.2,1)}.description-panel.swiping-left{transform:translate(-10px)}.description-panel.swiping-right{transform:translate(10px)}@media (max-height: 700px){.description-panel{min-height:80px;max-height:100px;padding:8px}}.description-panel__title{font-family:var(--font-story);font-size:1rem;margin-bottom:4px;letter-spacing:.02em;flex-shrink:0}.description-panel__text{font-family:var(--font-ui);font-size:.8125rem;line-height:1.4;opacity:.9;flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch}.description-panel__text::-webkit-scrollbar{width:4px}.description-panel__text::-webkit-scrollbar-track{background:transparent}.description-panel__text::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:2px}.actions{display:flex;justify-content:center;align-items:center;gap:var(--spacing-lg);padding:8px 0;flex-shrink:0;border-top:1px solid rgba(255,255,255,.1);margin-top:4px}@media (max-height: 700px){.actions{padding:6px 0;gap:var(--spacing-md)}}.action-btn{display:flex;align-items:center;justify-content:center;background:none;border:none;color:var(--color-foreground);padding:var(--spacing-xs);cursor:pointer;transition:opacity var(--transition-fast);text-decoration:none;opacity:.7}.action-btn:hover,.action-btn:active{opacity:1}.action-btn[data-tooltip]{position:relative}.action-btn[data-tooltip]:after{content:attr(data-tooltip);position:absolute;bottom:100%;left:50%;transform:translate(-50%);padding:4px 8px;background:#000c;color:#fff;font-family:var(--font-ui);font-size:.75rem;font-weight:500;white-space:nowrap;border-radius:4px;opacity:0;visibility:hidden;transition:opacity .15s ease,visibility .15s ease;pointer-events:none;margin-bottom:6px}@media (min-width: 1024px) and (hover: hover){.action-btn[data-tooltip]:hover:after{opacity:1;visibility:visible}}.action-icon{width:22px;height:22px}.action-label,.pause-icon,.action-btn.playing .play-icon{display:none}.action-btn.playing .pause-icon{display:block}.action-btn--speed{display:flex;flex-direction:column;gap:2px;padding:4px 8px;min-width:44px;align-items:center}.speed-icon{width:18px;height:18px}.speed-label{font-family:var(--font-ui);font-size:.625rem;font-weight:600;line-height:1;letter-spacing:.02em;opacity:.9;-webkit-user-select:none;user-select:none}@media (min-width: 768px){.speed-icon{width:20px;height:20px}.speed-label{font-size:.6875rem}}.hidden{display:none!important}.story-info{display:none}.toast{position:fixed;bottom:80px;left:50%;transform:translate(-50%) translateY(100px);background:var(--color-foreground);color:var(--color-background);padding:var(--spacing-sm) var(--spacing-md);border-radius:8px;font-size:.8125rem;opacity:0;transition:all var(--transition-medium);z-index:1000}.toast.visible{transform:translate(-50%) translateY(0);opacity:1}.beat-group{transition:opacity .3s ease,fill .3s ease;cursor:pointer}.beat-group.active{opacity:1}.beat-group.dimmed{opacity:.3}.app-loading,.story-loading{display:flex;align-items:center;justify-content:center;min-height:100vh;min-height:100dvh;background:var(--color-background);color:var(--color-foreground);font-family:var(--font-ui)}.error-message,.story-error{text-align:center;padding:var(--spacing-xl);opacity:.7}.story-error{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;min-height:100dvh;background:var(--color-background);color:var(--color-foreground);font-family:var(--font-ui)}.story-error__detail{font-size:.875rem;opacity:.6;margin:var(--spacing-sm) 0 var(--spacing-lg)}.story-error button{padding:var(--spacing-sm) var(--spacing-lg);background:var(--color-button-bg);color:var(--color-button-text);border:none;border-radius:var(--border-radius);cursor:pointer;font-family:var(--font-ui);font-size:var(--font-size-small)}@media (min-width: 768px){#app{padding:var(--spacing-lg)}.header{padding:var(--spacing-sm) 0;margin-bottom:var(--spacing-sm)}.header__center{flex-direction:column;gap:var(--spacing-xs)}.header__back-label{display:inline;font-size:.875rem;margin-left:4px}.header__back-btn{font-size:1rem}.header__title{font-size:1.5rem;letter-spacing:.03em}.header__meta{font-size:.875rem}.shape-notation{padding:var(--spacing-sm) 0}.notation-arrows{font-size:2rem}.graph-container{padding:var(--spacing-md) 0}.description-panel{padding:var(--spacing-lg);min-height:120px;max-height:200px;height:auto}.description-panel__title{font-size:1.25rem;margin-bottom:var(--spacing-sm)}.description-panel__text{font-size:.9375rem;line-height:1.6}.story-info{display:block;text-align:center;padding:var(--spacing-md) 0;border-top:1px solid var(--color-muted);margin-top:var(--spacing-md)}.story-info__title{font-family:var(--font-story);font-size:1.5rem;letter-spacing:.05em;margin-bottom:var(--spacing-xs)}.story-info__meta{font-family:var(--font-ui);font-size:.875rem;opacity:.7}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media (min-width: 1024px){#app.story-viewer{max-width:1400px;width:100%;padding:var(--spacing-lg) var(--spacing-xl);height:100vh;height:100dvh;display:grid;grid-template-areas:"header header" "notation description" "graph description" "graph actions" "graph info";grid-template-columns:minmax(0,1fr) 380px;grid-template-rows:auto auto 1fr auto auto;gap:var(--spacing-md)}#app.story-viewer .header{grid-area:header;max-width:none;padding:var(--spacing-md) 0;margin-bottom:0}#app.story-viewer .graph-container{grid-area:graph;max-height:none;height:100%;min-height:400px;min-width:0;padding:var(--spacing-md);padding-right:var(--spacing-xl);overflow:hidden}#app.story-viewer #story-graph{width:100%;height:100%}#app.story-viewer #story-graph svg{max-width:100%;max-height:100%}#app.story-viewer .shape-notation{grid-area:notation;justify-content:center;padding:var(--spacing-sm) 0;background:none;border-radius:0;margin:0}#app.story-viewer .description-panel{grid-area:description;margin:0;border-radius:var(--radius-lg) var(--radius-lg) 0 0;min-height:auto;max-height:none;background:#00000026}#app.story-viewer .actions{grid-area:actions;justify-content:center;background:#00000026;margin:0;padding:var(--spacing-md);border-top:none}#app.story-viewer .story-info{grid-area:info;text-align:left;padding:var(--spacing-md);background:#00000026;border-radius:0 0 var(--radius-lg) var(--radius-lg);border-top:1px solid rgba(255,255,255,.1);margin-top:0;overflow:hidden}#app.story-viewer .story-info__title{font-size:1.125rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#app.story-viewer .story-info__meta{font-size:.8125rem}.beat-group{cursor:pointer;transition:opacity .15s ease}.beat-group.hovered{opacity:1!important}.beat-group.dimmed:not(.hovered){opacity:.3}}.header-wrapper{--header-height: 110px;background:var(--color-background);position:sticky;top:0;z-index:200;margin-top:calc(-1 * var(--spacing-md));margin-left:calc(-1 * var(--spacing-md));margin-right:calc(-1 * var(--spacing-md));width:calc(100% + 2 * var(--spacing-md))}.site-nav{display:grid;grid-template-areas:"left-icons heading icons";grid-template-columns:1fr 2fr 1fr;align-items:center;padding:4px 30px 6px;max-width:1200px;margin:0 auto}.site-nav__logo{grid-area:heading;display:inline-flex;align-items:center;justify-self:center;text-align:center;z-index:1;position:relative}.site-nav__logo img{height:100px;width:auto;max-width:150px}.site-nav__menu-toggle{display:flex;align-items:center;justify-content:center;width:44px;height:44px;background:transparent;border:none;color:var(--color-foreground);cursor:pointer;padding:0}.site-nav__menu-toggle:hover{color:var(--color-heading)}.site-nav__menu-toggle svg{width:22px;height:22px}.site-nav__links{grid-area:heading;display:none;gap:0;align-items:center;margin-left:2rem}.site-nav__links a,.site-nav__active{font-family:var(--font-ui);font-size:14px;font-weight:400;letter-spacing:.6px;color:#121212bf;-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto;text-decoration:none;transition:color var(--transition-fast);padding:12px;line-height:1.3}.site-nav__links a:hover{color:#121212;text-decoration:underline;text-underline-offset:.3rem}.site-nav__active{color:#121212bf;font-weight:400;text-decoration:underline;text-underline-offset:.3rem}.site-nav__icons{grid-area:icons;justify-self:end;display:flex;align-items:center}.site-nav__icon{display:flex;align-items:center;justify-content:center;width:44px;height:44px;color:var(--color-foreground);text-decoration:none;padding:0}.site-nav__icon:hover svg{transform:scale(1.07)}.site-nav__icon svg{width:20px;height:20px;transition:transform .1s ease}.site-nav__icon--cart svg{width:44px;height:44px}.site-nav__icon--cart{margin-right:-12px}.menu-drawer-container{grid-area:left-icons;justify-self:start;margin-left:-12px}.menu-drawer-container summary{list-style:none}.menu-drawer-container summary::-webkit-details-marker{display:none}.menu-drawer-container>summary:before{content:"";position:fixed;cursor:default;width:100%;height:calc(100vh - var(--header-height, 64px));top:var(--header-height, 64px);left:0;background:rgba(var(--color-foreground-rgb),.5);opacity:0;visibility:hidden;z-index:99;transition:opacity 0s,visibility 0s}.menu-drawer-container[open]>summary:before{visibility:visible;opacity:1;transition:opacity .3s ease,visibility .3s ease}.menu-drawer{position:fixed;transform:translate(-100%);visibility:hidden;z-index:100;left:0;top:var(--header-height, 64px);width:100%;padding-top:0;background-color:#f3f3f3;overflow-x:hidden;overflow-y:auto;height:calc(100vh - var(--header-height, 64px))}.menu-drawer-container[open]>.menu-drawer{transform:translate(0);visibility:visible;transition:transform .3s ease,visibility .3s ease}.menu-drawer__navigation{padding:3rem 0}.menu-drawer__menu{list-style:none;padding:0;margin:0}.menu-drawer__menu li{margin-bottom:.2rem}.menu-drawer__menu-item{display:block;padding:11px 30px;text-decoration:none;font-family:var(--font-ui);font-size:18px;color:var(--color-foreground);transition:background-color .2s ease,color .2s ease}.menu-drawer__menu-item:hover{color:rgb(var(--color-foreground-rgb));background-color:rgba(var(--color-foreground-rgb),.04)}.menu-drawer__menu-item--active{color:var(--color-heading);background-color:rgba(var(--color-foreground-rgb),.04)}.menu-drawer__menu-item--active:hover{background-color:rgba(var(--color-foreground-rgb),.08)}@media screen and (min-width: 750px){.menu-drawer{width:400px;border-right:1px solid rgba(var(--color-foreground-rgb),.08)}}.site-nav__menu-toggle .menu-icon-hamburger{display:block}.site-nav__menu-toggle .menu-icon-close,.menu-drawer-container[open] .menu-icon-hamburger{display:none}.menu-drawer-container[open] .menu-icon-close{display:block}@media (min-width: 990px){.header-wrapper{--header-height: 140px}.site-nav{grid-template-areas:"navigation heading icons";grid-template-columns:1fr auto 1fr;column-gap:2rem;padding-top:8px;padding-bottom:12px;max-width:1400px}.site-nav__links{grid-area:navigation;display:flex;justify-self:start;margin-left:0}.site-nav__logo{grid-area:heading;justify-self:center}.site-nav__logo img{height:200px;max-width:none}.site-nav__icons{justify-self:end}.menu-drawer-container{display:none}}@media (min-width: 750px) and (max-width: 989px){.site-nav{padding-left:3rem;padding-right:3rem}}.explore{min-height:100vh;min-height:100dvh;background-color:var(--color-background);color:var(--color-foreground);padding:var(--spacing-md)}.explore__header{text-align:center;padding:var(--spacing-sm) 0 var(--spacing-md);margin-bottom:var(--spacing-md);max-width:800px;margin-left:auto;margin-right:auto}.explore__title{font-family:var(--font-heading);font-size:1.75rem;font-weight:600;letter-spacing:.02em;color:var(--color-heading);margin-bottom:var(--spacing-xs);line-height:var(--line-height-tight)}.explore__subtitle{font-family:var(--font-ui);font-size:var(--font-size-body);color:var(--color-foreground);line-height:var(--line-height-relaxed);max-width:600px;margin:0 auto}.explore__count{font-family:var(--font-ui);font-size:var(--font-size-tiny);color:var(--color-muted)}.explore__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-md);max-width:1200px;margin:0 auto}@media (min-width: 480px){.explore__grid{gap:var(--spacing-lg)}}@media (min-width: 768px){.explore__grid{grid-template-columns:repeat(3,1fr)}.explore__title{font-size:2rem}.explore__subtitle{font-size:1rem}}@media (min-width: 1024px){.explore__grid{grid-template-columns:repeat(2,1fr);max-width:1400px;gap:var(--spacing-xl)}}@media (min-width: 1600px){.explore__grid{grid-template-columns:repeat(3,1fr);max-width:1800px}}.story-card{background:var(--color-background);border:1px solid var(--color-border);border-radius:var(--border-radius);overflow:hidden;cursor:pointer;transition:transform var(--transition-medium) ease,box-shadow var(--transition-medium) ease;display:flex;flex-direction:column}.story-card:hover,.story-card:focus{transform:translateY(-4px);box-shadow:0 8px 16px #0000001a;outline:none}.story-card:focus-visible{outline:2px solid var(--color-heading);outline-offset:2px}.story-card:active{transform:translateY(-2px)}.story-card__swatch{height:120px;background:var(--card-bg, #2B4F72);position:relative}.story-card__swatch:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,rgba(255,255,255,.05) 0%,transparent 50%,rgba(0,0,0,.1) 100%)}.story-card__cover{width:100%;height:100%;object-fit:cover;object-position:center;display:block}.story-card__content{padding:20px;background:var(--color-background);flex:1;display:flex;flex-direction:column}.story-card__title{font-family:var(--font-heading);font-size:var(--font-size-h3);font-weight:400;color:var(--color-heading);margin-bottom:8px;line-height:var(--line-height-normal);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.story-card__author{font-family:var(--font-ui);font-size:var(--font-size-base);color:var(--color-body-text);margin-bottom:4px}.story-card__protagonist{font-family:var(--font-ui);font-size:var(--font-size-tiny);color:var(--color-muted);font-style:italic;margin-bottom:var(--spacing-md)}.story-card__meta{margin-top:auto;display:flex;flex-direction:column;align-items:flex-start;gap:8px}.story-card__notation{font-family:var(--font-symbols);font-size:16px;color:var(--color-heading);letter-spacing:.05em;line-height:1}.story-card__archetype{font-family:var(--font-ui);font-size:var(--font-size-micro);color:var(--color-muted);text-transform:uppercase;letter-spacing:.05em;font-style:italic}.explore__loading,.explore__error{text-align:center;padding:var(--spacing-xl);color:var(--color-foreground)}.explore__error button{margin-top:var(--spacing-md);padding:var(--spacing-sm) var(--spacing-lg);background:var(--color-button-bg);color:var(--color-button-text);border:none;border-radius:var(--border-radius);cursor:pointer;font-family:var(--font-ui);font-size:var(--font-size-small);transition:opacity var(--transition-fast)}.explore__error button:hover{opacity:.85}.explore__footer{text-align:center;padding:var(--spacing-3xl) 0 var(--spacing-xl);margin-top:var(--spacing-3xl);border-top:1px solid var(--color-border)}.explore__footer p{font-family:var(--font-ui);font-size:var(--font-size-base);color:var(--color-muted);margin-bottom:var(--spacing-md);line-height:var(--line-height-relaxed)}.explore__footer a{color:var(--color-foreground);font-size:var(--font-size-small);text-decoration:none;font-family:var(--font-ui);transition:color var(--transition-fast)}.explore__footer a:hover{color:var(--color-heading)}@media (min-width: 768px){.explore{padding:var(--spacing-lg) 50px;margin-top:calc(-1 * var(--spacing-lg));padding-top:0}.header-wrapper{margin-top:0;margin-left:-50px;margin-right:-50px;width:calc(100% + 100px)}.explore__header{padding:var(--spacing-sm) 0 var(--spacing-md)}.explore__title{font-size:2rem}.story-card__swatch{height:120px}.story-card__content{padding:20px}.story-card__title{font-size:var(--font-size-h3)}.story-card__author{font-size:var(--font-size-base)}.story-card__protagonist{font-size:var(--font-size-tiny)}.story-card__notation{font-size:16px}.story-card__archetype{font-size:var(--font-size-micro)}}@media (min-width: 1024px){.explore{width:100vw;max-width:none;margin-left:calc(-50vw + 50%);margin-right:calc(-50vw + 50%);padding-left:max(50px,calc((100vw - 1400px)/2 + 50px));padding-right:max(50px,calc((100vw - 1400px)/2 + 50px))}.story-card{flex-direction:row;align-items:stretch}.story-card__swatch{width:120px;min-width:120px;max-width:120px;height:auto;min-height:160px;flex-shrink:0}.story-card__cover{width:100%;height:100%;object-fit:cover}.story-card__content{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;padding:var(--spacing-lg);overflow:visible}.story-card__title{font-size:1.25rem;margin-bottom:var(--spacing-sm);-webkit-line-clamp:unset;overflow:visible;display:block}.story-card__author{margin-bottom:2px}.story-card__protagonist{margin-bottom:var(--spacing-md)}.story-card__meta{flex-direction:row;align-items:center;gap:var(--spacing-md);margin-top:auto}}.mobile-only{display:inline}.desktop-only{display:none}@media (min-width: 768px){.mobile-only{display:none}.desktop-only{display:inline}}.filter-bar{position:sticky;top:0;z-index:10;background:var(--color-filter-bg);padding:var(--spacing-md);margin-bottom:var(--spacing-lg);border:1px solid var(--color-border);border-radius:var(--border-radius)}.filter-bar__controls{display:flex;flex-direction:row;align-items:center;gap:var(--spacing-sm)}.filter-bar__actions{display:flex;gap:var(--spacing-sm);flex-shrink:0}.filter-bar__search{flex:1;min-width:0;padding:12px 16px;background:var(--color-background);border:1px solid var(--color-border-strong);border-radius:var(--border-radius);color:var(--color-foreground);font-family:var(--font-ui);font-size:var(--font-size-base);line-height:1.5;transition:var(--transition-fast);min-height:var(--touch-target-min)}.filter-bar__search:focus{outline:none;border-color:var(--color-heading);background:var(--color-background)}.filter-bar__search::placeholder{color:var(--color-muted)}.filter-bar__search::-webkit-search-cancel-button{-webkit-appearance:none;-moz-appearance:none;appearance:none}.filter-bar__author{width:100%;padding:var(--spacing-sm) var(--spacing-md);background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#f5f5f5;font-family:var(--font-ui);font-size:.875rem;cursor:pointer;transition:var(--transition-fast);min-height:var(--touch-target-min)}.filter-bar__author:focus{outline:none;border-color:#ffffff4d;background:#ffffff14}.filter-bar__author option{background:#1a1a1a;color:#f5f5f5}.filter-bar__filters-btn{display:flex;align-items:center;gap:6px;padding:12px 30px;background:var(--color-button-bg);border:none;border-radius:var(--border-radius);color:var(--color-button-text);font-family:var(--font-ui);font-size:var(--font-size-small);font-weight:400;cursor:pointer;transition:opacity var(--transition-fast);min-height:var(--touch-target-min);white-space:nowrap}.filter-bar__filters-btn svg{flex-shrink:0}.filter-bar__filters-btn:hover,.filter-bar__filters-btn:focus{opacity:.85;outline:none}.filter-bar__filters-btn:active{transform:scale(.98)}.filter-bar__count-badge{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;background:#ffffff4d;border-radius:10px;font-size:.75rem;font-weight:600;line-height:1}.filter-bar__clear{padding:var(--spacing-sm) var(--spacing-md);background:transparent;border:1px solid var(--color-border-strong);border-radius:var(--border-radius);color:var(--color-foreground);font-family:var(--font-ui);font-size:var(--font-size-tiny);cursor:pointer;transition:var(--transition-fast);min-height:var(--touch-target-min)}.filter-bar__clear:hover,.filter-bar__clear:focus{color:var(--color-heading);border-color:var(--color-heading);background:var(--color-filter-bg);outline:none}.filter-bar__clear:active{transform:scale(.98)}.filter-bar__count{font-family:var(--font-ui);font-size:var(--font-size-tiny);color:var(--color-muted);text-align:center;margin-top:var(--spacing-xs);margin-bottom:0}.filter-bar__active-filters{display:flex;flex-wrap:wrap;gap:var(--spacing-xs);margin-top:var(--spacing-sm)}.filter-chip{display:inline-flex;align-items:center;gap:var(--spacing-xs);padding:6px 12px;background:var(--color-background);border:1px solid var(--color-border-strong);border-radius:var(--border-radius-pill);font-family:var(--font-ui);font-size:var(--font-size-tiny);color:var(--color-foreground);animation:chipSlideIn .2s ease}.filter-chip__remove{display:flex;align-items:center;justify-content:center;width:18px;height:18px;padding:0;background:transparent;border:none;border-radius:50%;color:var(--color-heading);font-size:1.125rem;line-height:1;cursor:pointer;transition:var(--transition-fast)}.filter-chip__remove:hover,.filter-chip__remove:focus{background:var(--color-filter-bg);outline:none}.filter-chip__remove:active{transform:scale(.9)}@media (min-width: 768px){.filter-bar{padding:var(--spacing-lg)}.filter-bar__search{font-size:.875rem}.filter-bar__count{text-align:right;font-size:.875rem}}.filters-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:250;display:none;align-items:center;justify-content:center;padding:var(--spacing-md)}.filters-modal.is-visible{display:flex}.filters-modal__overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#000000bf;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:fadeIn .2s ease}.filters-modal__content{position:relative;background:var(--color-background);border:1px solid var(--color-border);border-radius:var(--border-radius);padding:var(--spacing-lg);max-width:400px;width:100%;max-height:80vh;overflow-y:auto;box-shadow:0 20px 60px #00000026;animation:slideUp .3s ease}.filters-modal__title{font-family:var(--font-heading);font-size:1.25rem;font-weight:600;color:var(--color-heading);margin:0 0 var(--spacing-md) 0}.filters-modal__section{margin-bottom:var(--spacing-lg)}.filters-modal__section:last-of-type{margin-bottom:var(--spacing-lg)}.filters-modal__section-title{font-family:var(--font-ui);font-size:.875rem;font-weight:600;color:var(--color-muted);text-transform:uppercase;letter-spacing:.5px;margin:0 0 var(--spacing-sm) 0}.filters-modal__author{width:100%;padding:var(--spacing-sm) var(--spacing-md);background:var(--color-background);border:1px solid var(--color-border-strong);border-radius:var(--border-radius);color:var(--color-foreground);font-family:var(--font-ui);font-size:.875rem;cursor:pointer;transition:var(--transition-fast);min-height:var(--touch-target-min)}.filters-modal__author:focus{outline:none;border-color:var(--color-heading);background:var(--color-background)}.filters-modal__author option{background:var(--color-background);color:var(--color-foreground)}.filters-modal__options{display:flex;flex-direction:column;gap:var(--spacing-xs)}.filters-modal__option{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm);border-radius:var(--border-radius);cursor:pointer;transition:var(--transition-fast);min-height:var(--touch-target-min);-webkit-tap-highlight-color:transparent}.filters-modal__option:hover{background:var(--color-filter-bg)}.filters-modal__option:has(input:focus-visible){outline:2px solid var(--color-heading);outline-offset:2px}.filters-modal__option input[type=checkbox]{width:20px;height:20px;margin:0;cursor:pointer;accent-color:var(--color-heading)}.filters-modal__option span{font-family:var(--font-ui);font-size:.9375rem;color:var(--color-foreground);-webkit-user-select:none;user-select:none}.filters-modal__close{width:100%;padding:var(--spacing-sm) var(--spacing-md);background:var(--color-button-bg);border:none;border-radius:var(--border-radius);color:var(--color-button-text);font-family:var(--font-ui);font-size:.9375rem;font-weight:400;cursor:pointer;transition:opacity var(--transition-fast);min-height:var(--touch-target-min)}.filters-modal__close:hover,.filters-modal__close:focus{opacity:.85;outline:none}.filters-modal__close:active{transform:scale(.98)}@media (max-width: 767px){.filters-modal{align-items:flex-end;padding:0}.filters-modal__content{max-width:none;border-bottom-left-radius:0;border-bottom-right-radius:0;animation:slideUpFromBottom .3s ease}}.explore__grid--empty{display:flex;justify-content:center;align-items:center;min-height:400px}.explore__empty{text-align:center;padding:var(--spacing-xl);max-width:400px}.explore__empty-icon{font-size:3rem;margin:0 0 var(--spacing-md) 0}.explore__empty-title{font-family:var(--font-heading);font-size:1.25rem;font-weight:600;color:var(--color-heading);margin:0 0 var(--spacing-sm) 0}.explore__empty-description{font-family:var(--font-ui);font-size:.9375rem;line-height:1.6;color:var(--color-muted);margin:0 0 var(--spacing-lg) 0}.explore__empty-button{padding:var(--spacing-sm) var(--spacing-lg);background:var(--color-button-bg);border:none;border-radius:var(--border-radius);color:var(--color-button-text);font-family:var(--font-ui);font-size:.875rem;font-weight:400;cursor:pointer;transition:opacity var(--transition-fast);min-height:var(--touch-target-min)}.explore__empty-button:hover,.explore__empty-button:focus{opacity:.85;outline:none}.explore__empty-button:active{transform:scale(.98)}@keyframes chipSlideIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@media (prefers-reduced-motion: reduce){.filters-modal__overlay,.filters-modal__content,.filter-chip{animation:none}.filter-bar__search,.filter-bar__filters-btn,.filter-bar__clear,.filter-chip__remove,.filters-modal__author,.filters-modal__option,.filters-modal__close,.explore__empty-button{transition:none}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.filter-bar__search:focus-visible,.filter-bar__filters-btn:focus-visible,.filter-bar__clear:focus-visible,.filter-chip__remove:focus-visible,.filters-modal__author:focus-visible,.filters-modal__close:focus-visible,.explore__empty-button:focus-visible{outline:2px solid var(--color-heading);outline-offset:2px}.info-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:none;align-items:center;justify-content:center;padding:var(--spacing-md)}.info-modal.is-visible{display:flex}.info-modal__overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#000000bf;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:fadeIn .2s ease}.info-modal__content{position:relative;background:var(--color-background);border:1px solid var(--color-border);border-radius:var(--border-radius);padding:var(--spacing-lg);max-width:380px;width:100%;max-height:85vh;overflow-y:auto;box-shadow:0 20px 60px #00000026;animation:slideUp .3s ease}.info-modal__close-btn{position:absolute;top:var(--spacing-sm);right:var(--spacing-sm);display:flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;background:transparent;border:none;border-radius:50%;color:var(--color-muted);cursor:pointer;transition:var(--transition-fast)}.info-modal__close-btn:hover,.info-modal__close-btn:focus{color:var(--color-foreground);background:var(--color-filter-bg);outline:none}.info-modal__close-btn:focus-visible{outline:2px solid var(--color-foreground);outline-offset:2px}.info-modal__title{font-family:var(--font-heading);font-size:1.375rem;font-weight:500;color:var(--color-foreground);margin:0 0 var(--spacing-sm) 0;padding-right:32px}.info-modal__intro{font-family:var(--font-ui);font-size:var(--font-size-small);line-height:1.6;color:var(--color-foreground);margin:0 0 var(--spacing-lg) 0}.info-modal__section{margin-bottom:var(--spacing-lg)}.info-modal__section:last-of-type{margin-bottom:var(--spacing-lg)}.info-modal__section-title{font-family:var(--font-ui);font-size:.75rem;font-weight:600;color:var(--color-muted);text-transform:uppercase;letter-spacing:.5px;margin:0 0 var(--spacing-sm) 0}.info-modal__legend{display:flex;flex-direction:column;gap:var(--spacing-xs)}.info-modal__axis{display:flex;align-items:baseline;gap:var(--spacing-sm)}.info-modal__axis-label{font-family:var(--font-ui);font-size:var(--font-size-tiny);font-weight:500;color:var(--color-foreground);min-width:50px}.info-modal__axis-value{font-family:var(--font-ui);font-size:var(--font-size-tiny);color:var(--color-foreground)}.info-modal__axis-value .arrow-up{color:#16a34a}.info-modal__axis-value .arrow-down{color:#dc2626}.info-modal__symbols{display:flex;flex-direction:column;gap:var(--spacing-xs)}.info-modal__symbol{display:flex;align-items:center;gap:var(--spacing-sm)}.info-modal__symbol-icon{font-family:var(--font-symbols);font-size:1.25rem;width:28px;text-align:center;color:var(--color-foreground)}.info-modal__symbol-desc{font-family:var(--font-ui);font-size:var(--font-size-tiny);color:var(--color-foreground)}.info-modal__symbol-note{font-family:var(--font-ui);font-size:var(--font-size-micro);font-style:italic;color:var(--color-muted);margin:var(--spacing-xs) 0 0 0}.info-modal__section--archetype{background:var(--color-filter-bg);margin-left:calc(-1 * var(--spacing-lg));margin-right:calc(-1 * var(--spacing-lg));padding:var(--spacing-md) var(--spacing-lg)}.info-modal__archetype{display:flex;align-items:baseline;gap:var(--spacing-sm);margin-bottom:var(--spacing-xs)}.info-modal__archetype-name{font-family:var(--font-heading);font-size:1.125rem;font-weight:500;color:var(--color-foreground)}.info-modal__archetype-notation{font-family:var(--font-symbols);font-size:1rem;color:var(--color-foreground);letter-spacing:2px}.info-modal__archetype-desc{font-family:var(--font-ui);font-size:var(--font-size-tiny);line-height:1.5;color:var(--color-foreground);margin:0}.info-modal__learn-more{display:inline-flex;align-items:center;gap:var(--spacing-xs);font-family:var(--font-ui);font-size:var(--font-size-tiny);color:var(--color-foreground);text-decoration:none;transition:var(--transition-fast)}.info-modal__learn-more:hover,.info-modal__learn-more:focus{opacity:.7;outline:none}.info-modal__learn-more:focus-visible{outline:2px solid var(--color-foreground);outline-offset:2px}.info-modal__learn-more svg{flex-shrink:0}@media (max-width: 767px){.info-modal{align-items:flex-end;padding:0}.info-modal__content{max-width:none;max-height:90vh;border-bottom-left-radius:0;border-bottom-right-radius:0;animation:slideUpFromBottom .3s ease}.info-modal__section--archetype{margin-left:calc(-1 * var(--spacing-lg));margin-right:calc(-1 * var(--spacing-lg))}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUpFromBottom{0%{transform:translateY(100%)}to{transform:translateY(0)}}@media (prefers-reduced-motion: reduce){.info-modal__overlay,.info-modal__content{animation:none}.info-modal__close-btn,.info-modal__learn-more{transition:none}}.info-modal__close-btn:focus-visible,.info-modal__learn-more:focus-visible{outline:2px solid var(--color-foreground);outline-offset:2px}