/* R132 - Masuk, daftar, kode QR, tautan bagikan, dan sesi berakhir mengikuti papan situs-* dan web-*. */

/* auth-04: passkey hanya untuk akun yang sudah ada, jadi tab Daftar tidak menampilkannya. */
body:not(.console-page) .auth-tabs134:has([data-action=auth-register][aria-selected=true])~.passkey140{display:none}

/* auth-02: kalimat persetujuan Google di /auth/. */
body:not(.console-page) .auth-consent-note{margin:14px 0 0;text-align:center;line-height:1.5}
body:not(.console-page) .auth-consent-note+.auth-legal134{margin-top:24px}

/* auth-06, auth-07: kepala kartu, tirai, dan bayangan seperti papan situs-masuk. */
@media(min-width:761px){
 body:not(.console-page) #site-auth,
 body:not(.console-page) .auth-card132:has(.auth-tabs134){width:460px;max-width:min(460px,calc(100vw - 32px));padding:28px 32px;border:0;border-radius:26px}
 body:not(.console-page) #site-auth .auth-symbol134,
 body:not(.console-page) .auth-card132 .auth-symbol-wrap134{display:none}
 body:not(.console-page) .auth-tabs134[role=tablist]{justify-content:flex-start;gap:26px;margin:0 0 44px;border-bottom:1px solid var(--line)}
 body:not(.console-page) #site-auth .auth-tabs134[role=tablist]{margin-bottom:30px}
 body:not(.console-page) .auth-tabs134[role=tablist] button{height:48px;padding:0 2px;border:0;font-size:18px;font-weight:500}
 body:not(.console-page) .auth-tabs134[role=tablist] [aria-selected=true]{font-weight:700;box-shadow:inset 0 -3px 0 var(--accent)}
 body:not(.console-page) #site-auth .auth-close132,
 body:not(.console-page) .auth-card132:has(.auth-tabs134) .auth-close132{top:30px;right:32px;width:40px;height:40px;border-radius:50%;background:var(--surface-2);color:var(--ink)}
 body:not(.console-page) .auth-card132:has(.auth-tabs134:not([role=tablist])) .auth-close132{top:28px}
 body:not(.console-page) .auth-tabs134:not([role=tablist]){padding-right:50px}
 body:not(.console-page):not(.share129):not([data-console=true] *) .auth-stage132{background:rgba(12,30,45,.55)}
 :root[data-theme=dark] body:not(.console-page):not(.share129):not([data-console=true] *) .auth-stage132{background:rgba(0,0,0,.65)}
 body:not(.console-page) .auth-card132:has(.auth-tabs134){box-shadow:0 30px 70px rgba(12,30,45,.25)}
 :root[data-theme=dark] body:not(.console-page) .auth-card132:has(.auth-tabs134){box-shadow:0 30px 70px rgba(0,0,0,.5)}
}
/* authShell melepas console-page di halaman token konsol, jadi tirai situs dibatasi lewat data-console. */
body:not(.console-page):not([data-console=true] *) .auth-background132{filter:none}
body:not(.console-page) #site-auth{box-shadow:0 30px 70px rgba(12,30,45,.25)}
:root[data-theme=dark] body:not(.console-page) #site-auth{box-shadow:0 30px 70px rgba(0,0,0,.5)}
body:not(.console-page) #site-auth::backdrop{background:rgba(12,30,45,.55);backdrop-filter:none}
:root[data-theme=dark] body:not(.console-page) #site-auth::backdrop{background:rgba(0,0,0,.65)}

/* auth-08: label di tengah tombol dialog situs. */
body:not(.console-page) #site-auth .auth-option134{justify-content:center}
body:not(.console-page) #site-auth .auth-option134 img{position:absolute;left:20px}

/* auth-09: baris ikon dan baris legal. Teks pemisah menjadi item flex selebar 0, jadi gap terjadi dua kali. */
body:not(.console-page) .auth-legal134{display:flex;justify-content:center;gap:16px;margin:62px 0 0;font-size:0!important}
body:not(.console-page) .auth-legal134 a{font-size:14px;text-decoration:underline}
body:not(.console-page) .auth-icons134{gap:12px;margin-top:4px}
body:not(.console-page) #site-auth .auth-icons134{margin-top:18px}
body:not(.console-page) #site-auth #provider-status134{margin:0}
body:not(.console-page) #site-auth #provider-status134:not(:empty){margin-top:12px}
body:not(.console-page) .auth-option134 img{width:24px;height:24px}
body:not(.console-page) .auth-icons134 svg path{stroke-linecap:round;stroke-linejoin:round}

