/* look15-own.css — v475 · Jetsy's own look, nothing that reads as an Apple app (Joe, Sat 24 Oct 2026 2:20pm, a screenshot of his Account
   sheet next to phone: "This looks similar to Apple make sure that nothing looks too similar to Apple"; 10:55am "Make sure we
   can't get in trouble for doing anything in Jetsy's own look make it the same but different").
   looks 13 and 14 drew several screens on purpose in Jetsy's own look's own (Settings, Contacts, Spotlight, the App Store). This layer, loaded
   last, takes the parts that make a screen read as Apple's and draws them Jetsy's way; Apple's exact system colors were already swapped
   for Jetsy's own in every look file (tools/p475/own_colors.py):
     · icon tiles — Settings' filled squircle with a white glyph → a round tile, a soft wash of its color, the glyph in the color
     · the gray initials circle — gone from the Account sheets (Joe crossed it out); the header's initials button is Jetsy's navy square
       with an orange ring and orange letters
     · switches — Apple's 51×31 green pill with a round white knob → Jetsy's 48×28 rounded square, orange when on, a square knob
     · the language picker — Apple's gray segmented track → two outlined choices, the picked one orange
     · sheet headers — the centered title with a blue Done → the title at the left, Done in orange
     · grouped rows — the separator that starts after the icon (Settings' inset line) → a full-width hairline; cards get an edge
     · the picked company chip — filled white → filled orange
   Off: localStorage nolook15 = 1. Every rule sits under html:not(.nolook15) with fake ids, so it wins over looks 13 and 14 whatever
   the order. Light mode (html.je-light) has its own values below. */

