/* === lines 95-139 === */
        .launcher-trigger {
            position: fixed;
            top: 12px;
            right: 20px;
            z-index: 600;
            display: flex;
            align-items: center;
            gap: 8px;
            padding: 4px;
            border-radius: 32px;
            transition: background .2s;
        }
        .launcher-trigger:hover { background: var(--bg-soft); }
        .apps-icon {
            width: 48px; height: 48px;
            cursor: pointer;
            display: flex; align-items: center; justify-content: center;
            border-radius: 50%;
            transition: background .2s;
            -webkit-tap-highlight-color: transparent;
        }
        .apps-icon:hover { background: var(--bg-soft); }
        .apps-icon svg { width: 24px; height: 24px; opacity: .65; }
        .user-avatar {
            width: 48px;
            height: 48px;
            border-radius: 50%;
            background: var(--bg-soft);
            color: var(--sub);
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 16px;
            font-weight: 500;
            text-transform: uppercase;
            object-fit: cover;
            border: 1px solid var(--border);
            transition: box-shadow .2s, border-color .15s;
            cursor: pointer;
        }
        .user-avatar:hover {
            box-shadow: var(--shadow);
            border-color: transparent;
        }
        .avatar-link { text-decoration: none; -webkit-tap-highlight-color: transparent; display: flex; }
/* === lines 152-214 === */
        /* ── HOME PAGE ──────────────────────────── */
        #home {
            flex: 1;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            padding: 0 16px 100px;
            opacity: 1;
            animation: fadeUp .4s ease forwards;
        }

        @keyframes fadeUp {
            from {
                opacity: 0;
                transform: translateY(10px)
            }

            to {
                opacity: 1;
                transform: translateY(0)
            }
        }

        /* Logo — scales down on mobile */
        .logo {
            margin-bottom: 24px;
            user-select: none;
            display: flex;
            align-items: center;
            /* reserve space to avoid layout shift during typewriter */
            min-height: clamp(48px, 8vw, 72px);
        }

        .logo-text {
            font-family: 'Roboto', Arial, sans-serif;
            font-size: clamp(32px, 8vw, 52px);
            font-weight: 700;
            letter-spacing: clamp(1px, .4vw, 3px);
            color: #7ab8f5;
            display: inline-block;
            position: relative;
        }

        .logo-text::after {
            content: '';
            display: inline-block;
            width: 3px;
            height: 0.85em;
            background-color: currentColor;
            margin-left: 6px;
            vertical-align: middle;
            animation: logoCursorBlink 1s infinite steps(2, start);
        }
        .logo-text.done::after {
            display: none;
        }

        @keyframes logoCursorBlink {
            0%, 100% { opacity: 0; }
            50% { opacity: 1; }
        }

