/* Demo v4: local directory and portrait cards. Load after existing styles. */
.library-filters.v4-directory-filters{display:block;padding:32px 0 25px;margin-bottom:5px;border-bottom:1px solid #ffe1c9}
.v4-filter-intro{display:grid;grid-template-columns:1fr auto;gap:8px 24px;margin-bottom:22px;align-items:end}
.v4-filter-intro>span{grid-column:1/-1;font-size:9px;font-weight:700;letter-spacing:2.2px;color:#d75a14}
.v4-filter-intro>strong{font-size:22px;line-height:1.45;color:#15213a;font-weight:750;letter-spacing:-.5px}
.v4-filter-intro>p{font-size:11px;line-height:1.8;color:#5f6f88}
.v4-filter-controls{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;gap:12px;align-items:end}
.v4-filter-controls>label{display:flex;flex-direction:column;font-size:10px;gap:9px;color:#687992;min-width:0}
.v4-filter-controls select{width:100%;min-width:0;height:48px;border:1px solid #ffdcc0;border-radius:9px;padding:11px 13px;background:#fffaf5;color:#28324a;font-size:12px;box-shadow:0 2px 5px #b56a1710;transition:border-color .2s,box-shadow .2s}
.v4-filter-controls select:focus-visible{outline:2px solid #ff6a1b;outline-offset:3px}
.v4-filter-controls select:hover{border-color:#ffad70}
.v4-filter-controls>.button{height:48px;min-height:48px;padding:10px 18px;border-color:#ffcaa3;background:transparent;color:#a75c26;white-space:nowrap;box-shadow:none}
.v4-filter-status{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:17px 0 0;color:#5f6f88;font-size:10px;line-height:1.8}
.v4-filter-status>p{margin:0}
.v4-filter-status>span{flex-shrink:0;color:#15213a;font-variant-numeric:tabular-nums;font-weight:700}
.v4-teacher-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.v4-teacher-grid .v4-teacher-card{display:flex;flex-direction:column;border:1px solid #ffe2cc;border-radius:14px;background:#fffaf5;box-shadow:0 3px 9px #a05b1804;transition:transform .38s cubic-bezier(.22,1,.36,1),box-shadow .38s,border-color .38s}
.v4-teacher-grid .v4-teacher-card:hover{transform:translateY(-7px);border-color:#ffc68f;box-shadow:0 18px 42px #c56a1414}
.v4-teacher-grid .v4-teacher-portrait{height:230px;flex-shrink:0;isolation:isolate;background:#fff1e6}
.v4-teacher-portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 22%;transition:transform .85s cubic-bezier(.22,1,.36,1),filter .65s}
.v4-teacher-grid .v4-teacher-card:hover .v4-teacher-portrait img{transform:scale(1.045)}
.v4-teacher-grid .v4-teacher-portrait:after{inset:35% 0 0;background:linear-gradient(transparent,#3d2a199c)}
.v4-teacher-portrait .portrait-city{font-size:11px;font-weight:600;bottom:17px;left:21px;letter-spacing:.8px}
.v4-teacher-portrait .grade-badge{top:17px;left:18px;z-index:2;backdrop-filter:blur(12px)}
.v4-teacher-portrait .photo-label{font-size:8px;right:15px;top:17px;bottom:auto;color:#fff;background:#39250f33;padding:4px 6px;border-radius:3px;z-index:2}
.v4-card-number{position:absolute;right:19px;bottom:10px;z-index:1;font-family:Arial,sans-serif;font-size:48px;font-weight:700;letter-spacing:-3px;line-height:1;color:#ffffff42}
.v4-teacher-grid .v4-teacher-info{padding:24px 23px 18px;display:flex;flex-direction:column;flex:1}
.v4-teacher-info .teacher-name h3{font-size:25px;line-height:1.3;color:#15213a;letter-spacing:-.6px}
.v4-teacher-info .teacher-name>span{font-size:8px;letter-spacing:.8px;color:#8c98a9}
.v4-teacher-info .v4-teacher-company{font-size:11px;color:#687992;margin:8px 0 0;line-height:1.8;min-height:0}
.v4-card-subject{margin-top:24px}
.v4-card-subject>span{display:block;color:#a95522;font-size:9px;letter-spacing:.6px;font-weight:700}
.v4-card-subject>h4{color:#15213a;font-size:18px;line-height:1.65;margin:8px 0 0;min-height:60px;font-weight:750;letter-spacing:-.3px}
.v4-card-audience{display:flex;flex-direction:column;gap:5px;margin:17px 0 0;color:#5f6f88;font-size:11px;line-height:1.85}
.v4-card-audience>span{font-size:9px;color:#8e99ab}
.v4-card-meta{display:flex;flex-wrap:wrap;gap:5px 8px;margin:16px 0 21px;color:#8792a5;font-size:9px;line-height:1.5}
.v4-card-meta>span{padding:5px 7px;background:#fff8f0;border:1px solid #ffe8d5;border-radius:4px}
.v4-teacher-info .v4-teacher-actions{margin-top:auto;padding-top:16px;border-top:1px solid #ffe7d5;gap:10px;min-height:51px}
.v4-teacher-info .v4-teacher-actions>button:first-child{display:flex;align-items:center;gap:15px;color:#df5e19;font-size:12px;font-weight:750;flex:1;justify-content:space-between;padding:7px 0}
.v4-teacher-actions>button:first-child>span{font-size:19px;transition:transform .3s}
.v4-teacher-actions>button:first-child:hover>span{transform:translate(3px,-3px)}
.v4-teacher-info .v4-teacher-actions>button:last-child{flex-shrink:0;border:0;border-left:1px solid #ffe1c7;border-radius:0;padding:5px 0 5px 13px;font-size:9px;color:#7c879a;background:none}
@media(max-width:1050px){.v4-filter-intro{grid-template-columns:1fr}.v4-filter-intro>strong{font-size:20px}.v4-filter-controls{grid-template-columns:repeat(4,minmax(0,1fr))}.v4-filter-controls>.button{grid-column:1/-1;justify-self:end;height:38px;min-height:38px;padding:7px 15px}.v4-teacher-grid{gap:18px}.v4-teacher-grid .v4-teacher-info{padding:20px 17px 16px}.v4-teacher-info .teacher-name h3{font-size:23px}.v4-teacher-info .teacher-name>span{font-size:7px;letter-spacing:0}.v4-card-subject>h4{font-size:16px;min-height:54px}.v4-teacher-grid .v4-teacher-portrait{height:220px}}
@media(max-width:850px){.v4-teacher-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.v4-teacher-grid .v4-teacher-portrait{height:245px}.v4-card-subject>h4{font-size:18px;min-height:60px}.v4-teacher-grid .v4-teacher-info{padding:23px 21px 17px}.v4-filter-intro>p{font-size:11px}.v4-filter-status{align-items:start}.v4-filter-status>p{max-width:80%}}
@media(max-width:600px){.library-filters.v4-directory-filters{padding:24px 0 22px}.v4-filter-intro{gap:7px;margin-bottom:19px}.v4-filter-intro>span{font-size:8px;letter-spacing:1.6px}.v4-filter-intro>strong{font-size:19px;max-width:260px;line-height:1.7}.v4-filter-intro>p{font-size:10px}.v4-filter-controls{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px 10px}.v4-filter-controls>label{font-size:10px}.v4-filter-controls select{height:45px;padding:10px;font-size:11px}.v4-filter-controls>.button{font-size:10px}.v4-filter-status{font-size:9px;gap:12px;padding-top:15px}.v4-teacher-grid{grid-template-columns:1fr;gap:24px}.v4-teacher-grid .v4-teacher-portrait{height:270px}.v4-teacher-grid .v4-teacher-info{padding:25px 23px 18px}.v4-teacher-info .teacher-name h3{font-size:27px}.v4-teacher-info .teacher-name>span{font-size:9px;letter-spacing:.8px}.v4-card-subject{margin-top:23px}.v4-card-subject>h4{min-height:0;font-size:20px}.v4-card-audience{font-size:12px;margin-top:19px}.v4-card-meta{margin-bottom:23px}.v4-teacher-info .v4-teacher-actions>button:first-child{font-size:13px}.v4-teacher-info .v4-teacher-actions>button:last-child{font-size:10px}}
@media(prefers-reduced-motion:reduce){.v4-teacher-grid .v4-teacher-card,.v4-teacher-portrait img,.v4-teacher-actions>button:first-child>span{transition:none!important;transform:none!important}}
.motion-paused .v4-teacher-grid .v4-teacher-card,.motion-paused .v4-teacher-portrait img,.motion-paused .v4-teacher-actions>button:first-child>span{transition:none!important}