:root{font-family:system-ui,-apple-system,Segoe UI,sans-serif;color:#eaf1ff;background:#07182f}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at top right,#174e89,#07182f 60%)}header{padding:16px max(20px,calc((100vw - 1050px)/2));display:flex;justify-content:space-between;align-items:center;background:#081b38;border-bottom:1px solid #ffffff27;gap:16px}.logo{font-weight:800;letter-spacing:.08em}.logo b{color:#6fd3ff}nav{display:flex;align-items:center;gap:18px}nav form{display:inline}main{max-width:1050px;margin:42px auto;padding:0 20px 50px;min-height:65vh}h1{font-size:clamp(28px,5vw,43px)}h2{font-size:21px}a{color:#78d5ff;text-decoration:none}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px}.card{padding:24px;margin:18px 0;border:1px solid #ffffff26;background:#ffffff0d;border-radius:18px;box-shadow:0 15px 40px #0002}.narrow{max-width:480px}.actions{display:flex;gap:12px;flex-wrap:wrap}label{display:block;margin:14px 0;font-weight:600}input:not([type=checkbox]):not([type=radio]),select{display:block;width:100%;padding:12px;margin-top:7px;border-radius:9px;border:1px solid #7595b9;background:#eff7ff;color:#0c2345;font:inherit}input[type=checkbox],input[type=radio]{margin-right:8px}button,.button{display:inline-block;background:#7ad7fb;color:#082548;border:0;border-radius:10px;padding:12px 18px;font:inherit;font-weight:800;cursor:pointer}.button.muted{background:#dce8f5}.link{background:none;padding:0;color:#7ad7fb}button.danger{background:#ffcaad}p{line-height:1.55;color:#d0ddec}.note{color:#ffd9a3}details{margin-top:26px}summary{cursor:pointer}.choice{padding:9px;border-radius:8px;background:#ffffff0b}footer{text-align:center;padding:22px;color:#a3bdd7;font-size:13px}@media(max-width:620px){header{flex-wrap:wrap}main{margin-top:24px}.card{padding:18px}}

.external{display:block;width:100%;height:min(75vh,1100px);min-height:520px;border:0;border-radius:10px;background:#fff}@media(max-width:620px){.external{height:70vh}}

/* Layar akses mengikuti referensi SMART DIGITAL-SMANSA-MANADO. */
body.access-body{background:#fff;color:#202340;min-height:100dvh;overflow-x:hidden;position:relative}
.access-top{position:absolute;inset:0 0 auto;height:clamp(138px,19vh,210px);background:linear-gradient(112deg,#fbd524 0%,#e28579 47%,#a34cbb 100%);clip-path:polygon(0 0,100% 0,93% 24%,86% 45%,77% 56%,68% 53%,53% 42%,43% 43%,31% 68%,23% 100%,16% 91%,9% 65%,0 64%)}
.access-bottom{position:absolute;bottom:0;left:0;width:min(43vw,310px);height:min(31vh,345px);background:linear-gradient(135deg,#ba67c9,#813ac1);clip-path:polygon(0 0,14% 10%,28% 24%,32% 43%,32% 65%,38% 79%,67% 91%,88% 100%,0 100%);pointer-events:none}
.access-main{position:relative;z-index:1;width:min(100%,760px);margin:auto;padding:clamp(190px,17vh,245px) 28px 155px;min-height:100dvh;text-align:center}
.access-logo{width:210px;height:215px;background:url('/logo-sekolah.png') center/contain no-repeat;margin:0 auto 48px;border-radius:50%}
.access-eyebrow{font-size:13px;letter-spacing:.2em;color:#8c8be0;font-weight:800;margin:0 0 12px}
.access-title{color:#787be5;font-size:clamp(27px,5.9vw,48px);line-height:1.18;letter-spacing:.025em;margin:0;font-weight:800;overflow-wrap:anywhere}
.access-subtitle{font-size:16px;color:#747b93;margin:14px 0 24px}
.access-form{max-width:640px;margin:0 auto}
.access-form label{text-align:left;font-size:14px;font-weight:650;color:#666a92;margin:14px 0}
.access-form input:not([type=checkbox]):not([type=radio]){width:100%;border:2px solid #8185ec;background:#fff;border-radius:999px;min-height:68px;padding:13px 26px;font-size:20px;color:#30385a;box-shadow:0 4px 7px #171b4a20;outline:none}
.access-form input:focus-visible{border-color:#575cce;box-shadow:0 0 0 4px #8185ec33}
.access-actions{display:flex;justify-content:flex-end;margin-top:65px}
.access-button{width:min(275px,48%);min-height:85px;background:#7d7ff0;color:#fff;border-radius:7px;box-shadow:0 4px 8px #15154c22;font-size:23px;letter-spacing:.02em}
.access-button:hover,.access-button:focus-visible{background:#6267d6}
.access-back{display:inline-block;margin-top:28px;color:#6267d6;font-weight:700}
@media(max-width:620px){.access-main{padding:clamp(134px,17vh,190px) 20px 140px}.access-top{height:clamp(145px,20vh,200px)}.access-logo{width:140px;height:143px;background-size:contain;background-position:center;margin-bottom:32px}.access-title{font-size:clamp(23px,6.2vw,34px)}.access-form input:not([type=checkbox]):not([type=radio]){min-height:58px;font-size:17px}.access-actions{margin-top:45px}.access-button{min-height:66px;font-size:19px}.access-bottom{width:50vw;height:26vh}}

/* Beranda siswa sesudah Password Masuk. */
body.dashboard-body{background:#7778f4;color:#1d2542}
.dashboard-main{max-width:760px;margin:0 auto;padding:0;min-height:100dvh}
.dashboard-hero{color:#fff;min-height:290px;padding:28px 30px 16px}
.dashboard-hero time{display:block;font-weight:800;font-size:25px;letter-spacing:.03em}
.weather-icon{font-size:37px;margin:22px 0 8px}
.dashboard-hero h1{font-size:clamp(28px,5vw,37px);margin:0 0 2px}
.dashboard-hero p{font-size:clamp(17px,3.8vw,25px);max-width:600px;margin:0;color:#fff;line-height:1.2}
.student-name{display:block;margin-top:12px;font-size:13px;opacity:.8}
.dashboard-banner{width:calc(100% - 70px);margin:0 auto -76px;position:relative;z-index:2;aspect-ratio:635/376;border-radius:18px;background:#e7eddc url('/dashboard-reference.jpeg') center 25%/112% auto no-repeat;box-shadow:0 5px 12px #17105028;overflow:hidden}
.banner-text{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);padding:6px 14px;border-radius:8px;background:#ffffffdf;color:#335237;font-size:clamp(11px,2.6vw,17px);font-weight:900;text-align:center;max-width:92%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dashboard-panel{min-height:730px;background:#fff;border-radius:55px 55px 0 0;padding:165px 28px 34px;display:flex;flex-direction:column}
.dashboard-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:36px 24px}
.menu-tile{color:#1f2333;text-align:center;display:flex;flex-direction:column;align-items:center;gap:9px;font-size:15px;line-height:1.2}
.tile-icon{width:100%;max-width:135px;aspect-ratio:1;background:#797bf1;border-radius:29px;box-shadow:0 5px 9px #23206024;display:grid;place-items:center;font-size:clamp(34px,7vw,64px);color:#fff}
.menu-tile:focus-visible .tile-icon,.menu-tile:hover .tile-icon{outline:3px solid #292ea0;transform:translateY(-2px)}
.dashboard-footer{display:block;margin:auto auto 0;padding-top:80px;text-align:center;font-size:clamp(16px,3.6vw,24px);color:#111;line-height:1.25}
fieldset{border:1px solid #ffffff45;border-radius:12px;margin:18px 0;padding:14px}legend{padding:0 8px}
@media(max-width:620px){.dashboard-hero{min-height:270px;padding:24px 20px}.dashboard-banner{width:calc(100% - 36px);margin-bottom:-46px}.dashboard-panel{border-radius:42px 42px 0 0;padding:105px 18px 28px;min-height:650px}.dashboard-grid{gap:25px 13px}.tile-icon{border-radius:22px}.menu-tile{font-size:12px}.dashboard-footer{padding-top:70px}}
@media(max-width:380px){.dashboard-grid{grid-template-columns:repeat(3,1fr)}.dashboard-panel{padding-top:95px}}

/* Pemilihan mapel di dalam E-UJIAN, mengikuti referensi kartu berwarna. */
body.subject-body{background:linear-gradient(145deg,#143761 0%,#132e60 52%,#dbe7ff 52%,#edf3ff 100%);color:#192b4a}
.subject-main{max-width:1120px;margin:0 auto;padding:0 24px 70px}
.subject-hero{border-radius:0 0 30px 30px;padding:54px 55px 72px;color:#fff;background:linear-gradient(120deg,#102a59,#215dad 70%,#42aee8);min-height:300px}
.subject-hero a{color:#fff}.subject-hero p{display:table;background:#ffffff23;border:1px solid #ffffff45;border-radius:24px;padding:7px 15px;font-size:12px;letter-spacing:.1em;font-weight:800;margin:24px 0}
.subject-hero h1{font-size:clamp(33px,5vw,60px);line-height:1.1;margin:0 0 17px;max-width:670px}.subject-hero span{font-size:18px}
.subject-panel{position:relative;margin:20px 0 0;padding:34px;background:#f8fbff;border-radius:28px;box-shadow:0 15px 40px #12315f20}
.subject-head{display:flex;justify-content:space-between;align-items:end;gap:18px;margin-bottom:22px}.subject-head b{font-size:12px;color:#205cb0;letter-spacing:.1em}.subject-head h2{font-size:27px;margin:8px 0 0}.subject-head form{width:min(300px,100%)}.subject-head input{border:1px solid #d9e2fa;border-radius:13px;padding:14px;width:100%;font:inherit}
.subject-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.subject-card{min-height:150px;padding:18px;border-radius:20px;display:flex;flex-direction:column;justify-content:space-between;color:#fff;background:#159c91;box-shadow:0 7px 14px #12315f16;overflow-wrap:anywhere}.subject-card:hover,.subject-card:focus-visible{outline:3px solid #233c88;transform:translateY(-2px)}.subject-card strong{font-size:17px}.subject-card small{font-weight:700}.subject-icon{display:grid;place-items:center;width:40px;height:40px;border:1px solid #ffffff70;border-radius:12px;background:#ffffff24;font-weight:800}.color-1{background:linear-gradient(125deg,#c93162,#ed5c7b)}.color-2{background:linear-gradient(125deg,#285ed3,#2baee5)}.color-3{background:linear-gradient(125deg,#4c45bd,#777bf0)}.color-4{background:linear-gradient(125deg,#267e50,#19ae52)}.color-5{background:linear-gradient(125deg,#25324f,#1f5bd7)}.color-6{background:linear-gradient(125deg,#d3582a,#ef3f59)}.color-7{background:linear-gradient(125deg,#48505f,#a65410)}
@media(max-width:760px){.subject-main{padding:0 14px 45px}.subject-hero{padding:30px 25px 48px;min-height:250px}.subject-panel{padding:22px}.subject-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.subject-head{align-items:stretch;flex-direction:column}.subject-head form{width:100%}}
@media(max-width:390px){.subject-card{min-height:130px;padding:14px}.subject-card strong{font-size:14px}}

.qr-card{text-align:center;margin-inline:auto}.qr-card .qr-logo{width:100px;height:100px;object-fit:contain}.qr-card #seb-qr{display:flex;justify-content:center;margin:24px auto}.qr-card #seb-qr svg{width:min(100%,320px);height:auto;background:white;border-radius:14px}.qr-card .button{display:inline-block}