/* === lines 216-625 === */
        .search-wrap {
            width: 100%;
            max-width: 584px;
            position: relative;
        }

        .search-box {
            display: flex;
            align-items: center;
            border: 1px solid var(--border);
            border-radius: 24px;
            padding: 0 14px 0 20px;
            height: 46px;
            gap: 10px;
            background: var(--bg-card);
            position: relative;
            z-index: 101;
            transition: box-shadow .2s, border-color .2s, background .25s;
        }

        .search-box:hover {
            box-shadow: var(--shadow);
            border-color: transparent;
        }

        .search-wrap.open .search-box {
            border-radius: 24px 24px 0 0;
            box-shadow: 0 -2px 8px rgba(32, 33, 36, .2);
            border-color: transparent;
        }

        [data-dark], [data-theme="dark"] .search-wrap.open .search-box {
            box-shadow: 0 -2px 8px rgba(0, 0, 0, .5);
        }

        .s-icon {
            color: var(--sub);
            flex-shrink: 0;
            width: 20px;
            height: 20px;
            transition: color 0.15s;
        }

        .s-icon:hover {
            color: var(--blue);
        }

        .s-input {
            flex: 1;
            border: none;
            outline: none;
            font-size: 16px;
            font-family: 'Roboto', Arial, sans-serif;
            color: var(--text);
            background: transparent;
            caret-color: var(--blue);
        }

        .s-input::placeholder {
            color: transparent;
        }

        .s-actions {
            display: flex;
            align-items: center;
            gap: 4px;
        }

        .icon-btn {
            background: none;
            border: none;
            cursor: pointer;
            padding: 6px;
            border-radius: 50%;
            color: var(--sub);
            display: flex;
            align-items: center;
            justify-content: center;
            transition: background .15s;
            -webkit-tap-highlight-color: transparent;
        }

        .icon-btn:hover {
            background: var(--bg-soft);
        }

        .divider-v {
            width: 1px;
            height: 24px;
            background: var(--border);
            margin: 0 4px;
        }

        /* Suggestions dropdown */
        .sug-wrap {
            position: absolute;
            top: 100%;
            left: 0;
            right: 0;
            background: var(--bg-card);
            border: 1px solid transparent;
            border-top: none;
            border-radius: 0 0 24px 24px;
            box-shadow: var(--sug-shadow);
            overflow: hidden;
            display: none;
            z-index: 100;
        }

        .search-wrap.open .sug-wrap {
            display: block;
            border-color: transparent;
            border-top: 1px solid var(--border);
        }

        .sug-item {
            display: flex;
            align-items: center;
            padding: 10px 20px;
            gap: 14px;
            cursor: pointer;
            font-size: 14px;
            color: var(--text);
            transition: background .1s;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            -webkit-tap-highlight-color: transparent;
        }

        .sug-item:hover,
        .sug-item:active {
            background: var(--bg-soft);
        }

        .sug-item span {
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .sug-item .hint {
            margin-left: auto;
            font-size: 12px;
            color: var(--sub);
            flex-shrink: 0;
        }

        .sug-footer {
            padding: 10px 20px;
            font-size: 12px;
            color: var(--blue);
            cursor: pointer;
            text-align: right;
            border-top: 1px solid var(--border);
            -webkit-tap-highlight-color: transparent;
        }

        .sug-footer:hover {
            text-decoration: underline;
        }

        /* Shortcuts */
        .sc-wrap {
            display: flex;
            flex-wrap: wrap;
            gap: 14px;
            margin-top: 22px;
            width: 100%;
            max-width: 584px;
            justify-content: center;
            padding: 10px 4px 4px;
        }

        .sc-tile {
            position: relative;
            width: 56px;
            height: 56px;
            border-radius: 14px;
            background: var(--bg-soft);
            border: 1px solid var(--border);
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            overflow: visible;
            flex-shrink: 0;
            transition: box-shadow .18s, background .18s, width .28s cubic-bezier(.4, 0, .2, 1);
            -webkit-tap-highlight-color: transparent;
        }

        .sc-tile:hover {
            background: var(--bg-card);
            box-shadow: var(--shadow);
        }

        .sc-inner {
            width: 100%;
            height: 100%;
            border-radius: 14px;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
        }

        .sc-add {
            color: var(--sub);
        }

        .sc-add:hover {
            color: var(--blue);
        }

        .sc-site {
            width: 56px;
        }

        .sc-site:hover {
            width: 200px;
        }

        .sc-favicon {
            width: 28px;
            height: 28px;
            object-fit: contain;
            border-radius: 4px;
        }

        .sc-fallback {
            width: 28px;
            height: 28px;
            border-radius: 6px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 14px;
            font-weight: 700;
            color: #fff;
        }

        .sc-label {
            max-width: 0;
            overflow: hidden;
            white-space: nowrap;
            font-size: 13px;
            color: var(--text);
            opacity: 0;
            margin-left: 0;
            pointer-events: none;
            transition: max-width .25s cubic-bezier(.4, 0, .2, 1),
                opacity .2s .06s ease,
                margin-left .25s cubic-bezier(.4, 0, .2, 1);
        }

        .sc-site:hover .sc-label {
            max-width: 130px;
            opacity: 1;
            margin-left: 8px;
            pointer-events: auto;
        }

        .sc-rm {
            position: absolute;
            top: -7px;
            right: -7px;
            width: 18px;
            height: 18px;
            background: var(--bg-card);
            border: 1.5px solid var(--border);
            border-radius: 50%;
            display: none;
            align-items: center;
            justify-content: center;
            font-size: 9px;
            font-weight: 700;
            color: var(--sub);
            cursor: pointer;
            z-index: 20;
            box-shadow: 0 1px 4px rgba(0, 0, 0, .18);
            transition: color .12s, border-color .12s;
        }

        .sc-rm:hover {
            color: var(--red);
            border-color: var(--red);
        }

        .sc-site:hover .sc-rm {
            display: flex;
        }

        /* Modal */
        .modal-mask {
            position: fixed;
            inset: 0;
            background: rgba(0, 0, 0, .5);
            z-index: 1000;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 16px;
            animation: fadeIn .15s ease;
        }

        @keyframes fadeIn {
            from {
                opacity: 0
            }

            to {
                opacity: 1
            }
        }

        .modal {
            background: var(--bg-card);
            border-radius: 12px;
            padding: 24px 24px 18px;
            width: 100%;
            max-width: 340px;
            box-shadow: 0 8px 30px rgba(0, 0, 0, .3);
            animation: slideUp .18s ease;
        }

        @keyframes slideUp {
            from {
                transform: translateY(14px);
                opacity: 0
            }

            to {
                transform: translateY(0);
                opacity: 1
            }
        }

        .modal h3 {
            font-size: 17px;
            font-weight: 500;
            margin-bottom: 18px;
            color: var(--text);
        }

        .modal label {
            display: block;
            font-size: 12px;
            color: var(--sub);
            margin: 12px 0 5px;
        }

        .modal input {
            width: 100%;
            border: 1px solid var(--border);
            border-radius: 6px;
            padding: 9px 12px;
            font-size: 16px;
            font-family: 'Roboto', Arial, sans-serif;
            color: var(--text);
            background: var(--bg-soft);
            outline: none;
            transition: border-color .15s, box-shadow .15s;
            /* prevent iOS zoom on focus */
        }

        .modal input:focus {
            border-color: var(--blue);
            box-shadow: 0 0 0 2px rgba(66, 133, 244, .2);
        }

        .modal input.err {
            border-color: var(--red);
        }

        .modal-actions {
            display: flex;
            justify-content: flex-end;
            gap: 10px;
            margin-top: 20px;
        }

        .m-btn {
            padding: 8px 20px;
            border-radius: 6px;
            font-size: 14px;
            font-family: 'Roboto', Arial, sans-serif;
            cursor: pointer;
            border: none;
            font-weight: 500;
            transition: background .15s;
            -webkit-tap-highlight-color: transparent;
        }

        .m-btn.cancel {
            background: transparent;
            color: var(--sub);
        }

        .m-btn.cancel:hover {
            background: var(--bg-soft);
        }

        .m-btn.ok {
            background: var(--blue);
            color: #fff;
        }

        .m-btn.ok:hover {
            background: #3367d6;
        }

/* === lines 1695-1708 === */
                gap: 10px;
                margin-top: 16px;
                padding-top: 8px;
            }

            .sc-tile {
                width: 52px;
                height: 52px;
            }

            .sc-site:hover {
                width: 180px;
            }

