*{box-sizing:border-box}html{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;background:#f3f6fa;color:#10243e}body{margin:0;padding-bottom:90px}a{text-decoration:none;color:inherit}button,input,select,textarea{font:inherit}.kicker{font-size:10px;font-weight:900;letter-spacing:2px;color:#8fc4d3}.kicker.dark{color:#71849a}.logo-orb{width:54px;height:54px;border-radius:18px;background:linear-gradient(145deg,#0c3455,#0a7891);display:grid;place-items:center;color:#fff;font-size:25px;font-weight:900;box-shadow:0 10px 30px #061d3530}.logo-orb.small{width:42px;height:42px;border-radius:13px;font-size:19px}.login-v2{padding:0;min-height:100vh;background:#eef3f8}.login-shell{min-height:100vh;display:grid;grid-template-columns:1.15fr .85fr}.login-visual{position:relative;overflow:hidden;padding:44px 55px;color:#fff;background:radial-gradient(circle at 80% 20%,#176e83 0,#0b3a59 28%,#061c33 72%)}.login-visual:after{content:"";position:absolute;width:520px;height:520px;border:1px solid #ffffff10;border-radius:50%;right:-150px;top:110px;box-shadow:0 0 0 80px #ffffff05,0 0 0 160px #ffffff03}.visual-top{display:flex;align-items:center;gap:13px;position:relative;z-index:2}.visual-top b{display:block;font-size:20px}.visual-top span{font-size:8px;letter-spacing:1.8px;color:#a9c7d4}.visual-copy{position:absolute;z-index:3;left:8%;top:29%;max-width:610px}.visual-copy h1{font-size:clamp(44px,5vw,75px);line-height:.98;letter-spacing:-3px;margin:14px 0 22px}.visual-copy h1 em{font-style:normal;color:#70d0d4}.visual-copy p{font-size:16px;line-height:1.7;color:#c5d8e2;max-width:530px}.visual-pills{display:flex;gap:8px;flex-wrap:wrap;margin-top:25px}.visual-pills span{border:1px solid #ffffff1c;background:#ffffff0c;padding:9px 12px;border-radius:99px;font-size:11px}.float-card{position:absolute;z-index:4;display:flex;align-items:center;gap:10px;background:#ffffffef;color:#17324a;border-radius:15px;padding:11px 13px;box-shadow:0 18px 45px #0003}.float-card i{font-style:normal;width:38px;height:42px;border-radius:9px;background:#e8f2f4;display:grid;place-items:center;color:#08718b;font-size:10px;font-weight:900}.float-card b,.float-card small{display:block}.float-card b{font-size:11px}.float-card small{font-size:9px;color:#8492a0;margin-top:2px}.float-card strong{color:#0b8d73;margin-left:10px}.fc1{right:8%;bottom:24%}.fc2{right:22%;bottom:12%}.visual-foot{position:absolute;bottom:35px;font-size:9px;letter-spacing:1.5px;color:#7393a6}.visual-foot span{margin:0 7px}.login-panel{display:grid;place-items:center;padding:35px;background:#f8fafc}.login-box{width:min(430px,100%)}.login-box h2{font-size:34px;line-height:1.08;margin:10px 0}.login-box>p{color:#75869a;margin-bottom:28px}.login-box label,.form-card label{display:block;font-size:11px;font-weight:850;margin:14px 0 6px}.input-icon{display:flex;align-items:center;background:#fff;border:1px solid #dfe7ee;border-radius:13px;padding:0 12px}.input-icon input{border:0;outline:0;flex:1;padding:14px 9px;background:transparent}.eye{border:0;background:none;cursor:pointer}.login-btn{display:flex!important;justify-content:space-between}.secure-note{text-align:center;font-size:10px;color:#8997a5;margin-top:20px}.mobile-brand{display:none}.app-head{height:82px;max-width:1120px;margin:auto;padding:16px 22px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:10px}.brand b,.brand span{display:block}.brand b{font-size:18px}.brand span{font-size:8px;letter-spacing:1.4px;color:#8190a0}.head-actions{display:flex;align-items:center;gap:12px}.drive-state{font-size:10px;border:1px solid #dce5ed;background:#fff;padding:8px 10px;border-radius:99px;color:#8b98a6}.drive-state.on{color:#07826d}.avatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#0a2743;color:#fff;font-weight:900}.wrap{max-width:1120px;margin:auto;padding:0 20px}.hero-v2{position:relative;overflow:hidden;border-radius:28px;padding:38px 42px;background:linear-gradient(125deg,#08233e,#0d506a 68%,#11788b);color:#fff;display:flex;justify-content:space-between;gap:30px;box-shadow:0 22px 55px #0a294522}.hero-v2:after{content:"";position:absolute;width:300px;height:300px;border-radius:50%;border:1px solid #ffffff12;right:12%;top:-120px;box-shadow:0 0 0 55px #ffffff05}.hero-v2 h1{font-size:clamp(36px,5vw,58px);letter-spacing:-2px;line-height:.98;margin:11px 0 15px}.hero-v2 h1 em{font-style:normal;color:#76d2d3}.hero-v2 p{color:#c8dce5;max-width:580px}.hero-actions{display:flex;gap:9px;margin-top:22px}.hero-btn{background:#fff;color:#0b3550;padding:12px 16px;border-radius:11px;font-size:12px;font-weight:850}.hero-btn.ghost{background:#ffffff10;color:#fff;border:1px solid #ffffff20}.stats{position:relative;z-index:2;display:flex;align-self:center;background:#ffffff0c;border:1px solid #ffffff16;border-radius:20px;backdrop-filter:blur(10px)}.stats div{padding:20px 24px;text-align:center;border-right:1px solid #ffffff13}.stats div:last-child{border:0}.stats strong,.stats span{display:block}.stats strong{font-size:27px}.stats span{font-size:9px;color:#b9d0dc;white-space:nowrap}.smart-search{height:58px;margin:17px 0;display:flex;align-items:center;background:#fff;border:1px solid #e0e7ee;border-radius:16px;padding:0 16px;box-shadow:0 8px 30px #10243e08}.smart-search span{font-size:23px}.smart-search input{flex:1;border:0;outline:0;padding:0 12px}.smart-search kbd{font-size:8px;border:1px solid #e0e5eb;border-radius:6px;padding:5px;color:#83909c}.quick-v2{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.quick-v2 a{background:#fff;border:1px solid #e0e7ed;border-radius:17px;padding:16px;display:grid;grid-template-columns:40px 1fr;column-gap:10px}.quick-v2 i{grid-row:1/3;width:40px;height:40px;border-radius:12px;background:#e8f3f5;display:grid;place-items:center;font-style:normal;color:#08748b;font-size:18px}.quick-v2 b{font-size:12px;align-self:end}.quick-v2 span{font-size:9px;color:#8593a1;align-self:start}.section-title{display:flex;align-items:end;justify-content:space-between;margin:30px 2px 12px}.section-title h2{margin:4px 0 0;font-size:22px}.section-title>a,.section-title>span{font-size:10px;color:#74879a}.chips{display:flex;gap:7px;overflow:auto;padding-bottom:8px}.chips a{white-space:nowrap;padding:8px 12px;border-radius:99px;background:#fff;border:1px solid #dde5ec;font-size:10px}.chips a.active{background:#0a2945;color:#fff}.doc-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:5px}.doc-card{display:flex;align-items:center;background:#fff;border:1px solid #e1e8ef;border-radius:17px;padding:13px}.doc-main{display:flex;align-items:center;gap:12px;flex:1;min-width:0}.type{width:50px;height:54px;border-radius:12px;display:grid;place-items:center;background:#eaf2f5;color:#0a7187;font-size:10px;font-weight:950}.doc-info{min-width:0;flex:1}.doc-info b{font-size:13px}.doc-info div{display:flex;justify-content:space-between}.doc-info p{font-size:9px;color:#718399;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:5px 0}.doc-info small{font-size:8px;color:#a0aab4}.star{color:#d99d16}.more{padding:10px;color:#718399}.meeting-row{display:grid;gap:8px}.meeting-row article{display:flex;align-items:center;gap:15px;background:#fff;border:1px solid #e1e8ef;border-radius:16px;padding:13px}.meeting-row time{font-size:18px;font-weight:900;border-right:1px solid #e3e8ed;padding-right:15px}.meeting-row time small{display:block;font-size:7px}.meeting-row div{flex:1}.meeting-row b,.meeting-row span{display:block}.meeting-row span{font-size:9px;color:#8190a0}.meeting-row a{font-size:10px;font-weight:850;color:#08748b}.bottom-v2{position:fixed;z-index:50;left:0;right:0;bottom:0;height:70px;background:#fff;border-top:1px solid #dfe7ee;display:flex;align-items:center;justify-content:center;gap:clamp(25px,8vw,100px);padding-bottom:env(safe-area-inset-bottom)}.bottom-v2 a{display:grid;place-items:center;color:#78899b;min-width:48px}.bottom-v2 i{font-style:normal;font-size:18px}.bottom-v2 span{font-size:8px}.bottom-v2 .active{color:#08748b}.bottom-v2 .center{width:52px;height:52px;min-width:52px;border-radius:50%;background:#092945;color:#fff;font-size:28px;transform:translateY(-14px);box-shadow:0 8px 25px #09294555}.subhead{max-width:850px;margin:auto;padding:25px 20px 14px;display:flex;align-items:center;gap:13px}.subhead>a:first-child{font-size:34px}.subhead h1{font-size:23px;margin:3px 0}.detail-head>div{flex:1}.detail-head>a:last-child{font-size:18px}.form-wrap,.detail-wrap{max-width:760px;margin:auto;padding:0 20px}.form-card,.notice,.connect-card,.settings-card,.share-card,.preview,.meta-card,.meeting-hero{background:#fff;border:1px solid #e0e7ed;border-radius:21px;padding:22px;margin-bottom:12px}.notice{background:#eaf5f6}.notice p{font-size:12px;color:#64788a;margin-bottom:0}.form-card input,.form-card select,.form-card textarea,.share-card input{width:100%;border:1px solid #dbe4eb;border-radius:11px;padding:13px;background:#fff}.form-card textarea{min-height:85px}.two{display:grid;grid-template-columns:1fr 1fr;gap:11px}.check{display:flex!important;align-items:center;gap:8px}.check input{width:auto}.btn{display:block;width:100%;border:0;border-radius:12px;padding:14px;margin-top:12px;background:#edf2f5;text-align:center;font-weight:850;cursor:pointer}.btn.primary{background:#092945;color:#fff}.btn.danger{background:#fff0f0;color:#a43131}.alert{padding:12px;border-radius:12px;background:#fff0df;border:1px solid #ffd5a5;margin-bottom:12px}.connect-card{text-align:center;padding:40px}.connect-card .cloud{font-size:50px}.connect-card p{color:#6f8193;line-height:1.6}.connect-card small{display:block;color:#8c99a6;margin-top:12px}.dropzone{position:relative;border:1.5px dashed #a8c1cc;background:#f3fafb;border-radius:18px;padding:35px;text-align:center}.dropzone input{position:absolute;inset:0;opacity:0;cursor:pointer}.dropzone i,.dropzone b,.dropzone span{display:block}.dropzone i{font-size:32px}.dropzone span{font-size:10px;color:#8494a2;margin-top:5px}.preview{text-align:center;padding:40px}.preview-icon{margin:auto;width:76px;height:82px;border-radius:20px;background:#e7f1f4;display:grid;place-items:center;color:#08748b;font-size:20px;font-weight:950}.preview>span{display:block;margin-top:13px;font-size:9px;color:#7d8d9d}.preview h2{font-size:28px;margin:8px}.preview p{color:#708194;font-size:12px}.detail-actions{display:grid;grid-template-columns:1.5fr 1fr;gap:8px;max-width:520px;margin:auto}.meta-card{display:grid;grid-template-columns:1fr 1fr;gap:18px}.meta-card span,.meta-card b{display:block}.meta-card span{font-size:9px;color:#8997a4}.meta-card b{font-size:12px;margin-top:3px}.settings-card{display:flex;justify-content:space-between;align-items:center}.settings-card>div{display:flex;align-items:center;gap:12px}.settings-card p{font-size:10px;color:#8190a0;margin:3px 0}.settings-card>a{font-size:10px;color:#08748b;font-weight:800}.setting-icon{width:42px;height:42px;background:#eaf4f5;border-radius:12px;display:grid;place-items:center}.meeting-hero{text-align:center;background:linear-gradient(135deg,#092945,#0d6579);color:#fff}.meeting-hero>span{font-size:35px}.meeting-hero h2{font-size:28px}.meeting-hero p{font-size:11px;color:#c5dce4}.timeline{display:grid;gap:8px}.timeline>a{display:flex;align-items:center;gap:13px;background:#fff;border:1px solid #e0e7ed;border-radius:15px;padding:13px}.timeline time{width:58px;font-size:9px;color:#75879a}.timeline time b{display:block;font-size:17px;color:#10243e}.timeline div{flex:1}.timeline div b,.timeline div span{display:block}.timeline div b{font-size:12px}.timeline div span{font-size:9px;color:#8493a2}.share-card{text-align:center}.share-card input{margin-top:12px}.qr-placeholder{margin:18px auto 0;padding:25px;background:#f2f5f7;border-radius:15px;font-size:10px;color:#8795a2}.public-body{min-height:100vh;display:grid;place-items:center;padding:20px;background:#edf3f7}.public-card{width:min(470px,100%);background:#fff;padding:35px;border-radius:25px;text-align:center;box-shadow:0 25px 70px #10243e15}.public-card .logo-orb{margin:0 auto 20px}.public-card small{display:block;margin-top:15px;color:#8493a2}.empty{grid-column:1/-1;background:#fff;border:1px solid #e1e8ef;border-radius:17px;padding:30px;text-align:center;color:#718399}.empty i,.empty b{display:block}.empty i{font-size:28px}.empty p{font-size:11px}
@media(max-width:800px){.login-shell{grid-template-columns:1fr}.login-visual{display:none}.mobile-brand{display:flex;align-items:center;gap:10px;margin-bottom:45px}.login-panel{min-height:100vh;align-items:start;padding-top:45px}.login-box h2{font-size:30px}.stats{display:none}.quick-v2{grid-template-columns:1fr 1fr}.doc-grid{grid-template-columns:1fr}.hero-v2{padding:28px 24px}.hero-v2 h1{font-size:40px}.hero-actions{flex-direction:column}.head-actions .drive-state{display:none}}@media(max-width:520px){.wrap{padding:0 13px}.app-head{padding:13px;height:70px}.hero-v2{border-radius:22px}.hero-v2 p{font-size:12px}.quick-v2 a{padding:12px}.section-title{margin-top:25px}.two,.detail-actions,.meta-card{grid-template-columns:1fr}.subhead{padding-top:18px}.preview{padding:28px 18px}.login-panel{padding:35px 22px}}
/* =========================================================
MYDOKUMEN V3 - LOGIN
Dashboard dan fitur utama tetap menggunakan desain V2.
========================================================= */
.login-v3{min-height:100vh;padding:0;background:#f6f9fc;color:#102743;overflow-x:hidden;position:relative}
.login-v3:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 50% 10%,#fff 0,#f8fbfe 36%,#eef4fa 100%);z-index:-4}
.login-bg{position:fixed;border-radius:50%;z-index:-3;filter:blur(.2px)}
.login-bg-a{width:620px;height:620px;right:-230px;top:80px;background:linear-gradient(145deg,#dff4f6aa,#cfe8f555)}
.login-bg-b{width:520px;height:520px;left:-310px;bottom:-110px;background:linear-gradient(145deg,#dce9fb99,#edf3fb22)}
.login-dots{position:fixed;left:5%;top:45%;width:150px;height:110px;opacity:.35;background-image:radial-gradient(#aec1d4 2px,transparent 2px);background-size:24px 24px;z-index:-2}
.login-v3-wrap{min-height:100vh;display:grid;place-items:center;align-content:center;padding:45px 18px 70px}
.login-v3-card{width:min(590px,100%);background:#ffffffee;border:1px solid #e1e8ef;border-radius:27px;padding:48px 38px 0;box-shadow:0 25px 75px #17395716;backdrop-filter:blur(10px);overflow:hidden}
.login-v3-brand{text-align:center}
.doc-logo{width:92px;height:92px;margin:0 auto 17px;border-radius:24px;background:linear-gradient(145deg,#0790a2,#075a78);display:grid;place-items:center;color:#fff;box-shadow:0 15px 35px #08778e28;position:relative;overflow:hidden}
.doc-logo:after{content:"";position:absolute;right:0;top:0;width:27px;height:27px;background:#bce5eb;border-radius:0 0 0 13px}
.doc-logo span{font-size:43px;font-weight:850;letter-spacing:-2px}
.login-v3-brand h1{font-size:38px;letter-spacing:-1.4px;margin:0;color:#102b49}
.login-v3-brand p{font-size:15px;color:#718198;margin:7px 0 0}
.trust-row{display:flex;justify-content:center;align-items:center;gap:15px;margin:32px 0 25px;color:#667a95;font-size:12px}
.trust-row i{font-style:normal;color:#c0ccd8}
.login-v3-form label{display:block;font-size:12px;font-weight:800;margin:14px 0 7px;color:#10243e}
.login-field{height:57px;display:flex;align-items:center;border:1px solid #d5e0e9;border-radius:12px;background:#fff;padding:0 15px;transition:.2s}
.login-field:focus-within{border-color:#0a8193;box-shadow:0 0 0 3px #0a819310}
.field-icon{width:29px;color:#59718e;font-size:17px}
.login-field input{flex:1;min-width:0;border:0;outline:0;background:transparent;padding:0 4px;font-size:14px;color:#18314d}
.login-field input::placeholder{color:#8a9aaf}
.show-pw{border:0;background:none;color:#425d7b;font-size:17px;cursor:pointer;padding:8px}
.login-options{display:flex;justify-content:space-between;align-items:center;margin:13px 0 24px;font-size:11px}
.remember{display:flex!important;align-items:center;gap:7px!important;margin:0!important;font-weight:500!important;color:#5f738c!important}
.remember input{width:16px;height:16px;accent-color:#087f91}
.forgot{color:#078298;cursor:help}
.login-submit{width:100%;height:57px;border:0;border-radius:11px;background:linear-gradient(100deg,#07899a,#075575);color:#fff;padding:0 20px;display:flex;align-items:center;justify-content:center;position:relative;font-weight:850;cursor:pointer;box-shadow:0 12px 25px #075f7520}
.login-submit b{position:absolute;right:21px;font-size:24px;font-weight:400}
.login-admin{margin:34px -38px 0;padding:22px 20px;text-align:center;border-top:1px solid #e7edf2;color:#71839a;font-size:10px;background:#fbfcfd}
.login-copy{text-align:center;margin-top:28px;color:#6f8196;font-size:10px}
.system-ready{position:fixed;right:24px;bottom:22px;background:#fff;border:1px solid #e3e9ef;border-radius:14px;padding:12px 17px;display:flex;align-items:center;gap:10px;box-shadow:0 15px 35px #17395712}
.system-ready>i{width:10px;height:10px;border-radius:50%;background:#19b889;box-shadow:0 0 0 4px #19b88912}
.system-ready b,.system-ready span{display:block}
.system-ready b{font-size:11px}.system-ready span{font-size:9px;color:#7f8fa2;margin-top:2px}
@media(max-width:650px){
.login-v3-wrap{padding:25px 13px 55px;align-content:center}
.login-v3-card{padding:32px 22px 0;border-radius:23px}
.doc-logo{width:75px;height:75px;border-radius:20px}.doc-logo span{font-size:34px}
.login-v3-brand h1{font-size:31px}.login-v3-brand p{font-size:12px}
.trust-row{gap:9px;font-size:9px;margin:24px 0 20px}
.login-field{height:54px}
.login-admin{margin-left:-22px;margin-right:-22px}
.system-ready{display:none}
.login-copy{margin-top:20px}
}
/* MyDokumen v3.1 Simple Drive */
.simple-drive-hero{text-align:center;padding:30px 20px;margin-bottom:13px;background:linear-gradient(145deg,#eaf7f8,#f8fbfd);border:1px solid #dce9ee;border-radius:22px}
.drive-big{width:70px;height:70px;margin:0 auto 13px;border-radius:20px;background:#fff;display:grid;place-items:center;font-size:34px;box-shadow:0 12px 30px #17395710}
.simple-drive-hero h2{font-size:29px;line-height:1.05;margin:9px 0}.simple-drive-hero p{max-width:520px;margin:0 auto;color:#6e8194;font-size:12px;line-height:1.6}
.step-card{display:grid;grid-template-columns:42px 1fr;column-gap:12px;background:#fff;border:1px solid #e0e7ed;border-radius:18px;padding:17px;margin-bottom:9px}
.step-no{grid-row:1/3;width:36px;height:36px;border-radius:11px;background:#e8f4f5;color:#08778c;display:grid;place-items:center;font-weight:900}
.step-copy b{font-size:12px}.step-copy p{font-size:10px;color:#7c8c9c;margin:4px 0 0;line-height:1.5}.step-card>.btn{grid-column:2;margin-top:12px}.btn.teal{background:#087c8d;color:#fff}
.simple-tip{display:flex;gap:10px;padding:13px 15px;border-radius:13px;background:#eef3f7;color:#6f8194;font-size:9px}.simple-tip b{color:#08778c;letter-spacing:1px}
.settings-title{display:flex;align-items:center;gap:12px}.settings-title h3{margin:0}.settings-title p{margin:3px 0;color:#8190a0;font-size:10px}