autofox

automated firefox setup
git clone https://git.awy.one/autofox.git
Log | Files | Refs | README

userContent.css (20074B)


      1 /* USER FACING VARIABLES -------------------------------------------------------------------------------------- */
      2 /* this file does NOT have to be updated between versions */
      3 
      4 /* NOTE: restart Firefox to apply any changes */
      5 body, html {
      6     overflow: -moz-scrollbars-none;
      7     scrollbar-width: none !important;
      8 }
      9 
     10 * {
     11     scrollbar-width: none !important;
     12 }
     13 
     14 :root {
     15 
     16 
     17   /* custom accent color to be used across Firefox*/
     18   /* use hexcode or color name */
     19   --custom-accent-color: #ebcb8b;
     20 
     21   /* background color */
     22   --uc-my-background-color: #353C4A !important;
     23   --background-color-canvas: var(--uc-my-background-color) !important;
     24   --background-color-box: var(--uc-my-background-color) !important;
     25 
     26   /* text color */
     27   --in-content-page-color: #d8dee9 !important;
     28 
     29   --table-row-background-color-alternate:#2e3440 !important;
     30 
     31 
     32   /* color of the tab dividers / separators */
     33   /* set variable = none, to disable dividers */
     34   --custom-tab-divider-color: #535354;
     35 
     36 
     37   /* sets the height of the tabs toolbar */
     38   /* legacy height (<= v1.6.2) = 33px */
     39   /* functionality broken as of FF 108 - WIP */
     40   /* --tab-bar-height: 35px; */
     41 
     42 
     43   /* set the size of sync profile pic */
     44   /* 1.0 = 100% scale */
     45   --sync-avatar-scale: 1.0;
     46 
     47   /* custom paddings/margins for the menu itmes */
     48   /* for reference: */
     49   --custom-menuitem-padding-vertical: 6px;
     50   --custom-menuitem-padding-horizontal: 8px;
     51   --custom-menuitem-margin: 4px;
     52 
     53 }
     54 
     55 @-moz-document regexp("^(about:).*") {
     56   body {
     57     background-color: #353C4A !important;
     58   }
     59 }
     60 
     61 /* CUSTOM ACCENT COLORS -------------------------------------------------------------------------------------- */
     62 
     63 @-moz-document regexp("^(about:|chrome:|moz-extension:).*") {
     64 
     65   html:not([role="dialog"]),
     66   html:not([role="dialog"]) *,
     67   html:not([role="dialog"]) body.activity-stream,
     68   window:not([chromehidden]),
     69   window:not([chromehidden])>dialog {
     70     --surface-1: #353C4A !important;
     71     --surface-2: #2e3440 !important;
     72     --accent-surface-1: #ebcb8b !important;
     73     --dashboard-tab-active-ink: #ebcb8b !important;
     74     --in-content-primary-button-background: var(--custom-accent-color, #0a84ff) !important;
     75     --in-content-primary-button-background-hover: color-mix(in srgb, white 50%, var(--custom-accent-color, #0a84ff)) !important;
     76     --in-content-primary-button-background-active: color-mix(in srgb, white 65%, var(--custom-accent-color, #0a84ff)) !important;
     77 
     78     --in-content-item-selected: var(--custom-accent-color, #0a84ff) !important;
     79     --in-content-border-highlight: var(--custom-accent-color, #0a84ff) !important;
     80     --in-content-border-hover: color-mix(in srgb, white 50%, var(--custom-accent-color, #0a84ff)) !important;
     81     /* --in-content-border-focus: color-mix(in srgb, white 65%, var(--custom-accent-color, #0a84ff)) !important; */
     82     --in-content-border-focus: var(--custom-accent-color, #0a84ff) !important;
     83     --in-content-border-active: var(--custom-accent-color, #0a84ff) !important;
     84     --in-content-border-active-shadow: var(--custom-accent-color, #0a84ff) !important;
     85     --in-content-category-outline-focus: 1px solid transparent !important;
     86     --in-content-accent-color: var(--custom-accent-color, #0a84ff) !important;
     87     --in-content-table-header-background: var(--custom-accent-color, #0a84ff) !important;
     88     --in-content-link-color: var(--custom-accent-color, #0a84ff) !important;
     89     --in-content-link-color-hover: color-mix(in srgb, white 50%, var(--custom-accent-color, #0a84ff)) !important;
     90     --newtab-focus-outline: var(--in-content-border-active-shadow) !important;
     91     --newtab-focus-border: var(--in-content-border-focus) !important;
     92     --newtab-focus-border-selected: var(--custom-accent-color) !important;
     93     --newtab-textbox-focus-color: var(--in-content-border-focus) !important;
     94     --newtab-primary-action-background: var(--custom-accent-color) !important;
     95     --color-accent-primary: var(--custom-accent-color) !important;
     96     --color-accent-primary-hover: color-mix(in srgb, white 50%, var(--custom-accent-color, #0a84ff)) !important;
     97     --color-accent-primary-active: var(--custom-accent-color) !important;
     98     --brand-color-accent: var(--custom-accent-color) !important;
     99     --brand-color-accent-hover: color-mix(in srgb, white 50%, var(--custom-accent-color, #0a84ff)) !important;
    100     --brand-color-accent-active: var(--custom-accent-color) !important;
    101   }
    102 }
    103 
    104 @-moz-document url("chrome://global/content/commonDialog.xhtml") {
    105   #commonDialog[subdialog] checkbox {
    106     --checkbox-checked-bgcolor: var(--custom-accent-color, #0a84ff) !important;
    107     --checkbox-checked-hover-bgcolor: color-mix(in srgb, white 50%, var(--custom-accent-color, #0a84ff)) !important;
    108     --checkbox-checked-active-bgcolor: color-mix(in srgb, white 65%, var(--custom-accent-color, #0a84ff)) !important;
    109   }
    110 }
    111 
    112 .topsite-form .form-wrapper input[type="text"]:focus-visible {
    113   outline: none !important;
    114   border-color: var(--newtab-focus-border) !important;
    115 }
    116 
    117 .showPrivate .search-handoff-button.focused {
    118   outline: 0;
    119   border: 1px solid var(--newtab-focus-border) !important;
    120   box-shadow: 0 0 0 2px var(--newtab-focus-outline) !important;
    121 }
    122 
    123 ::-moz-progress-bar {
    124   background-color: var(--custom-accent-color, #0a84ff) !important;
    125 }
    126 
    127 login-filter {
    128   --in-content-primary-button-background: var(--custom-accent-color, #0a84ff) !important;
    129   --in-content-primary-button-background-hover: color-mix(in srgb, white 50%, var(--custom-accent-color, #0a84ff)) !important;
    130   --in-content-primary-button-background-active: color-mix(in srgb, white 65%, var(--custom-accent-color, #0a84ff)) !important;
    131 }
    132 
    133 
    134 /* NEW TAB PAGE ---------------------------------------------------------------------------------------------- */
    135 
    136 @-moz-document url(about:home), url(about:newtab), url(about:privatebrowsing){
    137 
    138 /* square the search box  corners */
    139 body .search-handoff-button {
    140   border-radius: 0 !important;
    141 }
    142 
    143 /* square the settings button and checkboxes / buttons / selectors inside its menu */
    144 .personalize-buttonm,
    145 .close-button,
    146 .selector,
    147 .sponsored-checkbox,
    148 .wallpaper-input {
    149   border-radius: 0 !important;
    150 }
    151 
    152 .weatherCard,
    153 .weatherInfoLink,
    154 .weatherButtonContextMenuWrapper {
    155   border-radius: 0 !important;
    156   border-start-start-radius: 0;
    157   border-end-start-radius: 0;
    158   border-start-end-radius: 0;
    159   border-end-end-radius: 0;
    160 }
    161 
    162 /* square the toggle button for above */
    163 .slider {
    164   border-radius: 0 !important;
    165 }
    166 
    167 .slider::before {
    168   border-radius: 0 !important;
    169   background: #fff !important;
    170 }
    171 
    172 .toggle-button {
    173   --toggle-border-radius: 0 !important;
    174 }
    175 
    176 /* square all the 3 dot menus */
    177 .context-menu-button,
    178 .context-menu {
    179   border-radius: 0 !important;
    180 }
    181 
    182 /* square the shortcuts: icons, background, and selection box */
    183 /* square the "suggested by pocket" cards and images */
    184 .tile,
    185 .top-site-icon,
    186 .icon-wrapper,
    187 .top-site-outer,
    188 .ds-card,
    189 .ds-card>.ds-card-topic,
    190 .card-stp-button-hover-background,
    191 img {
    192   border-radius: 0 !important;
    193 }
    194 
    195 /* square all the recent activity cards and images */
    196 .card,
    197 .card-outer,
    198 .card-preview-image-outer,
    199 .card-context,
    200 .sections-list,
    201 .section-empty-state,
    202 .modal {
    203   border-radius: 0 !important;
    204 }
    205 
    206 /* square the VPN button/infobox in private browsing */
    207 #private-browsing-vpn-link,
    208 .info,
    209 .promo {
    210   border-radius: 0 !important;
    211 }
    212 
    213 /* add hover/click colors on new tab page [workaround] */
    214 .slider:hover {
    215   box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.4) !important;
    216 }
    217 
    218 .slider:active {
    219   box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.6) !important;
    220 }
    221 
    222 .sponsored-checkbox:checked:hover {
    223   box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.4) !important;
    224 }
    225 
    226 .sponsored-checkbox:checked:active {
    227   box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.6) !important;
    228 }
    229 
    230 .sponsored-checkbox:hover {
    231   box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.4) !important;
    232 }
    233 
    234 .sponsored-checkbox:active {
    235   box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.6) !important;
    236 }
    237 
    238 .selector:hover {
    239   box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.3) !important;
    240 }
    241 
    242 .selector:active {
    243   box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.5) !important;
    244 }
    245 }
    246 
    247 
    248 /* SETTINGS PAGE ------------------------------------------------------------------------------------------- */
    249 
    250 @-moz-document url(about:preferences), url(about:preferences#general), url(about:preferences#home),
    251 url(about:preferences#search), url(about:preferences#privacy), url(about:preferences#sync),
    252 url(about:preferences#moreFromMozilla), url(about:addons){
    253 
    254 /* square checkboxes */
    255 .checkbox-check {
    256   border-radius: 0 !important;
    257 }
    258 
    259 #automaticallySubmitCrashesBox {
    260   border-radius: 0 !important;
    261 }
    262 
    263 /* square selection buttons */
    264 button {
    265   border-radius: 0 !important;
    266 }
    267 
    268 richlistitem {
    269   border-radius: 0 !important;
    270 }
    271 
    272 .sidebar-footer-link {
    273   border-radius: 0 !important;
    274 }
    275 
    276 /* square toggle buttons */
    277 .toggle-button {
    278   border-radius: 0 !important;
    279 }
    280 
    281 .toggle-button::before {
    282   border-radius: 0 !important;
    283 }
    284 
    285 /* square search engines table on about:preferences#search page */
    286 #engineList {
    287   border-radius: 0 !important;
    288 }
    289 
    290 /* Tracking Protection options on about:preferences#privacy page */
    291 .content-blocking-category {
    292   border-radius: 0 !important;
    293 }
    294 
    295 .content-blocking-warning {
    296   border-radius: 0 !important;
    297 }
    298 
    299 /* infoboxes (e.g. settings required by addon) */
    300 #browserContainersExtensionContent {
    301   border-radius: 0 !important;
    302 }
    303 
    304 #firefoxSuggestInfoBox {
    305   border-radius: 0 !important;
    306 }
    307 
    308 #updateSettingsContainer {
    309   border-radius: 0 !important;
    310 }
    311 
    312 .info-box-container {
    313   border-radius: 0 !important;
    314 }
    315 
    316 /* folder selection and table for Files and Applications */
    317 #downloadFolder {
    318   border-radius: 0 !important;
    319 }
    320 
    321 #handlersView {
    322   border-radius: 0 !important;
    323 }
    324 
    325 /* input, info boxes, and profile on sync page */
    326 #fxaSyncComputerName {
    327   border-radius: 0 !important;
    328 }
    329 
    330 .sync-configured {
    331   border-radius: 0 !important;
    332 }
    333 
    334 .fxaProfileImage {
    335   border-radius: 0 !important;
    336 }
    337 
    338 /* more from mozilla page */
    339 .qr-code-box {
    340   border-radius: 0 !important;
    341 }
    342 
    343 .qr-code-box-image {
    344   border-radius: 0 !important;
    345 }
    346 
    347 
    348 /* enterprise policies infobox */
    349 #policies-container {
    350   border-radius: 0 !important;
    351 }
    352 
    353 /* website appearance selections */
    354 .web-appearance-choice {
    355   border-radius: 0 !important;
    356 }
    357 
    358 /* dropdown selectors in tables */
    359 menupopup {
    360   --panel-border-radius: 0 !important;
    361 }
    362 }
    363 
    364 
    365 @-moz-document url(about:preferences), url(about:preferences#general), url(about:preferences#home),
    366 url(about:preferences#search), url(about:preferences#privacy), url(about:preferences#sync){
    367 
    368 /* match toggle buttons to normal button look (only about:preferences) */
    369 input[type="checkbox"].toggle-button::before {
    370   height: 10px !important;
    371   width: 10px !important;
    372   margin-top: 4px !important;
    373   margin-left: 2px !important;
    374 }
    375 }
    376 
    377 
    378 /* square popup windows and buttons */
    379 @-moz-document regexp("^(about:|chrome:|moz-extension:).*") {
    380   richlistbox {
    381     border-radius: 0 !important;
    382   }
    383 
    384   button {
    385     border-radius: 0 !important;
    386   }
    387 
    388   .dialogBox {
    389     border-radius: 0 !important;
    390   }
    391 
    392   menulist {
    393     border-radius: 0 !important;
    394   }
    395 
    396   checkbox {
    397     border-radius: 0 !important;
    398   }
    399 
    400   .checkbox-check {
    401     border-radius: 0 !important;
    402   }
    403 
    404   listheader {
    405     border-radius: 0 !important;
    406   }
    407 
    408   search-textbox {
    409     border-radius: 0 !important;
    410   }
    411 
    412   #url {
    413     border-radius: 0 !important;
    414   }
    415 
    416   tree {
    417     border-radius: 0 !important;
    418   }
    419 
    420   /* network settings popup */
    421   #networkProxyNone {
    422     border-radius: 0 !important;
    423   }
    424 
    425   #networkProxyAutoconfigURL {
    426     border-radius: 0 !important;
    427   }
    428 
    429   #networkProxySOCKS_Port {
    430     border-radius: 0 !important;
    431   }
    432 
    433   #networkProxySOCKS {
    434     border-radius: 0 !important;
    435   }
    436 
    437   #networkProxySSL_Port {
    438     border-radius: 0 !important;
    439   }
    440 
    441   #networkProxySSL {
    442     border-radius: 0 !important;
    443   }
    444 
    445   #networkProxyHTTP_Port {
    446     border-radius: 0 !important;
    447   }
    448 
    449   #networkProxyHTTP {
    450     border-radius: 0 !important;
    451   }
    452 
    453   /* saved addresses popup */
    454   #given-name {
    455     border-radius: 0 !important;
    456   }
    457 
    458   #family-name {
    459     border-radius: 0 !important;
    460   }
    461 
    462   #street-address {
    463     border-radius: 0 !important;
    464   }
    465 
    466   #address-level2 {
    467     border-radius: 0 !important;
    468   }
    469 
    470   #address-level1 {
    471     border-radius: 0 !important;
    472   }
    473 
    474   #postal-code {
    475     border-radius: 0 !important;
    476   }
    477 
    478   #organization {
    479     border-radius: 0 !important;
    480   }
    481 
    482   #country {
    483     border-radius: 0 !important;
    484   }
    485 
    486   #tel {
    487     border-radius: 0 !important;
    488   }
    489 
    490   #email {
    491     border-radius: 0 !important;
    492   }
    493 
    494   /* saved credit cards popup */
    495   #cc-number {
    496     border-radius: 0 !important;
    497   }
    498 
    499   #cc-exp-month {
    500     border-radius: 0 !important;
    501   }
    502 
    503   #cc-exp-year {
    504     border-radius: 0 !important;
    505   }
    506 
    507   #cc-name {
    508     border-radius: 0 !important;
    509   }
    510 
    511   #cc-type {
    512     border-radius: 0 !important;
    513   }
    514 
    515   /* primary password dialog */
    516   #message {
    517     border-radius: 0 !important;
    518   }
    519 
    520   #pw1 {
    521     border-radius: 0 !important;
    522   }
    523 
    524   #pw2 {
    525     border-radius: 0 !important;
    526   }
    527 
    528   #pwmeter {
    529     appearance: none !important;
    530     height: 0.35em !important;
    531     border: none !important;
    532     vertical-align: 0 !important;
    533     margin: 0.5em 0 !important;
    534   }
    535 
    536   /* custom color selection */
    537   #foregroundtextmenu {
    538     border-radius: 0 !important;
    539   }
    540 
    541   #backgroundmenu {
    542     border-radius: 0 !important;
    543   }
    544 
    545   #unvisitedlinkmenu {
    546     border-radius: 0 !important;
    547   }
    548 
    549   #visitedlinkmenu {
    550     border-radius: 0 !important;
    551   }
    552 
    553   /* clear history warning popup */
    554   #sanitizeEverythingWarningBox {
    555     border-radius: 0 !important;
    556   }
    557 
    558 }
    559 
    560 
    561 /* ADDONS PAGE --------------------------------------------------------------------------------------------- */
    562 
    563 @-moz-document url(about:addons){
    564 
    565 /* square search box */
    566 search-textbox {
    567   border-radius: 0 !important;
    568 }
    569 
    570 /* square the context menus (3 dots and settings gear) */
    571 panel-list {
    572   border-radius: 0 !important;
    573 }
    574 
    575 /* square the info boxes / banners */
    576 .discopane-notice {
    577   border-radius: 0 !important;
    578 }
    579 
    580 .container {
    581   border-radius: 0 !important;
    582 }
    583 
    584 /* square the addons and theme cards */
    585 .card-heading-image {
    586   border-radius: 0 !important;
    587 }
    588 
    589 .card {
    590   border-radius: 0 !important;
    591 }
    592 
    593 /* square selection buttons */
    594 button {
    595   border-radius: 0 !important;
    596 }
    597 
    598 richlistitem {
    599   border-radius: 0 !important;
    600 }
    601 
    602 menulist {
    603   border-radius: 0 !important;
    604 }
    605 
    606 .sidebar-footer-link {
    607   border-radius: 0 !important;
    608 }
    609 
    610 /* square toggle buttons */
    611 .toggle-button,
    612 .toggle-button::before {
    613   border-radius: 0 !important;
    614 }
    615 
    616 /* available addons update badge */
    617 .category[badge-count]::after {
    618   border-radius: 0 !important;
    619 }
    620 
    621 /* extensions shortcuts */
    622 .shortcut-input {
    623   border-radius: 0 !important;
    624 }
    625 }
    626 
    627 
    628 /* ABOUT CONFIG PAGE ---------------------------------------------------------------------------------------- */
    629 
    630 @-moz-document url(about:config){
    631 
    632 /* square everything except radio buttons */
    633 #about-config-search {
    634   border-radius: 0 !important;
    635 }
    636 
    637 #about-config-show-only-modified {
    638   border-radius: 0 !important;
    639 }
    640 
    641 #showWarningNextTime {
    642   border-radius: 0 !important;
    643 }
    644 
    645 button {
    646   border-radius: 0 !important;
    647 }
    648 }
    649 
    650 
    651 /* DOWNLOADS ------------------------------------------------------------------------------------------------ */
    652 
    653 @-moz-document url(about:downloads){
    654 
    655 /* square buttons and boxes*/
    656 .button-box {
    657   border-radius: 0 !important;
    658 }
    659 
    660 richlistbox {
    661   border-radius: 0 !important;
    662 }
    663 
    664 .downloadProgress {
    665   border-radius: 0 !important;
    666 }
    667 
    668 .downloadProgress[paused] {
    669   border-radius: 0 !important;
    670 }
    671 
    672 .downloadProgress:not([value="0"])::-moz-progress-bar {
    673   border-radius: 0 !important;
    674 }
    675 
    676 .downloadProgress::-moz-progress-bar {
    677   border-radius: 0 !important;
    678 }
    679 
    680 .downloadProgress[paused]::-moz-progress-bar {
    681   border-radius: 0 !important;
    682 }
    683 }
    684 
    685 
    686 /* FIREFOX VIEW PAGE ----------------------------------------------------------------------------------------- */
    687 @-moz-document regexp("^(about:firefoxview).*") {
    688 
    689   :root {
    690     --button-border-radius: 0 !important;
    691   }
    692 
    693   .tabpickup-steps,
    694   .twisty,
    695   .closed-tab-li-main,
    696   .card,
    697   .zap-card::before {
    698     border-radius: 0 !important;
    699   }
    700 
    701   .step-progress,
    702   .step-progress:not([value="0"])::-moz-progress-bar {
    703     border-radius: 0 !important;
    704   }
    705 
    706   #colorways-collection-expiry-date,
    707   #colorways-collection-expiry-date>span {
    708     border-radius: 0 !important;
    709   }
    710 
    711   * {
    712     border-radius: 0 !important;
    713   }
    714 }
    715 
    716 /* OTHER INTERNAL PAGES ------------------------------------------------------------------------------------- */
    717 
    718 @-moz-document url(about:buildconfig), url(about:compat), url(about:crashes), url(about:debugging),
    719 url(about:debugging#/setup), url(about:debugging#/runtime/this-firefox), url(about:devtools),
    720 url(about:networking), url(about:policies), url(about:profiles),
    721 url(about:profiling), url(about:protections), url(about:serviceworkers), url(about:studies),
    722 url(about:support), url(about:telemetry), url(about:unloads), url(about:url-classifier),
    723 url(about:webrtc), url(about:welcome){
    724 * {
    725   border-radius: 0 !important;
    726 }
    727 }
    728 
    729 
    730 /* PASSWORDS AND LOGINS ------------------------------------------------------------------------------------- */
    731 
    732 @-moz-document regexp("^(about:logins).*") {
    733   * {
    734     border-radius: 0 !important;
    735   }
    736 }
    737 
    738 /* SERVER NOT FOUND PAGE ------------------------------------------------------------------------------------- */
    739 
    740 @supports (-moz-appearance:none) {
    741   .primary.try-again {
    742     border-radius: 0 !important;
    743   }
    744 }
    745 
    746 
    747 /* WARNING SECURITY RISK PAGE --------------------------------------------------------------------------------- */
    748 
    749 @supports (-moz-appearance:none) {
    750   .primary.try-again {
    751     border-radius: 0 !important;
    752   }
    753 
    754   #returnButton {
    755     border-radius: 0 !important;
    756   }
    757 
    758   #advancedButton {
    759     border-radius: 0 !important;
    760   }
    761 
    762   #exceptionDialogButton {
    763     border-radius: 0 !important;
    764   }
    765 
    766   #advancedPanelReturnButton {
    767     border-radius: 0 !important;
    768   }
    769 
    770   #automaticallyReportBlockingInFuture {
    771     border-radius: 0 !important;
    772   }
    773 }
    774 
    775 
    776 /* Restart Firefox page after update ------------------------------------------------------------------------- */
    777 
    778 @supports (-moz-appearance:none) {
    779   #restart {
    780     border-radius: 0 !important;
    781   }
    782 }
    783 
    784 
    785 /* SCREENSHOT PAGE ------------------------------------------------------------------------------------------ */
    786 
    787 @supports (-moz-appearance:none) {
    788   .cancel-shot {
    789     border-radius: 0 !important;
    790   }
    791 
    792   .all-buttons-container {
    793     border-radius: 0 !important;
    794   }
    795 
    796   .visible {
    797     border-radius: 0 !important;
    798   }
    799 
    800   .full-page {
    801     border-radius: 0 !important;
    802   }
    803 
    804   .highlight-button-cancel {
    805     border-radius: 0 !important;
    806   }
    807 
    808   .highlight-button-copy {
    809     border-radius: 0 !important;
    810   }
    811 
    812   .highlight-button-download {
    813     border-radius: 0 !important;
    814   }
    815 
    816   .preview-buttons {
    817     border-radius: 0 !important;
    818   }
    819 
    820   .preview-image-wrapper {
    821     border-radius: 0 !important;
    822   }
    823 }
    824 
    825 
    826 /* PICTURE IN PICTURE PAGE ----------------------------------------------------------------------------------- */
    827 
    828 @supports (-moz-appearance:none) {
    829   .pip-small.clickable {
    830     border-radius: 0 !important;
    831   }
    832 
    833   .pip-expanded {
    834     border-radius: 0 !important;
    835   }
    836 
    837   .pip-explainer {
    838     border-bottom-right-radius: 0 !important;
    839     border-bottom-left-radius: 0 !important;
    840   }
    841 }
    842 
    843 
    844 /* READER MODE ----------------------------------------------------------------------------------------------- */
    845 
    846 @supports (-moz-appearance:none) {
    847 
    848   .reader-toolbar,
    849   .dropdown-popup,
    850   .radiorow>label,
    851   .font-size-value,
    852   .content-width-value,
    853   .line-height-value,
    854   .color-input-container,
    855   .narrate-control,
    856   .narrate-start-stop,
    857   #font-type-selector,
    858   #font-weight-selector {
    859     border-radius: 0 !important;
    860     border-start-start-radius: 0;
    861     border-end-start-radius: 0;
    862   }
    863 }
    864 
    865 /* REVIEW CHECKER */
    866 
    867 @supports (-moz-appearance:none) {
    868 
    869   .onboardingContainer.shopping .screen[pos=split],
    870   .onboardingContainer.shopping .screen[pos="split"] .section-main .main-content,
    871   .shopping-card,
    872   #letter-grade-wrapper,
    873   #letter-grade-term,
    874   #letter-grade-description,
    875   #beta-marker {
    876     border-radius: 0 !important;
    877   }
    878 }