/* auth-05, auth-10: layar kode QR. */
body:not(.console-page) .auth-tabs134:not([role=tablist]){justify-content:flex-start;gap:10px;min-height:40px;margin:0 0 18px}
body:not(.console-page) .auth-tabs134:not([role=tablist]) button{display:flex;align-items:center;gap:6px;height:40px;padding:0 10px 0 4px;margin-left:-4px;border:0;color:var(--ink);font-size:15px;font-weight:700;text-decoration:none}
body:not(.console-page) .auth-tabs134:not([role=tablist]) button::before{content:'';width:9px;height:9px;margin-left:4px;border-left:2.2px solid currentColor;border-bottom:2.2px solid currentColor;transform:rotate(45deg)}
body:not(.console-page) .auth-tabs134:not([role=tablist]) strong{margin-left:auto;font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
body:not(.console-page) .qr-title{margin:0 0 18px;font-size:24px;font-weight:700;line-height:1.25;letter-spacing:-.015em}
body:not(.console-page) .login-qr134{width:220px;height:220px;padding:12px;box-sizing:border-box;border:1px solid var(--line);border-radius:18px;background:#fff}
body:not(.console-page) #qr-content134 .btn{margin-top:12px}
body:not(.console-page) #qr-content134~.auth-legal134{display:none}
body:not(.console-page) .qr-steps{counter-reset:qr132;display:flex;flex-direction:column;gap:10px;margin:0 0 14px;padding:0;list-style:none;font-size:15px;line-height:1.5}
body:not(.console-page) .qr-steps li{counter-increment:qr132;display:flex;align-items:flex-start;gap:10px}
body:not(.console-page) .qr-steps li::before{content:counter(qr132);flex:0 0 24px;height:24px;border-radius:50%;background:var(--soft);color:var(--soft-ink);font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center}

/* LINK-01: halaman tautan terkunci. Kartu tetap berlatar di semua lebar, termasuk di bawah 761px. */
body:not(.console-page).share129{--lock132:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='11' width='16' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E");--eye132:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s4-7 10-7 10 7 10 7-4 7-10 7S2 12 2 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");--eye-off132:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s4-7 10-7 10 7 10 7-4 7-10 7S2 12 2 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M4 4l16 16'/%3E%3C/svg%3E")}
body:not(.console-page).share129 #app{display:flex;flex-direction:column;min-height:100dvh}
body:not(.console-page).share129 .auth-stage132{flex:1;min-height:0;padding:24px 16px 40px;align-items:center}
body:not(.console-page).share129 .auth-logo132,
body:not(.console-page).share129 .auth-close132,
body:not(.console-page).share129 .auth-theme132{display:none}
body:not(.console-page).share129 .auth-card132{width:440px;max-width:100%;padding:30px;background:var(--surface);border:1px solid var(--line);border-radius:28px;box-shadow:0 24px 60px rgba(12,30,45,.1)}
body:not(.console-page).share129 .auth-card132 h1{position:relative;margin:0 0 16px;font-size:20px;font-weight:700;line-height:1.2;letter-spacing:-.02em}
body:not(.console-page).share129 .auth-card132 h1::before{content:'';display:block;width:56px;height:56px;margin-bottom:16px;border-radius:18px;background:var(--soft)}
body:not(.console-page).share129 .auth-card132 h1::after{content:'';position:absolute;left:14px;top:14px;width:28px;height:28px;background:var(--soft-ink);-webkit-mask:var(--lock132) center/contain no-repeat;mask:var(--lock132) center/contain no-repeat}
body:not(.console-page).share129 .auth-card132 p.muted{margin:14px 0 0;font-size:13px;line-height:1.5;text-align:center}
body:not(.console-page).share129 .auth-card132 .btn{height:48px;min-height:48px;border-radius:24px;font-weight:700}
body:not(.console-page).share129 #share-form .field{position:relative;margin:0 0 12px}
body:not(.console-page).share129 #share-form .field>span:first-child{font-size:13px;font-weight:600;color:var(--ink)}
body:not(.console-page).share129 #share-form .input{height:48px;min-height:48px;padding-right:48px;background:var(--surface);border-radius:12px}
body:not(.console-page).share129 .share-top132{display:flex;align-items:center;gap:16px;min-height:68px;box-sizing:border-box;padding:12px 28px}
body:not(.console-page).share129 .share-top132 img{display:block;width:auto;height:34px}
body:not(.console-page).share129 .share-top132 nav{display:flex;align-items:center;gap:10px;margin-left:auto}
body:not(.console-page).share129 .share-top132 nav a{display:flex;align-items:center;height:40px;padding:0 14px;color:var(--link);font-size:14px;font-weight:700;text-decoration:none}
body:not(.console-page).share129 .share-top132 nav a+a{padding:0 16px;border-radius:20px;background:var(--accent);color:var(--on-accent)}
body:not(.console-page).share129 .share-foot132{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 20px;padding:16px 28px;color:var(--muted);font-size:13px}
body:not(.console-page).share129 .share-foot132 a,
body:not(.console-page).share129 .share-foot132 button{min-height:0;padding:0;border:0;background:none;color:var(--muted);font:inherit;text-decoration:none;cursor:pointer}
body:not(.console-page).share129 .share-foot132 a:hover,
body:not(.console-page).share129 .share-foot132 button:hover{text-decoration:underline}

/* LINK-03: galat sandi dan tombol tampilkan sandi. Span dipakai karena tombol pertama form dinonaktifkan oleh kode lama. */
body:not(.console-page).share129 #share-error{margin:0;line-height:1.45}
body:not(.console-page).share129 #share-error:not(:empty){margin:0 0 12px;padding:10px 12px;border-radius:10px;background:var(--danger);color:var(--danger-ink);font-size:13px}
body:not(.console-page).share129 #share-form:has(#share-error:not(:empty)) .input{border:2px solid var(--danger-ink)}
body:not(.console-page).share129 #share-form .share-eye132{position:absolute;right:6px;bottom:6px;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;color:var(--muted);cursor:pointer}
body:not(.console-page).share129 #share-form .share-eye132::before{content:'';width:18px;height:18px;background:currentColor;-webkit-mask:var(--eye132) center/contain no-repeat;mask:var(--eye132) center/contain no-repeat}
body:not(.console-page).share129 #share-form .share-eye132[aria-pressed=true]::before{-webkit-mask-image:var(--eye-off132);mask-image:var(--eye-off132)}
body:not(.console-page).share129 #share-form .share-eye132:hover{background:var(--surface-2)}
body:not(.console-page).share129 #share-form .share-eye132:focus-visible{outline:2px solid var(--accent);outline-offset:1px}

/* LINK-05: tautan yang tidak bisa dipakai lagi. Form lama tetap ada agar web129 tidak terganggu. */
body:not(.console-page).share129 .share-ended132 h1,
body:not(.console-page).share129 .share-ended132 p.muted,
body:not(.console-page).share129 .share-ended132 #share-form{display:none}
body:not(.console-page).share129 .share-gone135 h2{margin:0 0 8px;font-size:20px;font-weight:700;line-height:1.2;letter-spacing:-.02em}
body:not(.console-page).share129 .share-gone135 p{margin:0;color:var(--muted);font-size:15px;line-height:1.5}

/* LINK-07: progres unduhan. */
body:not(.console-page).share129 .share-progress132{display:flex;flex-direction:column;gap:8px;margin-top:12px;padding:12px 14px;border-radius:14px;background:var(--soft);color:var(--soft-ink);font-size:13px;overflow-wrap:anywhere}
body:not(.console-page).share129 .share-progress132[hidden]{display:none}
body:not(.console-page).share129 .share-progress132 div:not(.share-track132){display:flex;justify-content:space-between;gap:10px}
body:not(.console-page).share129 .share-progress132 b{font-weight:700}
body:not(.console-page).share129 .share-track132{height:6px;border-radius:3px;background:var(--surface);overflow:hidden}
body:not(.console-page).share129 .share-track132 i{display:block;width:0;height:100%;background:var(--accent)}

@media(max-width:760px){
 body:not(.console-page).share129 .share-top132{padding:12px 16px}
 body:not(.console-page).share129 .share-top132 img{height:28px}
 body:not(.console-page).share129 .share-top132 nav{gap:4px}
 body:not(.console-page).share129 .share-foot132{padding:16px}
}

/* SESI-01: dialog sesi berakhir. */
body:not(.console-page) #dialog.session-dialog132{width:420px;max-width:calc(100vw - 32px);box-sizing:border-box;padding:28px;border:0;border-radius:24px;box-shadow:0 24px 60px rgba(0,0,0,.3)}
body:not(.console-page) #dialog.session-dialog132::backdrop{background:rgba(12,30,45,.45);backdrop-filter:none}
:root[data-theme=dark] body:not(.console-page) #dialog.session-dialog132::backdrop{background:rgba(0,0,0,.6)}
body:not(.console-page) #dialog.session-dialog132 .dialog-head{display:block;margin:0 0 6px}
body:not(.console-page) #dialog.session-dialog132 .dialog-head::before{content:'';display:block;width:48px;height:48px;margin-bottom:16px;background:url(/static/storageku-symbol.png) left center/contain no-repeat}
body:not(.console-page) #dialog.session-dialog132 #dialog-close{display:none}
body:not(.console-page) #dialog.session-dialog132 #dialog-title{margin:0;font-size:20px;font-weight:700;letter-spacing:-.02em}
body:not(.console-page) #dialog.session-dialog132 #session-note132{margin:0 0 16px;color:var(--muted);font-size:15px;line-height:1.5}
body:not(.console-page) .session-who132{display:flex;align-items:center;gap:10px;min-height:48px;box-sizing:border-box;margin-bottom:12px;padding:0 14px;border-radius:12px;background:var(--surface-2);font-size:15px;overflow-wrap:anywhere}
body:not(.console-page) .session-who132 .avatar{display:flex;align-items:center;justify-content:center;flex:0 0 28px;width:28px;height:28px;background:var(--soft);color:var(--soft-ink);font-size:13px;font-weight:700}
body:not(.console-page) #dialog.session-dialog132 .auth-option134{justify-content:center;height:54px;min-height:54px;padding:0 18px;border-radius:20px}
body:not(.console-page) #dialog.session-dialog132 .auth-option134 img{position:absolute;left:18px}
body:not(.console-page) .session-other132{margin:16px 0 0;text-align:right;font-size:13px}
body:not(.console-page) .session-other132 .link{font-size:13px;font-weight:700;text-decoration:none}
body:not(.console-page) .session-other132 .link:hover{text-decoration:underline}
