/* Device recreations use fixed design coordinates, scaled to the available space. */
.visual-viewport{position:relative;width:100%;height:100%;overflow:hidden;background:radial-gradient(ellipse at 50% 32%,#fff 0,#eef0ed 70%);isolation:isolate;border-radius:18px;color:#202124;font-family:Arial,Helvetica,sans-serif;font-size:15px;line-height:1.3;letter-spacing:normal}.visual-viewport *{box-sizing:border-box}.visual-viewport h2,.visual-viewport h3,.visual-viewport h4,.visual-viewport p{font-family:inherit;color:inherit;letter-spacing:normal;line-height:1.35;margin:0}.visual-viewport h2{font-size:25px}.visual-viewport h3{font-size:20px}.visual-viewport h4{font-size:16px}.device-layer{position:absolute;inset:0;transform-origin:50% 50%}.device-canvas{position:absolute;transform-origin:top left;user-select:none}.after-view{opacity:0;pointer-events:none}.after-view .t-target{outline:none!important;box-shadow:none!important;background-color:revert-layer}.device-caption{position:absolute;bottom:0;left:0;right:0;text-align:center;font-size:14px;font-weight:600;color:#52615b;letter-spacing:.3px}.t-target{outline:3px solid #e47923!important;outline-offset:4px;position:relative;z-index:3;box-shadow:0 0 0 7px #ffb76c26;border-radius:5px}.device-layer .t-target::after{content:''}.app-symbol{display:inline-flex;width:35px;height:35px;align-items:center;justify-content:center;color:white;border-radius:9px;font-size:23px;font-weight:bold;flex-shrink:0}.device-canvas svg{display:block;width:35px;height:35px;flex-shrink:0}.real-pointer{position:absolute;z-index:30;transform:translate(0,0);pointer-events:none;opacity:0}.real-pointer svg{width:27px;height:37px;filter:drop-shadow(1px 2px 2px #0006)}.real-pointer.touch-dot{width:25px;height:25px;border:3px solid white;border-radius:50%;background:#df7829;box-shadow:0 2px 8px #0004;margin:-12px 0 0 -12px}.touch-ripple{position:absolute;z-index:29;width:30px;height:30px;margin:-15px 0 0 -15px;border:3px solid #e47923;border-radius:50%;opacity:0;pointer-events:none}
/* Pixel 9: flat glass, rounded display, centered camera and side controls. */
.pixel-shell{position:absolute;left:18px;top:6px;width:324px;height:719px;padding:7px;border-radius:48px;background:linear-gradient(110deg,#d5d8d6,#4a514e 12%,#c7ccca 15%,#252c2a 80%,#d8dcd9);box-shadow:0 17px 25px #24372b30,inset 0 0 0 2px #7d8580}.pixel-display{position:relative;height:100%;border:6px solid #101613;border-radius:42px;overflow:hidden;background:#f9faf6}.pixel-side{position:absolute;right:15px;width:4px;background:linear-gradient(90deg,#89928d,#313a34);border-radius:0 3px 3px 0}.pixel-side.power{top:175px;height:47px}.pixel-side.volume{top:250px;height:78px}.camera-hole{position:absolute;left:50%;top:13px;transform:translateX(-50%);width:12px;height:12px;border:3px solid #111917;background:#243434;box-shadow:0 0 0 2px #333c37;border-radius:50%;z-index:10}.android-status{position:absolute;left:0;right:0;top:0;height:39px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;font-size:11px;background:#f9faf6;z-index:6}.android-status b{font-size:12px}.phone-screen{position:absolute;inset:39px 0 19px;background:#f9faf6;overflow:hidden}.gesture-bar{position:absolute;bottom:7px;left:50%;transform:translateX(-50%);width:102px;height:4px;border-radius:5px;background:#27322c;z-index:9}.phone-canvas .device-caption{bottom:4px}.app-surface{height:100%;position:relative;background:#f9faf6}.phone-toolbar{display:flex;align-items:center;gap:9px;min-height:61px;padding:9px 12px;border-bottom:1px solid #edf0e9}.toolbar-glyph{font-size:26px;min-width:22px;text-align:center}.phone-app-title{flex:1;font-size:19px;line-height:1.15;min-width:0;overflow-wrap:anywhere}.save-top{font-size:12px;color:#185b30}.phone-content{position:relative;height:calc(100% - 61px);padding:14px 13px;overflow:hidden}.phone-content>h4{margin:16px 0 12px}.phone-content>h3{margin:16px 0}.ui-row{display:flex;align-items:center;min-height:61px;gap:12px;padding:11px 8px;border-bottom:1px solid #e6e9e3}.row-label{flex:1;min-width:0}.row-label>span,.menu-option>span{display:block;font-size:14px;overflow-wrap:anywhere}.row-label small,.menu-option small{display:block;font-size:11px;color:#677269;margin-top:5px}.row-icon{font-size:21px;color:#486a50;flex-shrink:0}.row-chevron{font-size:21px;color:#64746a}.row-more{font-size:22px}.selected{background:#d9eaf9!important;border-radius:5px}.android-intro{font-size:13px;color:#647067;line-height:1.4;margin-bottom:23px}.settings-section{font-size:13px!important;color:#3e654c!important;margin:17px 0 9px!important}.radio-list .row-icon{color:#387b4b}.radio-list .ui-row{min-height:64px;border:0}.phone-primary{position:absolute;right:16px;bottom:20px;background:#dcebcf;color:#193b21;padding:13px 20px;border-radius:24px;font-size:14px;font-weight:bold}.phone-search,.app-search{background:#eaf0e5;border-radius:27px;padding:16px;color:#556153;font-size:13px}.app-search{margin:12px 14px}.apps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:25px 8px;padding:22px 12px}.app-cell{display:flex;flex-direction:column;align-items:center;gap:9px;text-align:center;font-size:11px;min-width:0}.app-cell .app-symbol,.app-cell svg{width:43px;height:43px;border-radius:14px}.avatar{background:#36634c;color:white;width:29px;height:29px;display:flex;align-items:center;justify-content:center;border-radius:50%;font-size:14px}.pixel-wallpaper{height:100%;position:relative;overflow:hidden;background:#d5e0b0}.wall-shape{position:absolute;width:240px;height:480px;border-radius:50%;background:linear-gradient(125deg,#c8dca2,#95b690);transform:rotate(-30deg);left:110px;top:110px}.wall-shape.two{width:210px;background:linear-gradient(60deg,#e8e8ba,#bacf8d);left:-70px;top:240px}.pixel-date{position:relative;padding:15px 18px;font-size:13px}.pixel-clock{position:relative;font-size:92px;line-height:.85;font-weight:300;text-align:center;margin-top:45px;color:#355640;letter-spacing:-5px}.pixel-clock span{display:block}.home-apps{position:absolute;bottom:155px;left:25px;right:25px;display:flex;justify-content:space-between}.home-apps>div{display:grid;gap:6px;justify-items:center}.home-apps small{font-size:11px}.google-search{position:absolute;bottom:95px;left:16px;right:16px;padding:13px;border-radius:24px;background:#f6faee;display:flex;gap:16px;font-size:14px}.google-search span{flex:1;color:#77846d}.home-dock{position:absolute;bottom:35px;display:flex;justify-content:space-evenly;left:0;right:0}.swipe-start{position:absolute;bottom:3px;left:65px;right:65px;text-align:center;height:16px;font-size:8px;color:#355640}.shade-date{display:flex;justify-content:space-between;padding:15px 18px;font-size:13px}.quick-tiles{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding:8px 14px}.quick-tile{min-height:76px;background:#e5e9df;border-radius:24px;padding:12px;font-size:13px}.quick-tile.on{background:#cee2a8}.quick-tile b{float:left;margin-right:10px;font-size:20px;line-height:42px}.quick-tile>span{display:block;padding-top:6px;font-size:12px}.quick-tile small{font-size:9px;color:#5a674c;display:block;padding-top:4px}.brightness{background:#d7e5ba;border-radius:22px;height:41px;margin:14px;padding:8px 18px;color:#374d28}.brightness i{display:inline-block;width:160px;border-top:5px solid #8ca36e;vertical-align:middle;margin-left:15px}.quick-edit{text-align:right;padding:10px 24px;font-size:12px}.notification-card{border-radius:22px;margin:19px 14px;background:white;box-shadow:0 4px 12px #0001;padding:17px}.notification-card>*{display:block;font-size:12px;margin-bottom:10px}.notification-card b{font-size:15px}.files-space{border-radius:14px;background:#eaf0fc;padding:20px 15px;display:grid;gap:7px;font-size:14px}.files-space span{font-size:11px;color:#5e6d83}.category-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.category-tile{background:#edf2f8;border-radius:15px;padding:14px 10px;display:flex;align-items:center;gap:10px;font-size:12px;min-height:64px}.category-icon{font-size:21px;color:#416db5}.c1{color:#b75b20}.c2{color:#ad387c}.c3{color:#8161b0}.t-menu{position:absolute;z-index:12;background:#fff;border-radius:12px;box-shadow:0 4px 30px #18271d3b;border:1px solid #d6ddd4;padding:7px;color:#24312a}.mobile-menu-panel{right:10px;top:50px;width:222px}.menu-option{padding:13px 12px;font-size:14px;min-height:43px}.menu-caption{padding:8px 12px 13px;border-bottom:1px solid #ddd;font-size:12px;color:#5e6c61}.app-whatsapp .phone-toolbar{color:#0b5745}.chat-filters{font-size:11px;color:#52775e;padding:17px 2px}.chat-list .row-icon{background:#d5e5dc;border-radius:50%;width:37px;height:37px;text-align:center;padding-top:5px}.bottom-tabs{position:absolute;bottom:0;left:0;right:0;font-size:11px;padding:19px 8px;background:#f4f7f0;text-align:center;white-space:pre-wrap}.chat-wall{position:absolute;inset:0 0 60px;background:#ece9de;padding:20px 15px}.chat-day{display:block;background:#fff8;width:50px;text-align:center;margin:0 auto 25px;border-radius:7px;font-size:11px;padding:6px}.chat-bubble{background:#fff;border-radius:0 13px 13px 13px;max-width:85%;padding:12px;font-size:12px;line-height:1.5;margin-bottom:18px;box-shadow:0 1px 1px #0002}.chat-bubble small{display:block;text-align:right;font-size:9px;color:#7b837c}.chat-bubble.sent{background:#d6f7c5;margin-left:auto;border-radius:13px 0 13px 13px}.chat-compose{position:absolute;bottom:7px;left:8px;right:8px;display:flex;align-items:center;gap:9px;background:white;border-radius:25px;box-shadow:0 1px 6px #0002;padding:10px;font-size:12px}.chat-compose>div{flex:1;overflow-wrap:anywhere}.send-round{border-radius:50%;background:#1f7859;color:#fff;padding:9px;width:32px;height:32px;text-align:center}.note-paper{min-height:390px;background:#fff9e5;padding:16px;margin:-14px -13px}.note-paper h3{font-size:21px;margin:13px 0}.note-paper p{font-size:16px;line-height:1.7}.note-tools{display:flex;justify-content:space-between;align-items:center;position:absolute;bottom:0;left:0;right:0;padding:15px;background:#fff9e5}.note-more{font-size:24px}.label-chip{background:#eee3b9;border-radius:6px;padding:5px 9px;font-size:11px}.form-field{margin:12px 0 20px;background:#edf1e7;border-radius:5px;padding:12px;border-bottom:2px solid #64715f}.form-field label{font-size:11px;color:#52664c}.form-value{font-size:15px;padding-top:10px}.audio-art{height:170px;background:linear-gradient(135deg,#5154a5,#9b71b7);border-radius:15px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:63px;color:white;gap:10px}.audio-art span{font-size:15px}.mixer-track{margin-top:30px;font-size:13px}.mixer-line{height:7px;background:#c9d5ee;margin:23px 10px}.mixer-knob{display:block;width:20px;height:20px;background:#596ee6;border-radius:50%;position:relative;top:-6px;left:65%}.instrument{left:85%}.big-play{margin:36px auto;width:48px;height:48px;background:#566de2;border-radius:50%;color:#fff;padding:14px;text-align:center}.gemini-welcome{text-align:center;margin:50px 0;color:#467cca;font-size:60px}.gemini-welcome h3{font-size:31px;margin:16px 0}.gemini-welcome p{font-size:17px;color:#5c6570}.gemini-compose{background:#e8edf4;border-radius:24px;padding:22px;font-size:14px;min-height:100px;position:relative;line-height:1.7}.gemini-compose .send-round{margin-top:15px;margin-left:auto;background:#4979bd}.sample-photo{height:100%;min-height:100px;position:relative;overflow:hidden;background:linear-gradient(#9fcbe3,#d7e4c6 62%,#a9c6ba);isolation:isolate}.photo-sun{position:absolute;background:#fff3b4;width:15%;aspect-ratio:1;border-radius:50%;top:14%;right:18%;box-shadow:0 0 45px #fff5c5}.photo-hill{position:absolute;bottom:15%;width:90%;height:60%;border-radius:60% 80% 0 0;background:#7a9e89;transform:rotate(-13deg);left:-20%}.photo-hill.front{left:35%;bottom:0;background:#406f62;transform:rotate(13deg)}.photo-water{position:absolute;bottom:0;height:20%;width:100%;background:linear-gradient(#b4d3cdcc,#7ba5a2)}.sample-photo>span{position:absolute;bottom:12px;left:12px;padding:3px 6px;color:#fff;background:#24473980;border-radius:4px;font-size:10px}.phone-content>.sample-photo{height:310px;margin:25px -13px 0}.photo-controls{padding:30px 5px;text-align:center}.video-preview{background:#23282b;color:white;height:165px;display:grid;place-items:center;font-size:45px;margin:-14px -13px 15px}.video-title{font-size:17px!important}.yt-channel{font-size:11px;padding:17px 0}.share-file{background:#eff2e9;padding:16px;border-radius:12px;font-size:13px}.share-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:25px 15px;margin-top:22px}.contact-avatar{width:100px;height:100px;border-radius:50%;background:#d5e9c4;color:#517443;font-size:45px;display:grid;place-items:center;margin:20px auto}.contact-name{text-align:center;font-size:25px!important;margin-bottom:30px!important}.android-dialog{margin-top:55px;padding:19px;background:#edf3e4;border-radius:25px;box-shadow:0 20px 80px #0002}.android-dialog h3{font-size:21px;margin:5px 0 20px}.android-confirm{text-align:right;color:#315f28;font-size:14px;padding:18px 5px}.fab{position:absolute;right:18px;bottom:35px;background:#dfedcd;border-radius:17px;box-shadow:0 3px 7px #0002;width:55px;height:55px;display:grid;place-items:center;font-size:29px}.drive-tabs{font-size:13px;padding:10px 0 15px}
/* HP laptop with Windows 11 and application-specific layouts. */
.hp-lid{position:absolute;left:50px;top:20px;width:860px;height:511px;background:linear-gradient(120deg,#c9ced1,#7f898e 30%,#bcc2c4 90%);padding:18px 17px 29px;border-radius:15px 15px 6px 6px;border:2px solid #818a8c;box-shadow:0 15px 28px #26342e25}.webcam{position:absolute;top:6px;left:50%;width:5px;height:5px;background:#152126;border-radius:50%;box-shadow:8px 0 0 #9da6a8}.hp-screen{height:100%;position:relative;overflow:hidden;background:#eef3fa;border:2px solid #253038;border-radius:3px;font-family:'Segoe UI',Arial,sans-serif;font-size:13px}.hp-logo{position:absolute;bottom:4px;width:18px;height:18px;left:calc(50% - 9px);font-style:italic;font-size:14px;line-height:16px;border:1px solid #58656d;color:#58656d;border-radius:50%;text-align:center}.hp-base{position:absolute;left:18px;top:532px;width:924px;height:78px;background:linear-gradient(#b0b9bf,#d4dadd 75%,#a8b1b6);clip-path:polygon(3.5% 0,96.5% 0,100% 91%,99% 100%,1% 100%,0 91%);border-radius:0 0 12px 12px}.keyboard-lines{position:absolute;width:620px;height:27px;left:150px;top:5px;background:repeating-linear-gradient(90deg,transparent 0 24px,#b9c3c8 25px 28px),repeating-linear-gradient(0deg,#566168 0 6px,#c7cfd3 7px 9px);transform:perspective(110px) rotateX(15deg);border-radius:3px}.trackpad{position:absolute;left:350px;top:40px;width:220px;height:25px;border:1px solid #8c999e;border-radius:4px;background:#bac4c9}.laptop-lip{position:absolute;left:22px;right:22px;top:606px;height:7px;background:linear-gradient(#8d999f,#c2cacf);border-radius:0 0 10px 10px;box-shadow:0 13px 15px #25372f28}.laptop-canvas .device-caption{bottom:5px}.pc-app{position:absolute;inset:0 0 35px;overflow:hidden;background:#fff}.window-title{height:33px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 12px;background:#f5f6fa;border-bottom:1px solid #e5e8ee;font-size:11px;white-space:nowrap}.window-title>span:first-child{display:flex;align-items:center;gap:7px;overflow:hidden}.window-title .app-symbol,.window-title svg{width:17px;height:17px;font-size:12px;border-radius:3px}.window-title>span:last-child{font-size:12px}.win-taskbar{position:absolute;bottom:0;left:0;right:0;background:#eef3fcf2;border-top:1px solid #dce4ef;height:35px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;z-index:4}.win-taskbar>div{display:flex;align-items:center;justify-content:center;gap:17px;flex:1}.win-taskbar .app-symbol,.win-taskbar svg{width:21px;height:21px;font-size:16px;border-radius:3px}.win-taskbar>div>span{background:#fff;border:1px solid #d6deed;border-radius:14px;width:135px;padding:3px 10px;font-size:11px}.win-taskbar>span{font-size:10px}.win-wallpaper{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 70%,#268de0,#1358b5 50%,#04205d);overflow:hidden}.win-fold{position:absolute;left:150px;top:60px;width:380px;height:330px;border-radius:35% 60% 50% 35%;background:repeating-radial-gradient(ellipse at 0% 90%,#2380e7 0%,#9bd9fd 13%,#1b7bc2 16%,#0550aa 23%);transform:rotate(-25deg);box-shadow:15px 30px 30px #00357e}.win-fold.b{left:380px;top:90px;transform:rotate(45deg);width:180px;height:270px;opacity:.8}.desktop-icons{position:absolute;top:22px;left:19px;display:grid;gap:24px;color:white;font-size:30px;text-align:center}.desktop-icons>div{display:grid;gap:3px}.desktop-icons span{font-size:10px;text-shadow:1px 1px #17396c}.key-guide{position:absolute;left:240px;top:170px;display:flex;gap:20px;align-items:center;background:#edf4feee;padding:24px;border-radius:12px;font-size:20px}.key-guide kbd{padding:16px 24px;border:1px solid #7589a1;border-bottom:5px solid #8ea1b7;border-radius:7px;background:#fff;font-size:26px;color:#183554}.explorer-command{height:44px;display:flex;align-items:center;gap:27px;padding:0 17px;border-bottom:1px solid #e4e8ef;font-size:12px}.command-button{padding:5px 10px}.address-line{height:44px;display:flex;align-items:center;gap:20px;padding:8px 15px;border-bottom:1px solid #e7e9ee;font-size:11px}.address-line>div{flex:1;border:1px solid #dde1e9;border-radius:4px;padding:6px;overflow:hidden;white-space:nowrap}.address-line>span:last-child{border:1px solid #dde1e9;width:150px;padding:6px;border-radius:4px}.explorer-body{display:flex;height:calc(100% - 120px)}.explorer-body aside{width:155px;flex-shrink:0;border-right:1px solid #eee;padding:8px 7px;background:#fafbfc}.explorer-nav{font-size:12px;padding:8px 7px;margin-bottom:1px;border-radius:4px}.nav-selected{background:#e2e8f4}.file-area{flex:1;padding:6px 14px;position:relative;min-width:0}.file-columns{font-size:10px;color:#596778;border-bottom:1px solid #e7eaf0;padding:7px 0}.file-columns span{float:right}.file-row{display:flex;align-items:center;gap:12px;padding:7px 10px;min-height:44px;margin:5px 0;font-size:13px;border-radius:4px}.file-row>div>span{display:block}.file-row small{font-size:10px;color:#697786;display:block;margin-top:3px}.file-icon{font-size:25px;color:#e0aa37;flex-shrink:0}.file-document{color:#638ec8}.empty-folder{font-size:12px!important;text-align:center;padding-top:60px;color:#7c8791!important}.rename-field{border:1px solid #2675cf;padding:4px 15px;background:#fff;min-width:160px}.desktop-menu{top:100px;left:260px;width:250px;border-radius:7px;padding:6px}.desktop-menu .menu-option{padding:10px;min-height:35px}.desktop-menu .menu-option>span{font-size:12px}.file-dialog-footer{position:absolute;bottom:0;left:0;right:0;background:#f2f4f8;display:flex;align-items:center;gap:20px;padding:15px;font-size:12px;z-index:9}.file-dialog-footer label{flex:1;display:flex;align-items:center;gap:10px}.file-dialog-footer label span{border:1px solid #becbd7;background:white;flex:1;padding:7px}.pc-primary{background:#166bbc;padding:9px 20px;color:#fff;border-radius:5px;font-size:12px;text-align:center}.chrome-toolbar{height:38px;background:#edf1f8;display:flex;align-items:center;gap:16px;padding:5px 13px;font-size:12px}.url-bar{background:#fff;flex:1;border-radius:17px;padding:6px 15px;color:#4e5868}.drive-header{display:flex;align-items:center;gap:12px;padding:13px 18px;height:61px}.drive-header svg{width:25px;height:25px}.drive-header b{font-size:23px;font-weight:400}.drive-header>div:not(.avatar){margin-left:35px;background:#edf1f7;border-radius:23px;padding:12px 20px;flex:1;font-size:12px}.drive-header>.avatar{margin-left:auto}.drive-body{display:flex;height:calc(100% - 132px);background:#f6f8fc}.drive-body aside{width:175px;padding:7px 13px;flex-shrink:0}.drive-body aside p{font-size:12px;margin:17px 7px}.drive-new{background:#fff;border-radius:15px;box-shadow:0 1px 3px #0002;display:inline-block;padding:15px;font-size:14px;margin-bottom:4px}.drive-body section{background:#fff;border-radius:15px 0 0 0;padding:15px 23px;flex:1;min-width:0}.drive-body h2{font-weight:400;font-size:24px;margin-bottom:20px}.drive-columns{font-size:11px;padding-bottom:10px;border-bottom:1px solid #e1e5ec}.drive-body .ui-row{min-height:42px;padding:8px}.drive-body .row-label>span{font-size:12px}.drive-body .row-icon{font-size:17px}.pc-dialog-backdrop{position:absolute;inset:33px 0 0;background:#22323e55;z-index:15;display:grid;place-items:center}.pc-dialog{background:#fff;border-radius:13px;padding:24px;width:440px;box-shadow:0 10px 40px #0004}.pc-dialog h3{font-size:20px;margin-bottom:20px}.pc-input{border:1px solid #9cabbf;border-radius:5px;padding:14px;font-size:14px;overflow-wrap:anywhere}.dialog-actions{display:flex;align-items:center;justify-content:flex-end;gap:25px;margin-top:20px;font-size:12px}.word-tabs{height:29px;background:#e8eff9;font-size:11px;display:flex;align-items:center;white-space:pre;padding:0 12px;gap:3px}.word-tab{display:inline;padding:4px 7px}.tab-active{border-bottom:2px solid #2866ac;font-weight:bold}.word-ribbon{height:64px;display:flex;align-items:center;gap:24px;background:#f6f8fd;border-bottom:1px solid #d6deec;padding:8px 18px;font-size:11px}.word-ribbon>div{padding:5px 14px;border-right:1px solid #dae1ed;min-width:70px;text-align:center;line-height:1.7}.ribbon-item{font-size:24px;display:flex;flex-direction:column;align-items:center}.ribbon-item span{font-size:10px}.word-workspace{height:calc(100% - 150px);padding:16px 0;background:#e8ebf1;overflow:hidden}.paper{width:380px;min-height:380px;margin:auto;background:#fff;box-shadow:0 1px 5px #0002;padding:28px 35px;position:relative}.paper h3{font-size:16px;margin-bottom:15px}.paper p{font-size:10px;margin-bottom:14px}.paper-lines i{display:block;height:1px;background:#cad0d5;margin-top:13px}.paper-lines i:last-child{width:75%}.word-photo{width:195px;height:107px;position:relative;margin-bottom:18px;border:1px solid #7689a3}.word-photo .sample-photo{min-height:0}.word-photo .sample-photo>span{font-size:7px;bottom:5px;left:5px}.handle{position:absolute;width:7px;height:7px;background:white;border:1px solid #668db3;z-index:3}.tl{top:-4px;left:-4px}.tr{top:-4px;right:-4px}.bl{bottom:-4px;left:-4px}.br{bottom:-4px;right:-4px}.layout-button{position:absolute;top:0;right:-30px;background:white;border:1px solid #b9c6d8;padding:3px;font-size:16px}.text-caret{color:#295b95}.word-status{position:absolute;bottom:0;background:#f6f8fc;border-top:1px solid #d9e0ec;left:0;right:0;padding:5px 10px;font-size:9px}.dark-app{background:#202127;color:#e7e6ef}.dark-app .window-title{background:#16171d;color:#eee;border:0}.edit-toolbar{height:43px;display:flex;align-items:center;gap:30px;padding:7px 15px;background:#292a32;font-size:12px}.edit-toolbar>b{margin-right:auto}.export-button{background:#9885e6;color:#191526;padding:7px 23px;border-radius:4px}.editor-upper{height:220px;display:flex}.editor-upper aside{width:180px;padding:14px;background:#26272f}.editor-upper aside h4{font-size:12px;margin-bottom:13px}.import-button{background:#7060b8;border:1px solid #8e7ccd;border-radius:4px;padding:8px;font-size:10px;text-align:center}.media-tile{margin-top:16px;width:120px;font-size:9px}.media-thumb{height:55px;background:linear-gradient(140deg,#a8bb8e,#58818b);display:grid;place-items:center;font-size:20px;margin-bottom:5px}.editor-upper section{flex:1;padding:12px 20px;text-align:center;background:#1d1e24}.editor-preview{height:165px;max-width:305px;margin:auto}.editor-play{padding:9px;font-size:13px;display:inline-block}.editor-upper .edit-right{width:85px;font-size:10px}.edit-right p{font-size:10px;margin:10px 0 24px;color:#c4c2ce}.timeline-ruler{font-size:9px;background:#292b35;padding:9px 60px}.timeline-track{position:relative;padding:10px 30px;height:85px;display:flex;gap:35px;font-size:10px}.timeline-clip{background:#706aaf;border:2px solid #adabf4;border-radius:4px;width:430px;height:55px;position:relative;padding:7px 10px}.clip-wave{font-size:21px;line-height:1;color:#c0b8ff;white-space:nowrap;overflow:hidden}.trim-handle{position:absolute;top:-2px;bottom:-2px;width:8px;background:#d7d0ff;z-index:3}.trim-handle.left{left:-3px}.trim-handle.right{right:-3px}.timeline-drop{border:1px dashed #767581;border-radius:4px;padding:19px 80px}.playhead{position:absolute;top:-25px;left:185px;bottom:0;background:#ddd;width:1px}.settings-window{display:flex;height:100%;background:#f4f7fc}.settings-window aside{width:240px;padding:17px}.settings-user{display:flex;align-items:center;gap:12px;font-size:13px}.settings-user span{width:45px;height:45px;display:grid;place-items:center;border-radius:50%;background:#d2e3f1;font-size:22px}.settings-search{background:#fff;border:1px solid #ccd6e3;font-size:10px;padding:9px;margin:20px 0}.settings-window aside p{font-size:11px;padding:9px 4px}.settings-window section{flex:1;padding:24px 22px 0 8px;min-width:0}.settings-window h2{font-size:23px;margin-bottom:20px}.settings-cards .ui-row{background:white;border:1px solid #e5e9ed;border-radius:6px;margin-bottom:8px;min-height:58px}.settings-cards .row-label>span{font-size:12px}.cast-panel{position:absolute;top:10px;right:10px;bottom:10px;width:280px;background:#f8faffee;border-radius:10px;padding:20px;box-shadow:0 8px 25px #0004}.cast-panel h2{font-size:21px;margin:8px 0 25px}.cast-panel .row-label span{font-size:13px}.music-layout{display:flex;height:100%;background:#fafafa}.music-layout aside{width:180px;padding:24px;background:#f0f0f3;color:#b43e52}.music-layout aside p{margin:19px 0;font-size:12px;color:#47525a}.music-layout section{padding:24px;flex:1}.music-layout h2{font-size:22px;margin-bottom:20px}.hb-tools{display:flex;gap:25px;align-items:center;background:#f1f3f5;padding:13px;font-size:11px}.hb-button{padding:7px 14px;border:1px solid #c3cbd3;border-radius:3px;background:#fff}.hb-content{padding:20px}.hb-content h3{font-size:18px;margin-bottom:20px}.hb-tabs{font-size:11px;padding:10px;background:#f1f4f7}.hb-content .ui-row{min-height:40px}.hb-content .row-label>span{font-size:12px}.hb-preview{background:#242c34;color:#fff;padding:30px;text-align:center;font-size:12px;margin-top:10px}.export-layout{background:#20232c;color:#efedf6;height:100%;padding:25px}.export-layout h2{font-size:22px;margin-bottom:15px}.export-columns{display:flex;gap:30px}.export-columns section{flex:1}.export-columns .ui-row{border-color:#42444c;min-height:50px}.export-columns .row-label>span{font-size:13px}.export-columns .row-icon,.export-columns .row-label small{color:#adb6cb}.export-preview{width:290px;height:175px}.export-final{float:right;margin-top:20px;background:#897bd8}.browser-content{padding:30px}.browser-content h2{font-size:25px;margin-bottom:25px}.browser-content .ui-row{max-width:600px}.photo-app-bar{height:35px;padding:10px;font-size:11px}
/* Hardware views. */
.hardware-heading{text-align:center;font-size:27px;font-weight:600;position:absolute;top:25px;left:30px;right:30px}.hardware-laptop{position:absolute;left:80px;top:180px;width:380px;height:250px;border:10px solid #b0b9bd;border-bottom-width:23px;border-radius:10px;background:#839398;box-shadow:0 10px 18px #0002}.mini-screen{position:absolute;inset:0;overflow:hidden}.mini-screen>svg{position:absolute;left:160px;top:80px;width:50px;height:50px;fill:#eee}.mini-hp{position:absolute;bottom:-22px;left:48%;font-style:italic;color:#55656c;font-size:16px}.mini-base{position:absolute;bottom:-47px;left:-30px;right:-30px;height:23px;background:linear-gradient(#d4dadd,#8c9ba3);clip-path:polygon(7% 0,93% 0,100% 80%,99% 100%,1% 100%,0 80%);border-radius:0 0 8px 8px}.hardware-pixel{position:absolute;left:650px;top:130px;width:184px;height:356px;border:7px solid #18231b;border-radius:32px;background:radial-gradient(ellipse at 80% 90%,#a4bc82,#d7e5bb 70%);box-shadow:0 15px 25px #1a292d33,0 0 0 3px #9ca99a;overflow:visible}.hardware-pixel .camera-hole{top:9px;width:10px;height:10px}.mini-pixel-clock{text-align:center;font-size:61px;line-height:.9;padding-top:90px;color:#486a42}.mini-google{font-size:11px;text-align:center;margin-top:45px;color:#526b42}.usb-port{position:absolute;bottom:-7px;left:74px;width:25px;height:6px;border:2px solid #859386;border-radius:3px;background:#161e18}.hardware-canvas .hardware-wire{position:absolute;inset:0;width:960px;height:650px;pointer-events:none}.hardware-note{position:absolute;bottom:50px;text-align:center;left:120px;right:120px;font-size:17px;color:#4b5e50}.cable-tip{position:absolute;left:405px;top:373px;padding:10px 16px;border-radius:10px;background:#fff3d8;font-size:15px;box-shadow:0 2px 15px #0002}.hardware-tv{position:absolute;left:590px;top:180px;width:300px;height:200px;background:#222b32;border:9px solid #222b32;border-radius:4px}.tv-screen-mini{background:linear-gradient(130deg,#213e70,#5488ad);height:100%;padding:22px;color:white}.tv-foot{position:absolute;bottom:-40px;left:120px;width:70px;height:40px;background:#333f47;clip-path:polygon(40% 0,60% 0,60% 80%,100% 90%,100% 100%,0 100%,0 90%,40% 80%)}.external-drive{position:absolute;left:660px;top:260px;width:180px;height:210px;border-radius:15px;background:linear-gradient(110deg,#53616a,#27353b 70%);box-shadow:0 12px 20px #0003;padding:25px;color:#b6c6cb;font-size:12px}.external-drive i{position:absolute;bottom:20px;right:20px;width:7px;height:7px;background:#a8d3e8;border-radius:50%;box-shadow:0 0 6px #c7ecff}.bose-body{position:absolute;left:240px;top:125px;width:400px;height:425px;background:linear-gradient(105deg,#394348,#182328);border-radius:45px 35px 25px 30px;transform:rotate(-4deg);box-shadow:20px 30px 40px #162a2c33}.speaker-grille{position:absolute;inset:10px 90px 13px 10px;border-radius:37px 9px 16px 26px;background:radial-gradient(#10181c 1.4px,transparent 1.5px) 0 0/5px 5px,#354146}.bose-name{position:absolute;bottom:52px;left:90px;z-index:2;font-style:italic;font-weight:bold;font-size:25px;color:#c6d2d7}.bose-panel{position:absolute;right:10px;top:40px;bottom:40px;width:64px;background:#1d292f;border:1px solid #46535c;border-radius:10px;display:flex;flex-direction:column;align-items:center;gap:18px;color:#a9b8bf;padding:20px 4px;font-size:10px}.bose-panel i{width:31px;height:31px;border:3px solid #6e7b82;border-radius:50%;background:#2d3940}.bluetooth-button{width:29px;height:29px;border:2px solid #6f8ea0;border-radius:50%;font-size:22px;text-align:center;color:#9fc7e4}.bose-panel small{font-size:9px}.camera-body{position:absolute;left:240px;top:230px;width:460px;height:265px;border-radius:25px;background:linear-gradient(120deg,#424b4c,#1a2224);box-shadow:0 20px 30px #0003}.camera-prism{position:absolute;left:80px;top:-50px;width:170px;height:60px;background:#2a3335;clip-path:polygon(20% 0,80% 0,100% 100%,0 100%)}.camera-lens{position:absolute;left:110px;top:40px;width:220px;height:220px;border-radius:50%;border:21px solid #1c2427;background:radial-gradient(#283951 20%,#37534e 30%,#1c2931 45%,#465758 46%,#1b2528 53%,#627071 55%,#293538 62%);box-shadow:0 0 0 7px #536264,8px 15px 15px #0004}.camera-model{position:absolute;right:20px;top:20px;font-size:13px;color:#d1dcda;padding:10px}.tv-body{position:absolute;left:60px;top:80px;width:700px;height:430px;border:13px solid #222c31;background:#131a25;border-radius:9px;box-shadow:0 20px 35px #0003;color:white;padding:30px}.tv-body h3{font-size:25px;color:white;margin-bottom:22px}.tv-body .ui-row{border-color:#354451;background:#222c3a;border-radius:8px;margin-bottom:15px}.tv-body .row-label>span{font-size:18px}.tv-body .row-icon{color:#c1d4e2}.tv-stand{position:absolute;left:330px;top:510px;width:160px;height:50px;background:#303c43;clip-path:polygon(40% 0,60% 0,60% 80%,100% 90%,100% 100%,0 100%,0 90%,40% 80%)}.remote-control{position:absolute;right:50px;top:185px;width:100px;height:320px;border-radius:30px;background:linear-gradient(100deg,#454e54,#202d33);box-shadow:8px 12px 15px #0003;color:#d9e1e6;padding:20px 10px;display:flex;flex-direction:column;align-items:center;gap:18px}.remote-power{width:18px;height:18px;border-radius:50%;background:#b95952}.remote-pad{height:75px;width:75px;border-radius:50%;background:#485a64;display:grid;place-items:center;border:2px solid #66737a;font-size:17px}.remote-control small{font-size:11px}
/* Accessible step player. Controls remain outside the reconstructed screens. */
.demo-dialog{width:min(1220px,calc(100% - 24px));max-height:96dvh;padding:24px 26px;background:#fffefb;border-radius:20px}.demo-dialog #dialog-content>h2{font-size:1.4rem;line-height:1.25;margin:7px 32px 13px 0}.tutorial-topline{display:flex;align-items:center;gap:10px;padding-right:35px;color:#56675d;font-size:.7rem;letter-spacing:.07em;text-transform:uppercase}.tutorial-topline span{background:#edf1e6;padding:5px 8px;border-radius:5px}.tutorial-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(265px,1fr);gap:24px}.tutorial-visual{height:min(58vh,540px);min-height:380px;position:relative}.tutorial-visual .visual-viewport{height:100%;border:1px solid #e0e6dc}.tutorial-copy{display:flex;flex-direction:column;padding:9px 0;min-width:0}.tutorial-step-number{font-size:.78rem;color:#32664c;font-weight:650;margin-bottom:12px}.tutorial-copy h3{font-size:1.55rem;letter-spacing:-.025em;line-height:1.2;margin:0 0 16px;color:#193d34}.tutorial-copy .tutorial-instruction{font-size:1.03rem;line-height:1.65;color:#334d40;margin:0 0 20px}.action-chip{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:7px;background:#fff0db;color:#7e4b19;font-size:.72rem;width:fit-content;margin-bottom:12px}.expected-box{border-left:3px solid #8aa37b;padding:9px 13px;background:#f1f5ec;border-radius:0 8px 8px 0;margin-top:auto}.expected-box strong{font-size:.72rem;text-transform:uppercase;letter-spacing:.07em;color:#48683e}.expected-box p{font-size:.86rem;color:#375139;line-height:1.5;margin:6px 0 0}.tutorial-tools{display:flex;gap:8px;margin-top:13px;flex-wrap:wrap}.tutorial-tools button{font-size:.75rem;border:1px solid #ccd7c5;border-radius:7px;padding:9px 11px;color:#3d5c42;background:white;min-height:40px}.tutorial-navigation{display:flex;align-items:center;gap:10px;padding:17px 0 12px}.tutorial-navigation button{min-height:46px;font-size:.84rem;padding:10px 17px}.tutorial-navigation .demo-next{margin-left:auto}.tutorial-settings{display:flex;align-items:center;gap:18px;flex-wrap:wrap;border-top:1px solid #e1e6dc;padding-top:12px;font-size:.76rem;color:#50624f}.tutorial-settings label{display:flex;align-items:center;gap:7px}.tutorial-settings select{font:inherit;border:1px solid #c9d3c1;padding:7px;border-radius:6px;background:white;color:#364e3b;max-width:320px}.tutorial-settings input[type=checkbox]{width:17px;height:17px;accent-color:#315f46}.tutorial-progress{display:flex;align-items:center;gap:13px;margin:3px 0 11px}.tutorial-progress input{flex:1;min-width:0;accent-color:#315f46;height:22px}.tutorial-progress output{font-size:.73rem;min-width:85px;white-space:nowrap;font-variant-numeric:tabular-nums;color:#61705d}.tutorial-note{font-size:.68rem!important;line-height:1.4!important;margin:10px 0 0!important;color:#78816e!important}.tutorial-status{font-size:.75rem;color:#527149;min-height:1.3em;margin:3px 0 0}.tutorial-keys{display:flex;gap:8px;margin:0 0 15px;align-items:center}.tutorial-keys kbd{border:1px solid #a7b6a0;border-bottom:3px solid #a7b6a0;border-radius:6px;padding:5px 10px;font:600 .82rem Arial;background:#fff}.detailed-reference{height:390px;max-width:720px;margin:auto}.detailed-reference .visual-viewport{border-radius:12px}.detailed-reference .real-pointer,.detailed-reference .touch-ripple{display:none}.detailed-reference .after-view{display:none}.all-steps .detailed-reference{height:330px}.device-canvas [class]{animation:none}.demo-dialog button:focus-visible,.demo-dialog select:focus-visible,.demo-dialog input:focus-visible{outline:3px solid #dc7a29;outline-offset:3px}
@media(max-width:800px){.demo-dialog{padding:20px 16px}.tutorial-layout{grid-template-columns:minmax(0,1.2fr) minmax(230px,1fr);gap:16px}.tutorial-copy h3{font-size:1.3rem}.tutorial-copy .tutorial-instruction{font-size:.94rem}.tutorial-visual{min-height:360px}.tutorial-settings{gap:12px}.tutorial-settings select{max-width:250px}.tutorial-navigation button{padding:10px 12px}}
@media(max-width:600px){.demo-dialog{padding:17px 13px;width:calc(100% - 10px);max-height:98dvh;border-radius:13px}.demo-dialog #dialog-content>h2{font-size:1.06rem;margin:7px 24px 12px 0}.tutorial-topline{font-size:.58rem;gap:5px}.tutorial-layout{display:flex;flex-direction:column;gap:12px}.tutorial-visual{height:350px;min-height:0}.tutorial-visual:has([data-device=hp]),.tutorial-visual:has([data-device=hardware]),.tutorial-visual:has([data-device=tv]){height:265px}.tutorial-copy{padding:0}.tutorial-step-number{font-size:.72rem;margin:0 0 7px}.tutorial-copy h3{font-size:1.23rem;margin:0 0 8px}.tutorial-copy .tutorial-instruction{font-size:.96rem;line-height:1.5;margin:0 0 11px}.action-chip{font-size:.65rem;margin-bottom:8px}.expected-box{padding:8px 11px}.expected-box p{font-size:.8rem;margin-top:4px}.expected-box strong{font-size:.63rem}.tutorial-tools{margin-top:10px}.tutorial-tools button{font-size:.72rem;min-height:37px}.tutorial-navigation{gap:6px;padding:12px 0 8px;position:sticky;bottom:-18px;background:#fffefbf5;z-index:40}.tutorial-navigation button{font-size:.75rem;min-height:44px;padding:9px 10px;gap:4px}.tutorial-navigation .demo-repeat{font-size:0;padding:9px 12px}.tutorial-navigation .demo-repeat::first-letter{font-size:18px}.tutorial-settings{gap:10px;font-size:.68rem}.tutorial-settings select{max-width:210px}.tutorial-settings .jump-label{width:100%}.tutorial-settings .jump-label select{flex:1;max-width:none}.tutorial-progress{margin-bottom:7px}.tutorial-note{font-size:.61rem!important}.detailed-reference{height:300px}.tutorial-keys{margin-bottom:9px}.all-steps .detailed-reference{height:270px}}
.real-pointer.touch-pointer{width:25px;height:25px;border:3px solid white;border-radius:50%;background:#df7829;box-shadow:0 2px 8px #0004;margin:-12px 0 0 -12px}.swipe-start{top:2px;bottom:auto;font-size:8px;background:#eff6e7ba;padding:3px;height:20px}.connector{position:absolute;left:640px;top:450px;padding:10px 16px;border-radius:10px;background:#fff3d8;font-size:15px;box-shadow:0 2px 15px #0002}.hardware-canvas:has(.external-drive) .connector{top:460px}.tv-frame{position:absolute;left:60px;top:80px;width:700px;height:430px;border:13px solid #222c31;background:#131a25;border-radius:9px;box-shadow:0 20px 35px #0003;color:white;padding:30px}.tv-frame h2{font-size:25px;margin:22px 0}.tv-brand{color:#e5e9f0;font-size:20px}.tv-frame .ui-row{border-color:#354451;background:#222c3a;border-radius:8px;margin-bottom:15px}.tv-frame .row-label>span{font-size:18px}.tv-frame .row-icon{color:#c1d4e2}.tv-feet{position:absolute;left:330px;top:510px;width:160px;height:50px;background:#303c43;clip-path:polygon(40% 0,60% 0,60% 80%,100% 90%,100% 100%,0 100%,0 90%,40% 80%)}.remote{position:absolute;right:50px;top:185px;width:100px;height:320px;border-radius:30px;background:linear-gradient(100deg,#454e54,#202d33);box-shadow:8px 12px 15px #0003;color:#d9e1e6;padding:20px 10px;display:flex;flex-direction:column;align-items:center;gap:30px}.remote>i{width:18px;height:18px;border-radius:50%;background:#b95952}.remote-wheel{height:75px;width:75px;border-radius:50%;background:#485a64;display:grid;place-items:center;border:2px solid #66737a;font-size:17px}
@media print{.detailed-reference{break-inside:avoid}.tutorial-navigation,.tutorial-tools{display:none}}

.mini-hp,.hp-logo{color:#33434b}.mini-google{color:#3a532f}.file-icon{color:#a77812}.file-document{color:#305c97}

.pixel-lock{height:100%;position:relative}.pixel-lock .home-apps,.pixel-lock .home-dock,.pixel-lock .google-search,.pixel-lock .swipe-start{display:none}.unlock-hint{position:absolute;bottom:110px;text-align:center;width:100%;font-size:12px;color:#36532d}.fingerprint{position:absolute;bottom:40px;left:calc(50% - 23px);width:46px;height:46px;font-size:38px;text-align:center;color:#385d30;border-radius:50%}.radio-circle{position:relative;display:inline-block}.radio-circle i{position:absolute;left:3px;top:4px;font-style:normal;font-size:15px;line-height:1}.chosen-check{opacity:0}.tutorial-visual .visual-viewport{min-height:0}

@media(max-width:600px){.tutorial-navigation .demo-repeat{font-size:20px;padding:9px 12px}.demo-repeat .repeat-label{display:none}}

.start-panel{position:absolute;inset:25px 120px 10px;padding:25px;background:#eef4fcf5;border-radius:12px;box-shadow:0 12px 35px #0004}.start-search{background:white;border:1px solid #97abce;border-bottom:2px solid #2e7fc9;border-radius:5px;padding:13px;margin-bottom:25px;font-size:17px}.start-panel h3{font-size:15px;margin-bottom:20px}.start-result{display:flex;align-items:center;gap:20px;border-radius:8px;padding:15px;background:#fff;font-size:18px}.start-result small{display:block;font-size:12px;margin-top:8px}.start-footer{font-size:12px;margin-top:40px;color:#546778}.clip-home{display:flex;height:100%;background:#f8f7fe}.clip-home aside{width:190px;padding:20px;background:#eeebf8}.clip-home aside h3{font-size:18px;margin-bottom:40px;color:#55429c}.clip-home aside p{margin:22px 0;font-size:13px}.clip-home section{padding:35px;flex:1}.clip-home h2{font-size:25px;margin-bottom:25px}.create-video{background:#6655b0;border-radius:9px;padding:20px;color:white;font-size:18px;margin:25px 0 40px;max-width:310px}.clip-home section h3{font-size:17px}.clip-example{margin-top:18px;border:1px dashed #bdafd7;border-radius:10px;padding:35px;font-size:13px;color:#73648a}.shade-swipe{position:absolute;top:10px;left:calc(50% - 15px);width:30px;height:16px;z-index:4}.cut-left{margin-left:40px;width:390px}.cut-left.cut-right{width:325px}.playhead.t-target{width:3px;outline-offset:5px}.range-in,.range-out{position:absolute;top:-22px;left:185px;color:#ddd;font-size:11px}.range-out{left:330px}.marked-range{position:absolute;top:-9px;left:185px;width:145px;height:7px;background:#b1b3e2}