/* Shared tutorial surface. Version 1.2 receives the manual header player only. */
.vib-tutorial-entry{width:44px;height:44px;display:grid;place-items:center;margin-left:auto;margin-right:8px;color:#edf5f1;flex-shrink:0}.vib-tutorial-entry svg{width:25px;height:25px}.vib-tutorial-overlay{position:absolute;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:16px;background:#020908cc;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);overflow:auto;overscroll-behavior:contain}.vib-tutorial-overlay[hidden]{display:none!important}.vib-tutorial-panel{position:relative;width:100%;max-width:380px;max-height:100%;overflow:auto;border:1px solid #64d7bba6;border-radius:24px;background:radial-gradient(ellipse at 100% 0,#28504b66,transparent 52%),linear-gradient(150deg,#1d2c32,#0f1a20 55%,#11252a);box-shadow:0 0 24px #4ef9cf16,inset 0 0 14px #81fff414,0 20px 70px #0008;color:#f6faf7}.vib-tutorial-intro{padding:22px 20px 18px}.vib-tutorial-brand{font-size:22px;line-height:26px;font-weight:800;letter-spacing:-.7px}.vib-tutorial-brand span{color:#68f2c2}.vib-tutorial-intro h2{font-size:27px;line-height:35px;letter-spacing:.3px;font-weight:700;text-align:center;margin:18px 0 20px;color:#f8e4a4}.vib-tutorial-intro h2>span{color:#fff}.vib-tutorial-cover{display:block;width:100%;text-align:left;position:relative;height:148px;border:1px solid #7effda70;border-radius:17px;background:radial-gradient(ellipse at 72% 42%,#255c6766,transparent 65%),#0b1921;overflow:hidden}.vib-cover-grid{position:absolute;inset:0;background-image:linear-gradient(#67d7c50e 1px,transparent 1px),linear-gradient(90deg,#67d7c50e 1px,transparent 1px);background-size:24px 24px;transform:perspective(180px) rotateX(25deg) scale(1.4)}.vib-cover-chart{position:absolute;left:14px;top:18px;width:65%;border:1px solid #70f6da44;border-radius:9px;background:#0d2831cc;padding:10px}.vib-cover-chart>span{font-size:10px;color:#c1eee0}.vib-cover-chart svg{display:block;width:100%;height:65px;margin-top:6px}.vib-tutorial-cover>img{position:absolute;width:110px;height:134px;object-fit:contain;right:0;bottom:-4px;filter:drop-shadow(0 0 8px #70e0ee33)}.vib-cover-play{position:absolute;display:grid;place-items:center;left:50%;top:50%;transform:translate(-50%,-50%);width:54px;height:54px;border:2px solid #84ffe2;border-radius:50%;background:#10272fe8;color:#fff;font-size:23px;padding-left:4px;box-shadow:0 0 20px #66f9ca33}.vib-tutorial-duration{position:absolute;right:8px;bottom:8px;border-radius:7px;padding:3px 7px;background:#020909bc;color:#edf8f3;font-size:10px}.vib-tutorial-benefit{text-align:center;margin:20px 0 22px}.vib-tutorial-benefit strong{display:block;color:#f6e3a4;font-size:21px;line-height:28px}.vib-tutorial-benefit>span{display:block;font-size:14px;line-height:22px;font-weight:600;margin-top:3px}.vib-tutorial-benefit p{font-size:12px;line-height:19px;color:#a3b5b8;margin-top:13px}.vib-tutorial-start{display:flex;justify-content:center;align-items:center;gap:10px;width:100%;height:49px;border-radius:25px;background:linear-gradient(100deg,#68f2b6,#20e5cf);box-shadow:0 0 24px #39f7c52b;color:#082d27;font-size:14px;line-height:20px;font-weight:700}.vib-tutorial-start>span{font-size:19px}.vib-tutorial-note{text-align:center;color:#91a6ab;font-size:10px;line-height:16px;margin:13px 0 0}.vib-tutorial-error{color:#ffb4a3;font-size:12px;line-height:18px;margin:0 0 12px;text-align:center}.vib-tutorial-close{position:absolute;right:10px;top:10px;width:44px;height:44px;background:#142125d9;border:1px solid #a4c6c345;color:#e8f6f0;border-radius:50%;font-size:28px;line-height:36px;z-index:3;display:grid;place-items:center}.vib-tutorial-panel.is-player{height:100%;max-height:100%;border-radius:21px;background:#050909;overflow:hidden}.vib-tutorial-player{position:relative;height:100%;display:flex;align-items:center;justify-content:center;min-height:240px}.vib-tutorial-video{display:block;width:100%;height:100%;max-height:100%;object-fit:contain;background:#050909}.vib-tutorial-loading{position:absolute;inset:0;display:grid;place-items:center;color:#c5dbd3;font-size:13px;pointer-events:none}.vib-tutorial-ended{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:30px;background:radial-gradient(ellipse at 50% 20%,#224739bb,transparent 65%),#0c1615ed;text-align:center}.vib-tutorial-check{display:grid;place-items:center;width:58px;height:58px;border:1px solid #86f3a852;border-radius:50%;background:#86f3a817;color:#aff5c4;font-size:27px;margin-bottom:22px}.vib-tutorial-ended h3{font-size:23px;line-height:30px}.vib-tutorial-ended p{font-size:13px;line-height:22px;color:#a9bfb5;margin-top:12px}.vib-tutorial-register{height:48px;max-width:280px;width:100%;margin-top:30px;border-radius:16px;background:linear-gradient(100deg,#85f3b2,#32ded0);color:#10291d;font-size:14px;font-weight:700}.vib-tutorial-overlay [hidden]{display:none!important}
@media(max-width:360px){.vib-tutorial-overlay{padding:13px}.vib-tutorial-intro{padding:18px 16px 15px}.vib-tutorial-intro h2{font-size:25px;line-height:32px;margin:15px 0 16px}.vib-tutorial-cover{height:134px}.vib-tutorial-benefit{margin:16px 0 18px}.vib-tutorial-benefit strong{font-size:20px}.vib-tutorial-benefit>span{font-size:12px}.vib-tutorial-benefit p{margin-top:9px;font-size:11px}.vib-tutorial-start{font-size:13px}.vib-tutorial-entry{margin-right:4px}}
@media(max-height:690px){.vib-tutorial-intro{padding-top:16px;padding-bottom:12px}.vib-tutorial-intro h2{margin:10px 0 13px;font-size:24px;line-height:29px}.vib-tutorial-cover{height:110px}.vib-tutorial-cover>img{height:108px;width:90px}.vib-cover-chart svg{height:40px}.vib-tutorial-benefit{margin:13px 0}.vib-tutorial-benefit strong{font-size:19px;line-height:25px}.vib-tutorial-benefit p{margin-top:8px}.vib-tutorial-note{margin-top:9px}}
