:root{--color-bg: #f7f8fa;--color-surface: #ffffff;--color-border: #e2e5e9;--color-text: #1a1f27;--color-text-muted: #5c6472;--color-primary: #2b5fd9;--color-primary-dark: #1f47ab;--color-success-bg: #e6f6ec;--color-success-text: #1c7a3f;--color-warning-bg: #fff4e0;--color-warning-text: #8a5b00;--color-danger-bg: #fdeaea;--color-danger-text: #b3261e;--color-info-bg: #e8f0fe;--color-info-text: #1a53c2;--radius: 8px;--shadow-sm: 0 1px 2px rgba(16, 24, 40, .06);--color-accent: #17a589;--gradient-brand: linear-gradient(135deg, var(--color-primary) 0%, var(--color-accent) 100%);--gradient-page: linear-gradient(160deg, #eef2ff 0%, #f7f8fa 45%, #eef9f6 100%);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%}html{scroll-behavior:smooth}body{margin:0;background:var(--gradient-page);color:var(--color-text);-webkit-font-smoothing:antialiased}a{color:var(--color-primary)}h1,h2,h3{line-height:1.25}.page-center{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;background-color:var(--color-primary);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='0.14' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M70 50 C60 44 46 44 36 50 L36 90 C46 84 60 84 70 90 Z'/%3E%3Cpath d='M70 50 C80 44 94 44 104 50 L104 90 C94 84 80 84 70 90 Z'/%3E%3Cpath d='M70 50 L70 90'/%3E%3C/g%3E%3C/svg%3E"),var(--gradient-brand);background-repeat:repeat,no-repeat;background-size:140px 140px,cover;animation:driftPattern 50s linear infinite}@keyframes driftPattern{0%{background-position:0 0,0 0}to{background-position:140px 140px,0 0}}.login-card__brand{display:flex;justify-content:center;margin-bottom:10px}.login-card__logo{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:14px;background:var(--gradient-brand);color:#fff;box-shadow:0 4px 14px #2b5fd947}.login-card__system-name{text-align:center;margin:0 0 4px;font-size:.76rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-muted)}.login-card__footnote{margin:18px 0 0;padding-top:14px;border-top:1px solid var(--color-border);font-size:.82rem;color:var(--color-text-muted);text-align:center}.app-shell{min-height:100vh;display:flex;flex-direction:column}.app-header{display:flex;align-items:center;gap:24px;padding:12px 20px;background:linear-gradient(90deg,#eef2ff,#fff 55%,#eefaf6);border-bottom:1px solid var(--color-border);flex-wrap:wrap;position:relative}.app-header:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--gradient-brand)}.app-header__brand{font-weight:700;font-size:1.1rem;background:var(--gradient-brand);-webkit-background-clip:text;background-clip:text;color:transparent}.app-header__panel{display:flex;align-items:center;gap:24px;flex:1;flex-wrap:wrap}.app-header__nav{display:flex;gap:4px;flex-wrap:wrap;flex:1}.nav-toggle{display:none;align-items:center;justify-content:center;width:38px;height:38px;border-radius:var(--radius);border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);cursor:pointer;margin-left:auto}.nav-toggle:hover{background:var(--color-bg)}.app-header__backdrop{display:none;border:none;padding:0;cursor:pointer}.nav-link{position:relative;padding:8px 12px;border-radius:var(--radius);text-decoration:none;color:var(--color-text-muted);font-size:.92rem;transition:background-color .15s ease,color .15s ease}.nav-link:hover{background:var(--color-bg)}.nav-link--active{background:var(--color-info-bg);color:var(--color-primary-dark);font-weight:600}.nav-link--active:after{content:"";position:absolute;left:10px;right:10px;bottom:3px;height:2px;border-radius:2px;background:var(--gradient-brand)}.app-header__user{display:flex;align-items:center;gap:10px}.app-header__name{font-size:.9rem;color:var(--color-text-muted)}.app-main{flex:1;width:100%;max-width:1080px;margin:0 auto;padding:24px 20px 48px}.app-main--student{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cg fill='none' stroke='%232b5fd9' stroke-opacity='0.05' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M80 60 C70 54 56 54 46 60 L46 100 C56 94 70 94 80 100 Z'/%3E%3Cpath d='M80 60 C90 54 104 54 114 60 L114 100 C104 94 90 94 80 100 Z'/%3E%3Cpath d='M80 60 L80 100'/%3E%3C/g%3E%3C/svg%3E");background-repeat:repeat;background-size:160px 160px}.app-main--librarian{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cg fill='none' stroke='%2317a589' stroke-opacity='0.05' stroke-width='1.5'%3E%3Cpath d='M0 30 H120 M0 60 H120 M0 90 H120 M30 0 V120 M60 0 V120 M90 0 V120'/%3E%3C/g%3E%3C/svg%3E");background-repeat:repeat;background-size:120px 120px}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:16px;animation:fadeInUp .3s ease-out both}.card-list__item,.book-card{transition:transform .15s ease,box-shadow .15s ease}.card-list__item:hover,.book-card:hover{transform:translateY(-2px);box-shadow:0 6px 16px #1018281a}.card-list__item:has(.badge--danger){border-left:4px solid var(--color-danger-text)}.card-list__item:has(.badge--warning){border-left:4px solid var(--color-warning-text)}.card-list__item:has(.badge--success){border-left:4px solid var(--color-success-text)}.card-list__item:has(.badge--info){border-left:4px solid var(--color-primary)}.card-list__item:nth-child(1),.book-card:nth-child(1){animation-delay:.02s}.card-list__item:nth-child(2),.book-card:nth-child(2){animation-delay:.05s}.card-list__item:nth-child(3),.book-card:nth-child(3){animation-delay:.08s}.card-list__item:nth-child(4),.book-card:nth-child(4){animation-delay:.11s}.card-list__item:nth-child(5),.book-card:nth-child(5){animation-delay:.14s}.card-list__item:nth-child(6),.book-card:nth-child(6){animation-delay:.17s}.card-list__item:nth-child(7),.book-card:nth-child(7){animation-delay:.2s}.card-list__item:nth-child(8),.book-card:nth-child(8){animation-delay:.23s}.card-list__item:nth-child(9),.book-card:nth-child(9){animation-delay:.26s}.card-list__item:nth-child(10),.book-card:nth-child(10){animation-delay:.29s}.card-list__item:nth-child(11),.book-card:nth-child(11){animation-delay:.32s}.card-list__item:nth-child(12),.book-card:nth-child(12){animation-delay:.35s}.card-list{display:flex;flex-direction:column;gap:12px}.card-list__item{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}.card-list__main{flex:1;min-width:220px}.card-list__title{font-weight:600;margin:0 0 4px}.card-list__meta{color:var(--color-text-muted);font-size:.88rem;margin:0}.card-list__actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.page-header{position:relative;display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:12px;margin-bottom:20px;padding-left:14px}.page-header:before{content:"";position:absolute;left:0;top:2px;bottom:6px;width:4px;border-radius:2px;background:var(--gradient-brand)}.page-header h1{margin:0 0 4px;font-size:1.5rem;display:flex;align-items:center;gap:9px}.page-header__icon{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:9px;background:var(--color-info-bg);color:var(--color-primary);flex-shrink:0}.page-header__subtitle{color:var(--color-text-muted);margin:0;font-size:.92rem}.form{display:flex;flex-direction:column;gap:14px}.form-field{display:flex;flex-direction:column;gap:6px}.form-field label{font-size:.85rem;font-weight:600;color:var(--color-text-muted)}.form-field input,.form-field select{padding:9px 11px;border:1px solid var(--color-border);border-radius:var(--radius);font-size:.95rem;background:var(--color-surface);color:var(--color-text)}.form-field input,.form-field select{transition:border-color .15s ease,box-shadow .15s ease}.form-field input:focus,.form-field select:focus{outline:2px solid var(--color-primary);outline-offset:1px;border-color:var(--color-primary);box-shadow:0 0 0 3px #2b5fd91f}.input-with-icon{position:relative;display:flex}.input-with-icon svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--color-text-muted);pointer-events:none}.input-with-icon input{width:100%;padding-left:34px}.form>*{animation:fadeInUp .35s ease-out both}.form>*:nth-child(1){animation-delay:.05s}.form>*:nth-child(2){animation-delay:.12s}.form>*:nth-child(3){animation-delay:.19s}.form>*:nth-child(4){animation-delay:.26s}.password-field{position:relative;display:flex}.password-field input{width:100%;padding-right:38px}.password-field__toggle{position:absolute;right:4px;top:50%;transform:translateY(-50%);background:none;border:none;padding:4px;cursor:pointer;color:var(--color-text-muted);display:flex;align-items:center;justify-content:center;transition:color .15s ease,transform .1s ease}.password-field__toggle:hover{color:var(--color-text)}.password-field__toggle:active{transform:translateY(-50%) scale(.88)}.password-field__toggle:focus-visible{outline:2px solid var(--color-primary);outline-offset:1px;border-radius:4px}.password-field input[type=password]::-ms-reveal,.password-field input[type=password]::-ms-clear{display:none}.filter-bar{display:flex;gap:10px;flex-wrap:wrap;align-items:end;margin-bottom:18px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:14px 16px;box-shadow:var(--shadow-sm)}.filter-bar .form-field{min-width:160px}.checkbox-field{display:flex;align-items:center;gap:6px;font-size:.88rem;color:var(--color-text-muted)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:9px 16px;border-radius:var(--radius);border:1px solid transparent;font-size:.92rem;font-weight:600;cursor:pointer;transition:background-color .15s ease,opacity .15s ease,transform .1s ease}.btn:active:not(:disabled){transform:scale(.96)}.btn:disabled{cursor:not-allowed;opacity:.55}.btn__spinner{width:14px;height:14px;border-radius:50%;border:2px solid currentColor;border-top-color:transparent;opacity:.85;animation:spin .7s linear infinite}.btn--primary{background:var(--color-primary);color:#fff}.btn--primary:hover:not(:disabled){background:var(--color-primary-dark)}.btn--secondary{background:var(--color-surface);border-color:var(--color-border);color:var(--color-text)}.btn--secondary:hover:not(:disabled){background:var(--color-bg)}.btn--danger{background:var(--color-danger-text);color:#fff}.btn--ghost{background:transparent;color:var(--color-text-muted)}.btn--ghost:hover:not(:disabled){background:var(--color-bg)}.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:999px;font-size:.75rem;font-weight:700;letter-spacing:.02em}.badge svg{width:13px;height:13px;flex-shrink:0}.badge--neutral{background:#eef0f3;color:var(--color-text-muted)}.badge--success{background:var(--color-success-bg);color:var(--color-success-text)}.badge--warning{background:var(--color-warning-bg);color:var(--color-warning-text)}.badge--danger{background:var(--color-danger-bg);color:var(--color-danger-text)}.badge--info{background:var(--color-info-bg);color:var(--color-info-text)}.alert{padding:12px 14px;border-radius:var(--radius);font-size:.9rem;margin-bottom:16px;animation:alertIn .25s ease-out both}.alert--error{background:var(--color-danger-bg);color:var(--color-danger-text);border-left:4px solid var(--color-danger-text)}.alert--warning{background:var(--color-warning-bg);color:var(--color-warning-text);border-left:4px solid var(--color-warning-text)}.alert--success{background:var(--color-success-bg);color:var(--color-success-text);border-left:4px solid var(--color-success-text)}.alert--info{background:var(--color-info-bg);color:var(--color-info-text);border-left:4px solid var(--color-info-text)}.empty-state{text-align:center;padding:32px 16px;color:var(--color-text-muted);animation:fadeInUp .3s ease-out both;background:linear-gradient(160deg,#eef2ff,#eef9f6);border:1px dashed var(--color-border);border-radius:var(--radius)}.empty-state__title{font-weight:600;color:var(--color-text);margin:0 0 6px}.empty-state__description{margin:0 0 14px;font-size:.9rem}.spinner-wrap{display:flex;flex-direction:column;align-items:center;gap:10px;color:var(--color-text-muted);padding:24px;animation:fadeIn .2s ease-out both}.spinner{width:22px;height:22px;border-radius:50%;border:3px solid var(--color-border);border-top-color:var(--color-primary);animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes alertIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}@keyframes pulseSoft{0%,to{opacity:1}50%{opacity:.5}}.page-fade{animation:fadeInUp .3s ease-out both}.badge--pulse{animation:pulseSoft 2.2s ease-in-out infinite}@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}.pagination{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:20px}.pagination__status{font-size:.88rem;color:var(--color-text-muted)}.book-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}.book-card{display:block;text-decoration:none;color:inherit}.book-card__title{font-weight:600;margin:0 0 2px;font-size:.98rem}.book-card__author{color:var(--color-text-muted);font-size:.85rem;margin:0 0 10px}.book-cover{height:120px;margin:-16px -16px 12px;border-radius:calc(var(--radius) - 1px) calc(var(--radius) - 1px) 0 0;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,hsl(var(--cover-hue) 62% 46%),hsl(calc(var(--cover-hue) + 35) 58% 34%));overflow:hidden}.book-cover__initial{font-family:Georgia,Times New Roman,serif;font-size:2.5rem;font-weight:700;color:#ffffffeb;text-shadow:0 2px 6px rgba(0,0,0,.25);transition:transform .2s ease}.book-card:hover .book-cover__initial{transform:scale(1.06)}.book-cover--lg{width:108px;height:148px;flex-shrink:0;margin:0;border-radius:var(--radius);box-shadow:var(--shadow-sm)}.book-cover--lg .book-cover__initial{font-size:2.9rem}.book-detail__card{display:flex;gap:20px;align-items:flex-start}.book-detail__info{flex:1;min-width:0}@media (max-width: 600px){.book-detail__card{flex-direction:column;align-items:center;text-align:center}}.login-card{width:100%;max-width:380px;animation:fadeInUp .4s ease-out both}.login-card h1{margin-top:0;font-size:1.3rem;text-align:center}.login-card .page-header__subtitle{text-align:center;margin-bottom:18px}.profile-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}.profile-field dt{font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-muted);margin-bottom:4px}.profile-field dd{margin:0;font-size:1rem}.stat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px}.stat-card{text-align:left}.stat-card__icon{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:9px;background:var(--color-info-bg);color:var(--color-primary);margin-bottom:8px}.stat-card--warning .stat-card__icon{background:var(--color-warning-bg);color:var(--color-warning-text)}.stat-card--danger .stat-card__icon{background:var(--color-danger-bg);color:var(--color-danger-text)}.stat-card__value{font-size:1.7rem;font-weight:700;margin:0 0 4px}.stat-card__label{color:var(--color-text-muted);font-size:.85rem;margin:0}.stat-card--warning .stat-card__value{color:var(--color-warning-text)}.stat-card--danger .stat-card__value{color:var(--color-danger-text)}.scan-target{position:relative;padding:20px 18px;border-radius:var(--radius);background:var(--color-info-bg);border:1px solid var(--color-border)}.scan-target__corner{position:absolute;width:18px;height:18px;border-color:var(--color-accent);border-style:solid;border-width:0;animation:scanPulse 2.2s ease-in-out infinite}.scan-target__corner--tl{top:6px;left:6px;border-top-width:3px;border-left-width:3px;border-top-left-radius:6px}.scan-target__corner--tr{top:6px;right:6px;border-top-width:3px;border-right-width:3px;border-top-right-radius:6px}.scan-target__corner--bl{bottom:6px;left:6px;border-bottom-width:3px;border-left-width:3px;border-bottom-left-radius:6px}.scan-target__corner--br{bottom:6px;right:6px;border-bottom-width:3px;border-right-width:3px;border-bottom-right-radius:6px}@keyframes scanPulse{0%,to{opacity:.45}50%{opacity:1}}.tabs{display:flex;gap:4px;border-bottom:1px solid var(--color-border);margin-bottom:18px;flex-wrap:wrap}.tab-button{display:inline-flex;align-items:center;gap:6px;padding:9px 14px;border:none;background:none;cursor:pointer;font-size:.9rem;font-weight:600;color:var(--color-text-muted);border-bottom:2px solid transparent;margin-bottom:-1px}.tab-button svg{width:15px;height:15px}.tab-button:hover{color:var(--color-text)}.tab-button--active{color:var(--color-primary-dark);border-bottom-color:var(--color-primary)}.table-wrap{overflow-x:auto}.table{width:100%;border-collapse:collapse;font-size:.88rem}.table th,.table td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--color-border);vertical-align:top}.table th{color:var(--color-text-muted);font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;font-weight:600}.table tr:last-child td{border-bottom:none}.selectable-row{display:flex;align-items:flex-start;gap:10px}.selectable-row input[type=checkbox]{margin-top:4px}@media (max-width: 600px){.app-header:not(:has(.nav-toggle)){flex-direction:column;align-items:stretch}.app-header:not(:has(.nav-toggle)) .app-header__user{justify-content:space-between}.app-header:has(.nav-toggle){flex-wrap:nowrap}.nav-toggle{display:inline-flex}.app-header__panel{position:fixed;top:0;right:0;bottom:0;width:min(280px,80vw);background:var(--color-surface);flex-direction:column;align-items:stretch;gap:4px;padding:72px 16px 20px;box-shadow:-8px 0 24px #1018282e;transform:translate(100%);transition:transform .25s ease;z-index:40;overflow-y:auto}.app-header__panel--open{transform:translate(0)}.app-header__nav{flex-direction:column;align-items:stretch}.app-header__user{flex-direction:column;align-items:stretch;gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid var(--color-border)}.app-header__backdrop{display:block;position:fixed;top:0;right:0;bottom:0;left:0;background:#10182859;z-index:30;animation:fadeIn .2s ease-out both}}