@import url('https://fonts.googleapis.com/css2?family=Sarabun:wght@400;500;600;700;800&display=swap');
.lib-wrap,.lib-wrap *, .lib-login-body,.lib-login-body *,.lib-print-body,.lib-print-body *{box-sizing:border-box}
.lib-wrap{--lib-purple:#6750ae;--lib-border:#dddce8;--lib-mute:#666d7a;--lib-ink:#22283a;font-family:'Sarabun',sans-serif;color:var(--lib-ink);width:100%;max-width:none;padding:0 0 22px;font-size:15px}
.lib-wrap h2,.lib-wrap h3{margin:0;font-weight:800;color:#2b2350;line-height:1.45}.lib-wrap h3{font-size:19px;margin-bottom:12px}.lib-wrap small{font-size:13px}
.lib-hero{display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap;background:#f2effb;border:1px solid #ded5f4;border-radius:14px;padding:21px 24px;margin:0 0 15px}
.lib-eyebrow{display:block;font-size:11px;color:#64508b;letter-spacing:1.5px;font-weight:800}.lib-hero h2{font-size:25px}.lib-hero p{color:#5b5871;margin:4px 0 0}.lib-user{display:flex;align-items:flex-end;gap:9px;flex-direction:column}.lib-user span{font-weight:800}.lib-user small{color:#6b6883}.lib-user form{margin:0}
.lib-tabs{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin-bottom:17px}.lib-tabs a{text-decoration:none!important;font-size:14px;padding:9px 14px;border:1px solid #dedde5;background:#fff;color:#484553!important;border-radius:9px;font-weight:700;transition:background .15s}.lib-tabs a:hover{background:#ede7fa}.lib-tabs a.active{background:var(--lib-purple)!important;color:#fff!important;border-color:var(--lib-purple)}
.lib-metrics{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:13px;margin-bottom:17px}.lib-metric,.lib-card{background:#fff;border:1px solid var(--lib-border);border-radius:13px}.lib-metric{padding:17px 18px;border-top:3px solid #a78bfa}.lib-metric small{display:block;color:#6b6677;font-weight:700;font-size:14px}.lib-metric b{display:block;font-size:28px;margin-top:7px;color:#403079;font-variant-numeric:tabular-nums}
.lib-grid-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:16px;align-items:start}.lib-card{padding:20px;margin-bottom:16px;min-width:0}.lib-grid-two>.lib-card{margin-bottom:0}.lib-muted{color:var(--lib-mute);font-size:14px;margin:7px 0 15px}.lib-block{display:block;color:#818393}.lib-overdue{color:#bb2525;font-weight:800}
.lib-form{display:grid;gap:13px}.lib-form label,.lib-print-controls label{display:grid;gap:6px;font-weight:700;color:#414055;min-width:0}.lib-form input,.lib-form select,.lib-form textarea,.lib-print-controls select{background:#fff;border:1px solid #c7c7d7;border-radius:9px;color:#202435;width:100%;padding:10px 11px;min-height:41px;font-family:inherit;font-size:15px;outline:0}.lib-form input:focus,.lib-form select:focus,.lib-print-controls select:focus{border-color:#8066c2;box-shadow:0 0 0 2px #e6dafa}.lib-form select[size]{min-height:155px}.lib-form select[size] option{padding:6px}.lib-form-row{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.lib-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;appearance:none;cursor:pointer;text-decoration:none!important;border:1px solid #c9c6d5;border-radius:9px;padding:9px 14px;background:#faf9fe;color:#3a3255!important;font-family:'Sarabun',sans-serif;font-size:14px;font-weight:800;line-height:1.4;min-height:40px}.lib-btn:hover{background:#eee8fa}.lib-btn.lib-primary{border-color:#6b52ad;background:#6b52ad;color:#fff!important}.lib-btn.lib-primary:hover{background:#543c93}.lib-btn.lib-small{font-size:13px;min-height:33px;padding:6px 11px}.lib-btn.lib-quiet{font-size:12px;min-height:30px;padding:4px 9px}.lib-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:16px}
.lib-table-scroll{overflow:auto;max-width:100%;border:1px solid #eae7f0;border-radius:10px}.lib-wrap table{width:100%;border-collapse:collapse;min-width:500px;font-size:14px}.lib-wrap thead th{background:#f0edfa;color:#383057;text-align:left;white-space:nowrap;font-weight:800}.lib-wrap th,.lib-wrap td{padding:10px 12px;border-bottom:1px solid #e9e6ee;vertical-align:middle}.lib-wrap tr:nth-child(even) td{background:#fbfaff}.lib-wrap td form{margin:0}
.lib-bar-row{display:grid;grid-template-columns:minmax(65px,120px) 1fr 40px;align-items:center;gap:10px;margin:13px 0;font-size:14px}.lib-bar-track{height:11px;background:#efecf6;border-radius:9px;overflow:hidden}.lib-bar-track i{display:block;height:100%;background:#997bcf;border-radius:9px}.lib-bar-row b{text-align:right}
.lib-success,.lib-error,.lib-pin-alert{padding:12px 16px;border-radius:10px;margin-bottom:15px;font-weight:600}.lib-success{color:#125b38;background:#ecf8f0;border:1px solid #bae1c7}.lib-error{color:#9f2727;background:#fff1f1;border:1px solid #f2b4b4}.lib-pin-alert{color:#4c3782;background:#f0e8ff;border:1px solid #b5a3db}.lib-pin-alert p{margin:6px 0}.lib-pin-code{display:inline-block;background:white;border:1px solid #b3a2d3;border-radius:7px;padding:3px 12px;font-size:20px;letter-spacing:2px}
.lib-face-note{padding:13px 16px;background:#f5f7fb;border:1px solid #dce3ef;border-radius:10px;font-size:14px;color:#536077}.lib-face-note p{margin:5px 0 0}.lib-face-note strong{color:#323b4b}
.lib-login-body{background:#f6f4fb;color:#24213d;margin:0;min-height:100vh;padding:35px 15px;display:flex;align-items:center;justify-content:center;font-family:'Sarabun',sans-serif;font-size:15px}.lib-login-panel{width:100%;max-width:470px;background:#fff;border:1px solid #e2dcef;border-radius:16px;padding:29px}.lib-login-mark{font-size:13px;letter-spacing:1px;text-transform:uppercase;color:#7a62b6;font-weight:800}.lib-login-panel h1{font-size:26px;margin:8px 0 16px}.lib-login-panel .lib-form{margin:17px 0}.lib-login-panel a{color:#624a9d}.lib-standalone{margin:0;background:#faf9fc;font-family:'Sarabun',sans-serif;font-size:15px}.lib-standalone>.lib-wrap{padding:20px;max-width:1600px;margin:0 auto}.lib-student-head{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;background:#332366;color:#fff;padding:13px 20px}.lib-student-head strong{font-size:20px}
.lib-print-body{margin:0;background:#fff;font-family:'Sarabun',sans-serif}.lib-print-controls{display:flex;align-items:end;gap:12px;flex-wrap:wrap;padding:14px;border-bottom:1px solid #ddd}.lib-print-controls form{display:flex;align-items:end;gap:8px}.lib-barcode-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:15px}.lib-barcode-card{text-align:center;border:1px dashed #aaa;border-radius:5px;padding:12px 6px;break-inside:avoid;font-size:13px}.lib-barcode-card strong{display:block;color:#55408f}.lib-barcode-card svg{width:100%;max-width:260px}.lib-barcode-card small{display:block}
@media(max-width:1100px){.lib-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.lib-grid-two{grid-template-columns:1fr}}
@media(max-width:640px){.lib-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.lib-card{padding:15px}.lib-hero{padding:16px}.lib-hero h2{font-size:21px}.lib-user{align-items:flex-start}.lib-form-row{grid-template-columns:1fr}.lib-barcode-grid{grid-template-columns:repeat(2,1fr)}}
@media print{.lib-print-controls{display:none!important}.lib-barcode-grid{grid-template-columns:repeat(3,1fr);padding:0;gap:5mm}.lib-barcode-card{page-break-inside:avoid;min-height:45mm} @page{size:A4;margin:12mm}}
.lib-form [hidden]{display:none!important}

.lib-pin-change{margin:0 0 14px;border:1px solid #dad4e8;border-radius:10px;background:#fbfaff;padding:11px 15px}.lib-pin-change summary{cursor:pointer;font-size:14px;font-weight:800;color:#4b367f}.lib-pin-change .lib-form{max-width:580px;margin-top:12px}.lib-pin-change .lib-form-row{gap:12px}

/* P098: a completely independent library application shell, not an SDC screen. */
html,body.lib-site{min-height:100%;margin:0;background:#f7f7fb}
body.lib-site{color:#242238;font-family:'Sarabun',sans-serif;font-size:15px}
.lib-shell{display:flex;min-height:100vh;width:100%}
.lib-sidebar{position:sticky;top:0;height:100vh;width:245px;flex:0 0 245px;display:flex;flex-direction:column;background:#2e1065;color:#fff;z-index:50}
.lib-brand{color:#fff!important;text-decoration:none!important;display:flex;align-items:center;gap:12px;padding:24px 18px;font-size:19px;font-weight:800;border-bottom:1px solid rgba(255,255,255,.16)}
.lib-brand-icon{display:grid;place-items:center;width:39px;height:39px;border-radius:11px;background:#6644b7;color:white;font-size:23px}
.lib-side-nav{padding:14px 9px;display:flex;flex-direction:column;gap:4px;flex:1;overflow-y:auto}
.lib-side-nav a{display:block;text-decoration:none!important;padding:12px 15px;color:#e4dafa!important;border-left:3px solid transparent;border-radius:7px;font-weight:700;font-size:15px}
.lib-side-nav a:hover,.lib-side-nav a.active{background:#4c1d95;color:white!important}
.lib-side-nav a.active{border-left-color:#c4b5fd}
.lib-side-bottom{padding:13px;border-top:1px solid rgba(255,255,255,.16)}
.lib-side-bottom form{margin:0}
.lib-side-logout{width:100%;border:1px solid #76659c;background:rgba(255,255,255,.11);border-radius:9px;padding:11px;color:#fff;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer}
.lib-side-logout:hover{background:rgba(255,255,255,.23)}
.lib-main{min-width:0;flex:1}
.lib-topbar{min-height:76px;padding:12px 23px;background:white;border-bottom:1px solid #e1dce9;display:flex;align-items:center;justify-content:space-between;gap:16px}
.lib-topbar-left{display:flex;align-items:center;gap:12px;min-width:0}
.lib-topbar h1{margin:0;font-size:21px;font-weight:800;color:#35234f}
.lib-topbar-user{display:flex;flex-direction:column;align-items:flex-end;text-align:right;max-width:48%}
.lib-topbar-user strong{color:#352b50;font-size:15px;line-height:1.4;overflow-wrap:anywhere}
.lib-topbar-user small{color:#716d83;font-size:13px}
.lib-main>.lib-wrap{padding:22px 25px 40px;width:100%;max-width:none;margin:0}
.lib-menu-toggle{display:none;background:#f4f0fa;border:1px solid #ded5ee;border-radius:8px;padding:7px 10px;font-size:19px;color:#4c1d95;cursor:pointer}
.lib-mobile-shade[hidden]{display:none!important}
.lib-login-tabs{display:grid;grid-template-columns:1fr 1fr;gap:5px;border-radius:10px;background:#f0ebfa;padding:5px;margin:18px 0}
.lib-login-tabs a{display:block;text-align:center;border-radius:8px;padding:11px 5px;font-weight:700;font-size:14px;text-decoration:none!important;color:#604c82!important}
.lib-login-tabs a.active{background:#684cb1;color:#fff!important}
.lib-login-panel .lib-btn.lib-primary{width:100%}
@media(max-width:850px){.lib-sidebar{position:fixed;left:0;top:0;transform:translateX(-101%);transition:transform .22s ease}.lib-shell.lib-menu-open .lib-sidebar{transform:translateX(0)}.lib-menu-toggle{display:inline-flex}.lib-mobile-shade{display:none}.lib-shell.lib-menu-open .lib-mobile-shade{display:block;position:fixed;inset:0;background:rgba(20,14,43,.55);z-index:40}.lib-main>.lib-wrap{padding:16px}.lib-topbar{padding:12px 16px}.lib-topbar h1{font-size:19px}}
@media(max-width:530px){.lib-topbar{min-height:62px}.lib-topbar h1{font-size:17px}.lib-topbar-user{max-width:42%}.lib-topbar-user strong{font-size:13px}.lib-main>.lib-wrap{padding:12px}.lib-card{padding:13px}.lib-metric{padding:12px}}


/* P099 · D-Library standalone, royal-purple school public-site visual system. */
:root{--lib-royal:#5b3486;--lib-dark:#3c1e63;--lib-mid:#74479e;--lib-lilac:#f1eafb;--lib-tint:#faf8fd;--lib-ink:#2d2441;--lib-grey:#716980;--lib-line:#e7dfed}
body.lib-site{background:#f6f4f9;color:var(--lib-ink);font-family:'Sarabun',sans-serif;line-height:1.5}
.lib-shell{background:#f6f4f9}
.lib-sidebar{width:255px;flex-basis:255px;background:#41216c;box-shadow:6px 0 30px rgba(44,19,73,.08)}
.lib-brand{padding:25px 17px 23px;gap:12px;line-height:1.15;background:rgba(255,255,255,.04);border-bottom:1px solid rgba(255,255,255,.10)}
.lib-brand-icon{background:#6c43a0;border:1px solid rgba(255,255,255,.18);width:45px;height:45px;border-radius:14px;flex:0 0 45px;color:#fff}
.lib-brand-icon svg{width:25px;height:25px}
.lib-brand-title{font-size:20px;letter-spacing:.2px}.lib-brand-title em{font-style:normal;color:#e1cbff}
.lib-brand-title small{display:block;font-size:11px;font-weight:500;margin-top:5px;color:#c9b4e3;letter-spacing:.5px}
.lib-side-nav{padding:18px 11px;gap:5px}
.lib-side-nav a{display:flex;align-items:center;gap:13px;min-height:48px;border-left:0;padding:12px 13px;color:#ecdefa!important;border-radius:12px;font-size:14px;transition:background .18s,transform .18s}
.lib-side-nav a svg{width:20px;height:20px;flex:0 0 20px;opacity:.86}
.lib-side-nav a:hover{background:rgba(255,255,255,.12);transform:translateX(2px)}
.lib-side-nav a.active{background:#7650a9;box-shadow:inset 3px 0 #e4d4ff,0 7px 15px rgba(29,11,57,.14);border-left:0;color:#fff!important}
.lib-side-nav a.active svg{opacity:1}
.lib-side-bottom{padding:14px;border-top:1px solid rgba(255,255,255,.14)}
.lib-side-logout{display:flex;align-items:center;justify-content:center;gap:9px;border:1px solid rgba(255,255,255,.23);background:rgba(255,255,255,.09);border-radius:12px;font-size:14px;min-height:44px;transition:background .2s}
.lib-side-logout:hover{background:rgba(255,255,255,.21)}
.lib-side-logout svg{width:17px;height:17px}
.lib-topbar{position:sticky;top:0;z-index:32;min-height:75px;background:rgba(255,255,255,.96);border-bottom:1px solid var(--lib-line);padding:12px clamp(19px,2.5vw,40px);box-shadow:0 4px 15px rgba(53,33,79,.035)}
.lib-topbar h1{color:var(--lib-dark);font-size:20px;line-height:1.1}
.lib-topbar-title small{display:block;margin-top:5px;font-size:11px;color:#9187a4;font-weight:650}
.lib-topbar-user{display:flex;align-items:center;flex-direction:row;gap:11px;text-align:left}
.lib-avatar{width:40px;height:40px;border-radius:13px;background:var(--lib-lilac);color:var(--lib-royal);display:grid;place-items:center;flex:0 0 40px}
.lib-user-details{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.lib-topbar-user strong{font-size:14px;color:#3d2a55;max-width:230px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lib-topbar-user small{font-size:12px;color:#8a7c99}
.lib-main>.lib-wrap{padding:24px clamp(16px,2.5vw,40px) 55px;width:100%;max-width:none;margin:0}
.lib-dashboard-intro{position:relative;isolation:isolate;display:flex;justify-content:space-between;align-items:center;gap:20px;overflow:hidden;background:#563285;color:#fff;border:1px solid #5c388c;border-radius:22px;padding:29px 30px;min-height:158px;margin-bottom:19px;box-shadow:0 12px 28px rgba(77,45,123,.12)}
.lib-dashboard-intro:before{content:'';position:absolute;border:1px solid rgba(255,255,255,.15);width:310px;height:310px;right:8%;top:-200px;border-radius:50%;pointer-events:none;z-index:-1}
.lib-dashboard-intro:after{content:'';position:absolute;border:1px solid rgba(255,255,255,.09);width:340px;height:340px;right:-145px;bottom:-265px;border-radius:50%;pointer-events:none;z-index:-1}
.lib-intro-label{display:inline-flex;align-items:center;gap:7px;font-size:11px;letter-spacing:2px;font-weight:800;color:#ead8ff}
.lib-intro-label:before{content:'';display:block;background:#dcc2ff;width:17px;height:2px;border-radius:9px}
.lib-intro-copy h2{font-weight:800;color:white;font-size:clamp(23px,2.7vw,32px);margin:9px 0 4px;line-height:1.2}
.lib-intro-copy p{font-size:13px;margin:5px 0 0;color:#f1e7fc}
.lib-intro-shortcuts{display:flex;gap:9px;flex-wrap:wrap;z-index:1}
.lib-intro-shortcuts a{display:inline-flex;align-items:center;gap:8px;padding:11px 15px;border:1px solid rgba(255,255,255,.25);background:white;color:#543178;border-radius:12px;text-decoration:none;font-weight:800;font-size:14px;transition:transform .18s}
.lib-intro-shortcuts a:hover{transform:translateY(-2px)}
.lib-intro-shortcuts a:last-child{background:rgba(255,255,255,.14);color:white}
.lib-intro-shortcuts svg{width:18px;height:18px}
.lib-metrics{gap:14px;margin-bottom:17px}
.lib-metric,.lib-card{background:#fff;border:1px solid #e9e1ee;border-radius:18px;box-shadow:0 6px 24px rgba(52,32,80,.035)}
.lib-metric{border-top:1px solid #e9e1ee;padding:18px 18px 16px;transition:transform .18s,box-shadow .18s}
.lib-metric:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(52,32,80,.10)}
.lib-metric-top{display:flex;align-items:center;gap:10px}
.lib-metric-icon,.lib-section-icon{background:#f1eafb;color:#71459d;border-radius:12px;width:38px;height:38px;display:grid;place-items:center;flex:0 0 38px}
.lib-metric:nth-child(2) .lib-metric-icon{background:#f1eafc;color:#7950b0}
.lib-metric:nth-child(3) .lib-metric-icon{background:#e8f6f3;color:#137f6b}
.lib-metric:nth-child(4) .lib-metric-icon{background:#eef0fe;color:#5c60aa}
.lib-metric:nth-child(5) .lib-metric-icon{background:#fff0ef;color:#c45e65}
.lib-metric small{font-size:13px;color:#746b7d}
.lib-metric b{font-size:31px;line-height:1.2;margin:11px 0 0 3px;color:#3b255b}
.lib-card{padding:22px;margin-bottom:16px}
.lib-grid-two{gap:16px}
.lib-section-head{display:flex;align-items:center;gap:11px;margin-bottom:15px}
.lib-section-head h3{margin:0!important}
.lib-section-head h3 small{font-weight:500;white-space:nowrap;color:#857993}
.lib-section-icon{width:37px;height:37px;flex-basis:37px}
.lib-wrap h3{color:#39254f;font-size:17px}
.lib-wrap table{font-size:14px}.lib-wrap thead th{background:#f6f1fc;color:#584172}
.lib-wrap th,.lib-wrap td{border-bottom:1px solid #f0ebf4}
.lib-wrap tr:nth-child(even) td{background:#fcfaff}
.lib-table-scroll{border-color:#eee7f3;border-radius:12px}
.lib-bar-track{height:10px;background:#f0e9f6}.lib-bar-track i{background:#8457ad}
.lib-form input,.lib-form select,.lib-form textarea,.lib-print-controls select{border:1px solid #ded4e8;border-radius:11px;min-height:44px;background:#fdfcff;font-size:15px}
.lib-form input:focus,.lib-form select:focus,.lib-form textarea:focus{border-color:#8652b9;box-shadow:0 0 0 3px #f1e8fb}
.lib-btn{border-radius:11px;min-height:42px;background:white;border-color:#e1d8e8;color:#56367c!important}
.lib-btn:hover{background:#f9f5fe}
.lib-btn.lib-primary{background:#70449d;border-color:#70449d}.lib-btn.lib-primary:hover{background:#5d368a}
.lib-pin-change{background:white;border-color:#e7deed;border-radius:15px;margin-bottom:17px}
.lib-pin-change summary{color:#5d3b86}
.lib-menu-toggle{background:#f7f0ff;border-radius:12px}
/* Independent administrator, teacher and student login */
body.lib-login-body{background:#f7f4fa;padding:20px;min-height:100vh;display:flex;align-items:center;justify-content:center}
.lib-login-layout{width:min(100%,930px);min-height:530px;display:grid;grid-template-columns:.93fr 1fr;border-radius:24px;overflow:hidden;background:#fff;border:1px solid #e7ddec;box-shadow:0 22px 70px rgba(49,30,76,.12)}
.lib-login-welcome{background:#503081;color:#fff;display:flex;flex-direction:column;justify-content:space-between;padding:32px;position:relative;overflow:hidden;isolation:isolate}
.lib-login-welcome:after{content:'';position:absolute;border:1px solid rgba(255,255,255,.17);width:330px;height:330px;border-radius:50%;bottom:-135px;right:-152px;z-index:-1}
.lib-login-brand{display:flex;align-items:center;gap:12px;font-size:23px;color:white}.lib-login-brand strong{font-weight:800}.lib-login-brand span{color:#ecdfff}
.lib-login-brand-icon{display:grid;place-items:center;background:rgba(255,255,255,.17);width:45px;height:45px;border-radius:13px;font-size:23px}
.lib-login-welcome-main h2{font-size:clamp(32px,4vw,47px);color:#fff;line-height:1.2;margin:13px 0 9px;font-weight:800}
.lib-login-welcome-main p{color:#e9dcf5;font-size:14px;max-width:260px;line-height:1.8}
.lib-kicker{font-size:12px;letter-spacing:2px;color:#eddbfe;font-weight:800}
.lib-login-welcome-foot{font-size:12px;letter-spacing:1px;color:#dac6ef}
.lib-login-layout .lib-login-panel{max-width:none;width:100%;border:0;border-radius:0;box-shadow:none;padding:45px clamp(25px,4vw,50px);display:flex;flex-direction:column;justify-content:center}
.lib-login-head h1{font-size:29px;font-weight:800;color:#39244f;margin:7px 0 4px}
.lib-login-head p{font-size:14px;margin:0;color:#837792}
.lib-login-panel .lib-login-mark{color:#7650a3;letter-spacing:1.7px;font-size:11px}
.lib-login-tabs{grid-template-columns:repeat(3,minmax(0,1fr));padding:4px;gap:4px;margin:22px 0 18px;background:#f3eef8;border-radius:13px}
.lib-login-tabs a{border-radius:10px;font-size:12px;padding:12px 4px;min-width:0}
.lib-login-tabs a.active{background:#70449d;color:white!important;box-shadow:0 4px 10px rgba(66,29,98,.15)}
.lib-login-panel .lib-form{gap:15px}.lib-login-panel .lib-form label{font-size:14px}
.lib-login-panel .lib-form input{border-radius:12px;background:#fcfaff;min-height:47px}
.lib-login-panel .lib-login-submit{width:100%;min-height:48px;font-size:15px;justify-content:space-between;padding:10px 17px;margin-top:7px}
.lib-login-submit span{font-size:20px;font-weight:400}
@media(max-width:1100px){.lib-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:850px){.lib-sidebar{width:255px;flex-basis:255px}.lib-dashboard-intro{padding:24px}.lib-topbar{padding:12px 18px}}
@media(max-width:710px){.lib-login-layout{grid-template-columns:1fr;min-height:unset;max-width:470px}.lib-login-welcome{padding:19px 24px;min-height:110px}.lib-login-welcome-main,.lib-login-welcome-foot{display:none}.lib-login-layout .lib-login-panel{padding:30px 24px 32px}.lib-dashboard-intro{flex-direction:column;align-items:flex-start}.lib-intro-shortcuts{width:100%}.lib-intro-shortcuts a{flex:1;justify-content:center}}
@media(max-width:530px){.lib-topbar h1{font-size:17px}.lib-topbar-title small{font-size:10px}.lib-avatar{display:none}.lib-topbar-user strong{max-width:130px;font-size:12px}.lib-topbar-user small{font-size:11px}.lib-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.lib-metric b{font-size:25px}.lib-metric-icon{width:34px;height:34px;flex-basis:34px}.lib-metric small{font-size:12px}.lib-card{padding:16px}.lib-intro-copy h2{font-size:25px}.lib-intro-shortcuts a{font-size:13px}}
@media(max-width:360px){.lib-metrics{grid-template-columns:1fr}.lib-login-tabs a{font-size:11px}}
@media(prefers-reduced-motion:reduce){.lib-wrap *, .lib-sidebar *{transition:none!important}}

/* P100 navigation enhancements */
.lib-public-link{display:inline-flex;align-items:center;justify-content:center;text-decoration:none!important;border:1px solid #eadcf1;padding:9px 12px;border-radius:10px;color:#6a4592!important;background:#faf5ff;font-size:13px;font-weight:750;white-space:nowrap;margin-right:6px}
.lib-public-link:hover{background:#f0e6fa}
.lib-login-back{display:inline-flex;align-items:center;gap:8px;font-size:13px;text-decoration:none;color:#77519b!important;font-weight:750;margin:0 0 10px}
.lib-archive-card{border:1px solid #e7d7f4;background:#fcfaff}.lib-archive-action{display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap}.lib-archive-action p{margin:0;flex:1;min-width:240px;color:#6d5b7b;font-size:13px}.lib-archive-action form{margin:0}
@media(max-width:530px){.lib-public-link{font-size:12px;padding:7px 9px;margin:0 4px 0 0}.lib-topbar-user{max-width:65%}.lib-topbar-user strong{max-width:110px}}

/* P102: explicit, accessible return to the public portal */
.lib-login-panel a.lib-login-back{position:relative;z-index:2;display:inline-flex;align-self:flex-start;min-height:38px;padding:8px 12px;margin:4px 0 12px;border:1px solid #e5d7ee;border-radius:10px;background:#faf6fe;color:#5e347f!important;text-decoration:none!important;cursor:pointer;pointer-events:auto}
.lib-login-panel a.lib-login-back:hover,.lib-login-panel a.lib-login-back:focus-visible{background:#eadcf6;color:#4e1f75!important;border-color:#b99bd5}


/* P103: classroom-first student selection & star rewards */
.lib-student-picker{display:grid;gap:12px;min-width:0}
.lib-student-pick-list[hidden],.lib-student-tile[hidden],.lib-student-picker [hidden]{display:none!important}
.lib-student-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px;max-height:310px;overflow:auto;padding:4px 2px}
.lib-form label.lib-student-tile{display:flex;gap:9px;align-items:center;background:#faf7fe;border:1px solid #e4d5f1;border-radius:11px;padding:10px;cursor:pointer;min-width:0;transition:background .15s,border-color .15s}
.lib-form label.lib-student-tile:hover{background:#f2e9fa}
.lib-form .lib-student-tile:has(input:checked){background:#ebddfa;border:2px solid #8356ad}
.lib-student-tile input[type=radio]{min-height:18px;width:18px;height:18px;flex:0 0 18px;accent-color:#70449d;padding:0}
.lib-student-tile-detail{display:flex;flex-direction:column;min-width:0;gap:3px}
.lib-student-tile-detail strong{font-size:14px;color:#332249;font-weight:700;overflow-wrap:anywhere}
.lib-student-tile-detail small{font-size:12px;color:#746785;font-weight:600}
.lib-scanner-alternative{border:1px solid #e4d8ef;border-radius:11px;background:#fcfafe;padding:11px 13px}
.lib-scanner-alternative summary{font-size:14px;font-weight:750;color:#65428c;cursor:pointer}
.lib-scanner-alternative label{margin-top:12px}
.lib-star-hint{font-size:13px;color:#695582;background:#f5f0fb;padding:11px 13px;border-radius:10px;margin:0}
.lib-star-top{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px;margin-bottom:15px;background:#563285;color:#fff;border-radius:18px;padding:19px 22px}
.lib-star-top h2{font-size:27px;color:#fff;margin:7px 0 0}.lib-star-summary{display:flex;flex-direction:column;align-items:flex-end}.lib-star-summary strong{font-size:29px;line-height:1.2}.lib-star-summary span{font-size:13px;color:#f0e5ff}
.lib-star-rules{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px;margin-bottom:16px}
.lib-star-rules>div{background:white;border:1px solid #e5d9ef;border-radius:14px;padding:15px;display:flex;flex-direction:column;gap:6px}
.lib-star-rules b{font-size:21px;color:#6a4193}.lib-star-rules span{font-size:13px;color:#6c6376}
.lib-star-filter label{font-size:14px;color:#4c385e;font-weight:750;display:grid;gap:5px;margin:0 0 12px}
.lib-star-filter select{background:white;border:1px solid #ded4e8;border-radius:10px;padding:10px 12px;font:inherit;width:100%}
.lib-star-ranking{max-height:450px}.lib-star-count{font-weight:850;color:#5b3294!important;white-space:nowrap}.lib-star-count.is-negative{color:#be283d!important}
.lib-form [data-star-delta][hidden]{display:none!important}
.lib-danger-zone{border:1px solid #e9b9b9;background:#fffafa}.lib-danger-zone summary{cursor:pointer;color:#9c2336;font-weight:800}.lib-danger-zone p{color:#684c54;font-size:14px}
.lib-btn.lib-danger-button{background:#a8243a;border-color:#a8243a;color:white!important}.lib-btn.lib-danger-button:hover{background:#801b31}
@media(max-width:850px){.lib-star-rules{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:550px){.lib-student-tiles{grid-template-columns:1fr 1fr;gap:6px}.lib-form label.lib-student-tile{padding:8px}.lib-star-rules{grid-template-columns:1fr 1fr}.lib-star-top h2{font-size:23px}}
@media(max-width:380px){.lib-student-tiles{grid-template-columns:1fr}}

/* P104: simple classroom buttons and full-height student list */
.lib-room-fieldset{border:0;padding:0;margin:0;min-width:0}
.lib-room-fieldset legend,.lib-star-filter-title{font-size:14px;font-weight:800;color:#4c385e;margin-bottom:8px}
.lib-room-buttons{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 4px}
.lib-room-button{font-family:inherit;font-size:14px;font-weight:800;line-height:1.2;border:1px solid #dacde9;background:#fff;color:#5c417f;min-height:40px;padding:9px 16px;border-radius:12px;cursor:pointer;transition:background .15s,border-color .15s}
.lib-room-button:hover{background:#f5effc;border-color:#a887cc;color:#4a2873}
.lib-room-button.is-active,.lib-room-button[aria-pressed="true"]{background:#674095;border-color:#674095;color:#fff;box-shadow:0 0 0 2px #e6d8f5}
.lib-room-button:focus-visible{outline:3px solid #c9aaf0;outline-offset:2px}
.lib-student-tiles{max-height:none!important;height:auto!important;overflow:visible!important;align-content:start}
.lib-student-pick-list{min-width:0}
.lib-star-ranking{max-height:none!important;overflow-y:visible!important}
.lib-star-filter{margin-bottom:12px}
/* P104: compact red circular sign-out */
.lib-side-bottom{display:flex;align-items:center;justify-content:center;padding:14px 0}
.lib-side-bottom form{display:flex;justify-content:center;align-items:center;margin:0}
.lib-side-logout,.lib-side-logout:hover{width:49px!important;height:49px!important;min-height:49px!important;min-width:49px!important;padding:0!important;border-radius:50%!important;background:#dc314a!important;color:#fff!important;border:1px solid #f17485!important;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 5px 14px rgba(156,26,53,.25);cursor:pointer}
.lib-side-logout:hover{background:#b91f3b!important;transform:translateY(-1px)}
.lib-side-logout:focus-visible{outline:3px solid #fbb9c4;outline-offset:3px}
.lib-side-logout svg{width:22px;height:22px}
/* P104: account settings reachable through the name in top bar */
.lib-account-trigger,.lib-account-static{display:flex;align-items:center;gap:9px;max-width:100%;background:none;border:0;padding:4px 0;font-family:inherit;text-align:left;color:#3d2a55}
.lib-account-trigger{cursor:pointer;border-radius:10px}
.lib-account-trigger:hover{background:#f7f0ff}
.lib-account-trigger:focus-visible{outline:3px solid #c9aaf0;outline-offset:3px}
.lib-account-trigger>svg{width:16px;height:16px;flex:none;color:#745c93}
.lib-pin-dialog{position:fixed;inset:0;margin:auto;width:min(480px,calc(100vw - 26px));max-height:calc(100dvh - 28px);overflow:auto;border-radius:20px;border:1px solid #e0d6ed;background:#fff;color:#3d2a55;padding:24px;box-shadow:0 20px 60px rgba(26,13,46,.2);font-family:'Sarabun',sans-serif}
.lib-pin-dialog::backdrop{background:rgba(24,13,42,.53)}
.lib-pin-dialog-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}
.lib-pin-dialog-head h2{font-size:21px;color:#37234f;margin:0}
.lib-pin-close{display:grid;place-items:center;width:37px;height:37px;border:1px solid #e2d9ee;background:#f8f4fd;border-radius:11px;cursor:pointer;font-size:27px;line-height:1;color:#59387f}
.lib-pin-dialog .lib-form label{display:grid;gap:6px;font-size:14px;font-weight:750;color:#49335e}
.lib-pin-dialog .lib-form input{width:100%;box-sizing:border-box;padding:11px;border:1px solid #dbcfec;border-radius:11px;font-size:15px;min-height:44px;background:#fff}
.lib-pin-dialog .lib-form input:focus{outline:3px solid #e6d6fb;border-color:#8352ab}
.lib-pin-help{margin:0;color:#756585;font-size:13px}
.lib-staff-actions{display:flex;flex-wrap:wrap;gap:7px;align-items:center}
.lib-staff-actions form{margin:0}
.lib-btn.lib-reset-pin{background:#f3edfd;border-color:#ddc9f1;color:#583586!important}
.lib-btn.lib-reset-pin:hover{background:#e7dcf7}
@media(max-width:530px){.lib-room-buttons{gap:6px}.lib-room-button{min-height:38px;padding:8px 12px;font-size:13px}.lib-account-trigger .lib-user-details small{font-size:10px}.lib-pin-dialog{padding:18px}.lib-pin-dialog .lib-form-row{grid-template-columns:1fr}}


/* P105 — bright, flexible library dashboard. Purely visual; no SDC styles touched. */
body.lib-site{background:#f8f8fb}
.lib-main>.lib-wrap{max-width:none}
/* Count all current metric cards dynamically, so both six and seven fit in one row on desktop. */
.lib-metrics{--lib-metric-count:6;grid-template-columns:repeat(var(--lib-metric-count),minmax(0,1fr));gap:11px;align-items:stretch}
.lib-metric{--lib-accent:#7550a7;--lib-accent-dark:#4e297d;--lib-tint:#f2eafb;min-width:0;display:flex;flex-direction:column;justify-content:space-between;min-height:134px;padding:15px 15px 13px;border:1px solid #e9e2ee;border-top:3px solid var(--lib-accent);border-radius:16px;box-shadow:0 5px 15px rgba(47,30,73,.045);transition:transform .23s ease,border-color .23s ease,box-shadow .23s ease;background:#fff}
.lib-metric:nth-child(2){--lib-accent:#5b69b7;--lib-accent-dark:#39458f;--lib-tint:#eef0ff}
.lib-metric:nth-child(3){--lib-accent:#168b7e;--lib-accent-dark:#11695e;--lib-tint:#e8f7f3}
.lib-metric:nth-child(4){--lib-accent:#3880b9;--lib-accent-dark:#25608d;--lib-tint:#e9f4fc}
.lib-metric:nth-child(5){--lib-accent:#d66568;--lib-accent-dark:#a43d48;--lib-tint:#fff0ef}
.lib-metric:nth-child(6){--lib-accent:#b47a29;--lib-accent-dark:#8b5914;--lib-tint:#fff5e4}
.lib-metric:nth-child(7){--lib-accent:#a357ad;--lib-accent-dark:#7b3689;--lib-tint:#fbecfa}
.lib-metric .lib-metric-icon,.lib-metric:nth-child(n) .lib-metric-icon{background:var(--lib-tint);color:var(--lib-accent-dark);width:37px;height:37px;flex-basis:37px;border-radius:12px;transition:transform .24s ease}
.lib-metric small{min-width:0;color:#655c70;font-size:13px;line-height:1.35;overflow-wrap:anywhere}
.lib-metric b{font-size:clamp(24px,2vw,32px);line-height:1.17;color:var(--lib-accent-dark);margin:10px 0 0 0;font-weight:800;letter-spacing:-.6px}
.lib-metric:hover{transform:translateY(-5px);box-shadow:0 14px 27px rgba(53,35,74,.13);border-color:var(--lib-accent)}
.lib-metric:hover .lib-metric-icon{transform:translateY(-2px) rotate(-5deg)}
.lib-dashboard-intro{transition:transform .25s ease,box-shadow .25s ease}
.lib-dashboard-intro:hover{transform:translateY(-2px);box-shadow:0 16px 30px rgba(77,45,123,.17)}
.lib-intro-shortcuts a{transition:transform .22s ease,box-shadow .22s ease,background .22s ease}
.lib-intro-shortcuts a:hover{transform:translateY(-3px);box-shadow:0 8px 17px rgba(32,15,56,.17)}
.lib-intro-shortcuts a:hover svg{transform:translateX(2px)}
.lib-intro-shortcuts svg{transition:transform .22s ease}
.lib-grid-two .lib-card{transition:transform .23s ease,box-shadow .23s ease,border-color .23s ease}
.lib-grid-two .lib-card:hover{transform:translateY(-3px);box-shadow:0 11px 26px rgba(54,36,76,.09);border-color:#d2c6e4}
.lib-section-icon{background:#e9f5f2;color:#167c72}
.lib-grid-two>.lib-card:nth-child(2) .lib-section-icon{background:#eef0ff;color:#5b66a9}
.lib-bar-track i{background:#269785;transition:filter .22s ease}
.lib-bar-row:hover .lib-bar-track i{filter:brightness(1.12)}
.lib-wrap tbody tr{transition:background-color .16s ease}
.lib-wrap tbody tr:hover td,.lib-wrap tbody tr:nth-child(even):hover td{background:#f2eff9}
.lib-side-nav a{transition:background-color .18s ease,color .18s ease,transform .18s ease}
.lib-side-nav a:hover{transform:translateX(3px)}
.lib-btn,.lib-room-button,.lib-topbar .lib-public-link{transition:background-color .18s ease,color .18s ease,transform .18s ease,box-shadow .18s ease}
.lib-btn:hover,.lib-room-button:hover{transform:translateY(-2px);box-shadow:0 6px 13px rgba(75,47,95,.1)}
.lib-btn:active,.lib-room-button:active{transform:translateY(0)}
.lib-student-tile{transition:transform .18s ease,background .18s ease,border-color .18s ease}
.lib-student-tile:hover{transform:translateY(-2px)}
.lib-metric{animation:libP105Enter .48s ease backwards}
.lib-metric:nth-child(2){animation-delay:.045s}.lib-metric:nth-child(3){animation-delay:.09s}.lib-metric:nth-child(4){animation-delay:.135s}.lib-metric:nth-child(5){animation-delay:.18s}.lib-metric:nth-child(6){animation-delay:.225s}.lib-metric:nth-child(7){animation-delay:.27s}
@keyframes libP105Enter{from{opacity:0;transform:translateY(11px)}to{opacity:1;transform:translateY(0)}}
/* More space per item only when screen is narrow. No orphan sixth card on desktops. */
@media(max-width:1279px){.lib-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:750px){.lib-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:430px){.lib-metric{padding:13px 11px;min-height:118px}.lib-metric-top{gap:7px}.lib-metric small{font-size:13px}.lib-metric b{font-size:25px}}
@media(max-width:350px){.lib-metrics{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.lib-metric{animation:none!important}.lib-dashboard-intro,.lib-grid-two .lib-card,.lib-metric,.lib-btn,.lib-room-button,.lib-side-nav a,.lib-intro-shortcuts a,.lib-student-tile,.lib-intro-shortcuts svg{transform:none!important;transition:none!important}}