html:not(.nolook15){
  --j15-or:#FF6A1A; --j15-or-ink:#1A0C02; --j15-or-soft:rgba(255,106,26,.16);
  --j15-line:rgba(201,212,230,.16); --j15-edge:rgba(201,212,230,.10);
  --j15-sw-off:rgba(201,212,230,.18); --j15-knob:#E6ECF5; --j15-knob-on:#FFFFFF;
  --j15-me-bg:linear-gradient(180deg,#1E3354 0%,#122138 100%); --j15-me-ink:#FF8A3D; --j15-me-ring:0 0 0 1.5px rgba(255,138,61,.85);
}
html.je-light:not(.nolook15){
  --j15-or:#E2561B; --j15-or-ink:#FFFFFF; --j15-or-soft:rgba(226,86,27,.12);
  --j15-line:rgba(16,32,58,.14); --j15-edge:rgba(16,32,58,.10);
  --j15-sw-off:rgba(16,32,58,.16); --j15-knob:#FFFFFF; --j15-knob-on:#FFFFFF;
  --j15-me-bg:linear-gradient(180deg,#1E3354 0%,#122138 100%); --j15-me-ink:#FFB27A; --j15-me-ring:0 0 0 1.5px rgba(226,86,27,.85);
}

/* ---- icon tiles: round, not Settings' squircle ------------------------------------------------------------------------------ */
html:not(.nolook15):not(#j15x) body section.bc>.bc-hd h2>.ji[data-l13c]:first-child,
html:not(.nolook15):not(#j15x) body main section.bc.tc-collapsed>.bc-hd h2>.ji[data-l13c]:first-child,
html:not(.nolook15):not(#j15x) body main .h>h2>.j6-ji[data-l13c],
html:not(.nolook15):not(#j15x) body main summary.cb-s>.cb-nm>.j6-ji[data-l13c],
html:not(.nolook15):not(#j15x) body .lx-t .lx-m[data-l13c],
html:not(.nolook15):not(#j15x) body #lx .lx-t .lx-m[data-l13c],
html:not(.nolook15):not(#j15x) body .cmk-m.j6-mi[data-l13c],
html:not(.nolook15):not(#j15x) body .tj-t .tj-ic[data-l13c],
html:not(.nolook15):not(#j15x) body .je2-sh .je2-tab>svg[data-l13c]:first-child,
html:not(.nolook15):not(#j15x) body .l14-ico,
html:not(.nolook15):not(#j15x) body .jmb-plus-sh .jmb-grid .jmb-a i[data-l14c],
html:not(.nolook15):not(#j15x) body .jfind-wrap .jfind-list .jfind-tiles .l14-ico,
html:not(.nolook15):not(#j15x) body .jfind-wrap .jfind-list .l14-grp .l14-ico,
html:not(.nolook15):not(#j15x) .j14-ico,
html:not(.nolook15):not(#j15x) .j13-ico{border-radius:50%!important}
/* a soft wash of the tile's color and the glyph in that color (phones that can mix colors; older ones keep the filled round tile) */
@supports (background:color-mix(in srgb, red 20%, transparent)){
  html:not(.nolook15):not(#j15x) .j14-ico.j14-blue{--j15c:var(--j14-blue)}
  html:not(.nolook15):not(#j15x) .j14-ico.j14-indigo{--j15c:var(--j14-indigo)}
  html:not(.nolook15):not(#j15x) .j14-ico.j14-purple{--j15c:var(--j14-purple)}
  html:not(.nolook15):not(#j15x) .j14-ico.j14-pink{--j15c:var(--j14-pink)}
  html:not(.nolook15):not(#j15x) .j14-ico.j14-orange{--j15c:var(--j14-orange)}
  html:not(.nolook15):not(#j15x) .j14-ico.j14-green{--j15c:var(--j14-green)}
  html:not(.nolook15):not(#j15x) .j14-ico.j14-red{--j15c:var(--j14-red)}
  html:not(.nolook15):not(#j15x) .j14-ico.j14-gray{--j15c:var(--j14-gray)}
  html:not(.nolook15):not(#j15x) .j13-ico.j13-blue{--j15c:var(--j13-blue)}
  html:not(.nolook15):not(#j15x) .j13-ico.j13-indigo{--j15c:var(--j13-indigo)}
  html:not(.nolook15):not(#j15x) .j13-ico.j13-purple{--j15c:var(--j13-purple)}
  html:not(.nolook15):not(#j15x) .j13-ico.j13-pink{--j15c:var(--j13-pink)}
  html:not(.nolook15):not(#j15x) .j13-ico.j13-orange{--j15c:var(--j13-orange)}
  html:not(.nolook15):not(#j15x) .j13-ico.j13-green{--j15c:var(--j13-green)}
  html:not(.nolook15):not(#j15x) .j13-ico.j13-red{--j15c:var(--j13-red)}
  html:not(.nolook15):not(#j15x) .j13-ico.j13-gray{--j15c:var(--j13-gray)}
  html:not(.nolook15):not(#j15x) .j14-ico[class*="j14-"]:not(.j14-goldi),
  html:not(.nolook15):not(#j15x) .j13-ico[class*="j13-"]{background:color-mix(in srgb,var(--j15c,var(--j15-or)) 20%,transparent)!important;color:var(--j15c,var(--j15-or))!important;box-shadow:none!important}
  html:not(.nolook15):not(#j15x) .j14-ico:not(.j14-goldi) svg [stroke]:not([stroke="none"]),
  html:not(.nolook15):not(#j15x) .j13-ico svg [stroke]:not([stroke="none"]){stroke:var(--j15c,var(--j15-or))!important}
  html:not(.nolook15):not(#j15x) .j14-ico:not(.j14-goldi) svg [fill]:not([fill="none"]),
  html:not(.nolook15):not(#j15x) .j13-ico svg [fill]:not([fill="none"]){fill:var(--j15c,var(--j15-or))!important}

  html:not(.nolook15):not(#j15x) body section.bc>.bc-hd h2>.ji[data-l13c]:first-child,
  html:not(.nolook15):not(#j15x) body main .h>h2>.j6-ji[data-l13c],
  html:not(.nolook15):not(#j15x) body main summary.cb-s>.cb-nm>.j6-ji[data-l13c],
  html:not(.nolook15):not(#j15x) body .lx-t .lx-m[data-l13c],
  html:not(.nolook15):not(#j15x) body #lx .lx-t .lx-m[data-l13c],
  html:not(.nolook15):not(#j15x) body .cmk-m.j6-mi[data-l13c],
  html:not(.nolook15):not(#j15x) body .tj-t .tj-ic[data-l13c]{background:color-mix(in srgb,var(--l13-c) 20%,transparent)!important;color:var(--l13-c)!important}
  html:not(.nolook15):not(#j15x) body [data-l13c] svg [stroke]:not([stroke="none"]){stroke:var(--l13-c)!important}
  html:not(.nolook15):not(#j15x) body [data-l13c] svg [fill]:not([fill="none"]):not([fill*="4FA8FF"]):not([fill$="fff"]){fill:var(--l13-c)!important}
  html:not(.nolook15):not(#j15x) body [data-l13c] svg [fill*="4FA8FF"]{fill:var(--l13-c)!important;fill-opacity:.28!important}
  html:not(.nolook15):not(#j15x) body [data-l13c] svg [fill$="fff"]{fill:white!important}
  html:not(.nolook15):not(#j15x) body .tj-t .tj-ic[data-l13c] svg{stroke:var(--l13-c)!important}

  html:not(.nolook15):not(#j15x) body .l14-ico,
  html:not(.nolook15):not(#j15x) body .jmb-plus-sh .jmb-grid .jmb-a i[data-l14c]{background:color-mix(in srgb,var(--l14-c,var(--l14-gray)) 20%,transparent)!important;color:var(--l14-c,var(--l14-gray))!important;box-shadow:none!important}
  html:not(.nolook15):not(#j15x) body .l14-ico svg [stroke]:not([stroke="none"]),
  html:not(.nolook15):not(#j15x) body .jmb-plus-sh .jmb-grid .jmb-a i[data-l14c] svg [stroke]:not([stroke="none"]){stroke:var(--l14-c,var(--l14-gray))!important}
  html:not(.nolook15):not(#j15x) body .l14-ico svg [fill]:not([fill="none"]),
  html:not(.nolook15):not(#j15x) body .jmb-plus-sh .jmb-grid .jmb-a i[data-l14c] svg [fill]:not([fill="none"]){fill:var(--l14-c,var(--l14-gray))!important}
}

/* ---- the Account sheets (Joe's .j14-sh, a customer's .j13-sh): no initials circle; the title at the left, Done in orange --------- */
html:not(.nolook15):not(#j15x) .j14-av,
html:not(.nolook15):not(#j15x) .j13-av{display:none!important}
html:not(.nolook15):not(#j15x) .j14-shd,
html:not(.nolook15):not(#j15x) .j13-shd{justify-content:flex-start!important;padding:0 64px 0 2px!important}
html:not(.nolook15):not(#j15x) .j14-shd h2,
html:not(.nolook15):not(#j15x) .j13-shd h2{font-weight:800!important;font-size:20px!important;letter-spacing:-.02em!important}
html:not(.nolook15):not(#j15x) .j14-done,
html:not(.nolook15):not(#j15x) .j13-done,
html:not(.nolook15):not(#j15x) .tc-sheet [data-tc="closesheet"]{color:var(--j15-or)!important;font-weight:700!important}
/* the Cards sheet's header: the title at the left too */
html:not(.nolook15):not(#j15x) .tc-sheet > .tc-sh-hd{justify-content:flex-start!important;padding-left:4px!important}
html:not(.nolook15):not(#j15x) .tc-sheet > .tc-sh-hd h3{font-weight:800!important;font-size:20px!important;letter-spacing:-.02em!important}
/* grouped rows: an edge around each card, and a full-width hairline between rows (not Settings' line that starts after the icon) */
html:not(.nolook15):not(#j15x) .j14-grp,
html:not(.nolook15):not(#j15x) .j13-grp{border-radius:14px!important;box-shadow:inset 0 0 0 1px var(--j15-edge)!important}
html:not(.nolook15):not(#j15x) .j14-row + .j14-row::before,
html:not(.nolook15):not(#j15x) .j13-row + .j13-row::before{left:0!important;background:var(--j15-line)!important}

/* ---- the header's initials button: Jetsy's navy square, orange ring and letters (not Apple's gray circle) ------------------------ */
html.j14-top:not(.nolook15):not(#j14x):not(#j14y):not(#j15x) body header.appbar:not(#j14z) .in > .j14-me,
html.j13-top:not(.nolook15):not(#j13x):not(#j13y):not(#j15x) body header.appbar:not(#j13z) .in > .j13-me{background:var(--j15-me-bg)!important;color:var(--j15-me-ink)!important;box-shadow:var(--j15-me-ring)!important;border-radius:11px!important}

/* ---- switches: Jetsy's rounded square, orange when on, a square knob -------------------------------------------------------- */
html:not(.nolook15):not(#j15x) .j14-sw,
html:not(.nolook15):not(#j15x) .j13-sw,
html:not(.nolook15):not(#j15x) .tc-sheet .tc-sw,
html:not(.nolook15):not(#j15x) .tc-sheet i.tc-sw{flex:0 0 48px!important;width:48px!important;height:28px!important;border-radius:9px!important;background:var(--j15-sw-off)!important;box-shadow:none!important}
html:not(.nolook15):not(#j15x) .j14-sw::before,
html:not(.nolook15):not(#j15x) .j13-sw::before{top:-8px!important;bottom:-8px!important}   /* 28 px drawn, 44 px to a thumb */
html:not(.nolook15):not(#j15x) .j14-sw::after,
html:not(.nolook15):not(#j15x) .j13-sw::after,
html:not(.nolook15):not(#j15x) .tc-sheet .tc-sw::after{top:3px!important;left:3px!important;width:22px!important;height:22px!important;border-radius:7px!important;background:var(--j15-knob)!important;box-shadow:0 1px 2px rgba(0,0,0,.3)!important}
html:not(.nolook15):not(#j15x) .j14-sw[aria-checked="true"],
html:not(.nolook15):not(#j15x) .j13-sw[aria-checked="true"],
html:not(.nolook15):not(#j15x) .tc-sheet .tc-sw.on{background:var(--j15-or)!important}
html:not(.nolook15):not(#j15x) .j14-sw[aria-checked="true"]::after,
html:not(.nolook15):not(#j15x) .j13-sw[aria-checked="true"]::after,
html:not(.nolook15):not(#j15x) .tc-sheet .tc-sw.on::after{left:3px!important;transform:translateX(20px)!important;background:var(--j15-knob-on)!important}

/* ---- the language picker: two outlined choices, the picked one orange (not Apple's gray segmented track) ---------------------- */
html:not(.nolook15):not(#j15x) .j14-seg,
html:not(.nolook15):not(#j15x) .j13-seg{background:transparent!important;box-shadow:inset 0 0 0 1px var(--j15-line)!important;border-radius:12px!important;padding:3px!important;gap:3px!important}
html:not(.nolook15):not(#j15x) .j14-seg button,
html:not(.nolook15):not(#j15x) .j13-seg button{border-radius:9px!important}
html:not(.nolook15):not(#j15x) .j14-seg button[aria-checked="true"],
html:not(.nolook15):not(#j15x) .j13-seg button[aria-checked="true"]{background:var(--j15-or)!important;color:var(--j15-or-ink)!important;box-shadow:none!important;font-weight:700!important}

/* the money sheet's Week · Month · 3 months · Year and the calendar's Week / Month / List: the same outlined choices */
html:not(.nolook15):not(#j15x) .j13m-seg::before{background:transparent!important;box-shadow:inset 0 0 0 1px var(--j15-line)!important;border-radius:12px!important}
html:not(.nolook15):not(#j15x) .j13m-sg.j13m-on{color:var(--j15-or-ink)!important;font-weight:700!important}
html:not(.nolook15):not(#j15x) .j13m-sg.j13m-on::before{background:var(--j15-or)!important;box-shadow:none!important;border-radius:9px!important}
html:not(.nolook15):not(.nolook14):not(#j15x) body #main#main .jcal .jc-mode{background:transparent!important;box-shadow:inset 0 0 0 1px var(--j15-line)!important;border-radius:12px!important;padding:3px!important;gap:3px!important}
html:not(.nolook15):not(.nolook14):not(#j15x) body #main#main .jcal .jc-mb{border-radius:9px!important}
html:not(.nolook15):not(.nolook14):not(#j15x) body #main#main .jcal .jc-mb.on{background:var(--j15-or)!important;color:var(--j15-or-ink)!important;box-shadow:none!important}
html:not(.nolook15):not(.nolook14):not(#j15x) body #main#main .jcal .jc-mb:not(.on)+.jc-mb:not(.on)::after{display:none!important}

/* ---- the picked company chip: orange, not filled white ------------------------------------------------------------------------- */
html:not(.nolook15):not(.nolook14):not(.nolook12):not(#j15x) body #co-bar>button[aria-pressed="true"]{background:var(--j15-or)!important;color:var(--j15-or-ink)!important;box-shadow:none!important}

@media (prefers-reduced-motion:reduce){
  html:not(.nolook15) .j14-sw::after,html:not(.nolook15) .j13-sw::after,html:not(.nolook15) .tc-sheet .tc-sw::after{transition:none!important}
}