/* === lines 1810-1955 === */
        /* ── APP LAUNCHER DRAWER ────────────────── */
        .app-drawer {
            overflow: hidden;
            position: fixed;
            top: 72px;
            right: 24px;
            width: 344px;
            z-index: 991;
            height: 0;
            transition: height .12s cubic-bezier(.2,.9,.4,1.1);
            border-radius: 28px;
            box-shadow: 0 1px 3px rgba(0,0,0,.12), 0 8px 28px rgba(0,0,0,.2);
        }
        .app-drawer .EHzcec {
            background: #e9eef6;
            border: none;
            box-shadow: 0 4px 8px 3px rgba(0,0,0,.15), 0 1px 3px rgba(0,0,0,.3);
            box-sizing: border-box;
            overflow-x: hidden;
            position: relative;
            width: 344px;
            border-radius: 28px;
            margin: 0 auto;
            padding: 8px;
            max-height: calc(100vh - 100px);
            overflow-y: auto;
        }
        [data-dark], [data-theme="dark"] .app-drawer .EHzcec { background: #28292a; }
        .app-drawer .LVal7b {
            background: #f8fafd;
            color: #444746;
            border-radius: 24px;
            box-sizing: border-box;
            margin-bottom: 10px;
            padding: 24px 20px;
            width: 328px;
        }
        [data-dark], [data-theme="dark"] .app-drawer .LVal7b { background: #1e1f20; color: #e8eaed; }
        .app-drawer .ngVsM { margin: 0; padding: 0; display: flex; flex-wrap: wrap; }
        .app-drawer .j1ei8c {
            display: inline-block;
            height: 84px;
            list-style: none;
            padding: 6px;
            position: relative;
            vertical-align: top;
            width: 84px;
        }
        .app-drawer .tX9u1b {
            margin: 0;
            outline: none;
            position: absolute;
            text-align: center;
            text-decoration: none;
            color: inherit;
            width: 84px;
            border-radius: 16px;
            cursor: pointer;
            padding: 4px 0;
        }
        .app-drawer .tX9u1b:visited { color: inherit; }
        .app-drawer .tX9u1b:hover { background: #e9eef6; border-radius: 16px; }
        [data-dark], [data-theme="dark"] .app-drawer .tX9u1b:hover { background: #3c4043; }
        .app-drawer .CgwTDb { height: 53px; display: flex; align-items: center; justify-content: center; }
        .app-drawer .CgwTDb .launcher-icon-sym {
            font-family: 'Material Symbols Outlined' !important;
            font-size: 40px; font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 40;
            display: flex; align-items: center; justify-content: center;
            color: var(--md-sys-color-primary, var(--blue, #0b57d0));
        }
        .app-drawer .Rq5Gcb {
            color: #1f1f1f;
            display: inline-block;
            font-family: 'Roboto', Helvetica, Arial, sans-serif;
            font-size: 13px;
            letter-spacing: .09px;
            line-height: 18px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            width: 76px;
        }
        [data-dark], [data-theme="dark"] .app-drawer .Rq5Gcb { color: #e8eaed; }
        .app-drawer .WwFbJd { text-align: center; }
        .app-drawer .NQV3m {
            border-radius: 100px;
            border: 1px solid #747775;
            background: none;
            color: #0b57d0;
            display: inline-block;
            font-size: 14px;
            font-weight: 500;
            min-height: 40px;
            padding: 10px 24px;
            text-align: center;
            text-decoration: none;
            line-height: 18px;
            margin: 12px 0 16px;
            cursor: pointer;
        }
        [data-dark], [data-theme="dark"] .app-drawer .NQV3m { color: #8ab4f8; border-color: #8ab4f8; }
        .app-drawer .NQV3m:hover { background: rgba(11,87,208,.08); }
        .app-drawer .EHzcec::-webkit-scrollbar { width: 8px; }
        .app-drawer .EHzcec::-webkit-scrollbar-thumb {
            background-clip: padding-box;
            background-color: rgba(31,31,31,.16);
            border-radius: 8px;
            border: 1px solid transparent;
        }
        .overlay { position: fixed; inset: 0; background: transparent; z-index: 990; display: none; }
        .overlay.active { display: block; }

        /* Extension promo banner */
        .ext-banner {
            position: fixed; bottom: 0; left: 0; right: 0; z-index: 900;
            background: var(--blue); color: #fff;
            padding: 14px 24px;
            display: flex; align-items: center; justify-content: center;
            gap: 16px; flex-wrap: wrap;
            font-size: 14px; font-family: 'Roboto', Arial, sans-serif;
            transform: translateY(100%);
            animation: slideUpBanner .5s .8s cubic-bezier(.2,.9,.3,1) forwards;
            box-shadow: 0 -2px 16px rgba(0,0,0,.2);
        }
        @keyframes slideUpBanner {
            from { transform: translateY(100%); }
            to { transform: translateY(0); }
        }
        .ext-banner .ext-btn {
            padding: 8px 20px; border-radius: 20px;
            background: #fff; color: var(--blue);
            font-weight: 500; font-size: 13px;
            cursor: pointer; border: none;
            font-family: 'Roboto', Arial, sans-serif;
            transition: box-shadow .15s;
            text-decoration: none; white-space: nowrap;
            -webkit-tap-highlight-color: transparent;
        }
        .ext-banner .ext-btn:hover { box-shadow: 0 2px 8px rgba(0,0,0,.25); }
        .ext-close {
            background: none; border: none; color: #fff;
            cursor: pointer; padding: 4px; border-radius: 50%;
            opacity: .7; transition: opacity .15s;
            font-size: 20px; line-height: 1;
            -webkit-tap-highlight-color: transparent;
        }
        .ext-close:hover { opacity: 1; }
    </style>