/* TradeLog app: "Form Sheet" layer over tl-app.css.
   Same world as the site: newsprint, black ink, square corners, condensed Archivo for titles and figures.
   Light is the day edition; dark is the night edition (ink ground, newsprint type, silk-yellow brand). */

@font-face{font-family:'Archivo Form';font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62% 125%;src:url(/archivo-latin-wdth-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Archivo Form';font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62% 125%;src:url(/archivo-latin-ext-wdth-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root:root{color-scheme:light;
--bg:#E4E5DE;--sf:#F1F2EC;--sf2:#DADBD3;--ln:#B3B5AB;--ln2:#CDCFC6;--ink:#121311;--ink2:#393B35;--ink3:#53554E;
--br:#121311;--brs:rgba(18,19,17,.08);--brt:#F1F2EC;
--win:#0B6641;--wins:rgba(11,102,65,.12);--loss:#BE2A1E;--losss:rgba(190,42,30,.10);--be:#7A5A00;--bes:rgba(242,194,27,.28);
--sh:none;--ovl:rgba(18,19,17,.55);
--f:'Archivo Form','Archivo',system-ui,sans-serif;--fd:'Archivo Form','Archivo',system-ui,sans-serif;--fn:'Archivo Form','Archivo',system-ui,sans-serif;
--r:2px;--fs-hl:#F5CF2E;--fs-yellow:#F2C21B}
:root:root[data-theme=dark]{color-scheme:dark;
--bg:#121311;--sf:#1B1C19;--sf2:#252622;--ln:#45473F;--ln2:#2E2F2A;--ink:#E9EAE3;--ink2:#C3C5BC;--ink3:#9C9E95;
--br:#F2C21B;--brs:rgba(242,194,27,.14);--brt:#121311;
--win:#7FD9A9;--wins:rgba(127,217,169,.13);--loss:#FF9B8F;--losss:rgba(255,155,143,.12);--be:#F2C21B;--bes:rgba(242,194,27,.14);
--sh:none;--ovl:rgba(0,0,0,.7)}

html body{font-stretch:100%}
html .ap ::selection{background:var(--fs-hl);color:#121311}
html .ap{scrollbar-color:var(--ink) var(--sf2)}

/* square corners everywhere; true circles (dots, avatars, round buttons) stay round */
html .ap *,html .ap *::before,html .ap *::after{border-radius:0!important}
html .ap .ins i,html .ap .legend i,html .ap .gsc,html .ap .accbtn .dot,html .ap .avt,html .ap .shx,html .ap .shotlb .xb,html .ap .sydot,html .ap .aip::before,html .ap .aidots i,html .ap .aisend,html .ap .tdots i,html .ap .wqh .wn,html .ap .totop{border-radius:50%!important}

/* titles in the condensed display cut */
html .ap .brand,html .ap .top h1,html .ap .calhead h2,html .ap .pb h3,html .ap .welcome h2,html .ap .md>.mh h2,html .ap .wkt h2,html .ap .aub,html .ap .auc h1,html .ap .aup h2,html .ap .pubcta h3,html .ap .prod h3,html .ap .aipt b,html .ap .aihello h3,html .ap .tcard h3,html .ap .acxi,html .ap .tdh1 .sym,html .ap .spl b,html .ap .pwbadge,html .ap .pwel h2{font-stretch:66%;font-weight:850;letter-spacing:-.005em}
/* figures: condensed, tabular */
html .ap .num,html .ap .nethead .big,html .ap .hfacts b,html .ap .kpi .v,html .ap .chart text,html .ap .ring .rc b,html .ap .pt .mono,html .ap .snum,html .ap td.r,html .ap .tc1 .rv,html .ap .calsum b,html .ap .cd .rv,html .ap .pbst b,html .ap .rules li span:last-child,html .ap .acard2 b,html .ap .prow .sline span:last-child,html .ap .dhead .rv,html .ap .wktop .big,html .ap .wkd .wr,html .ap .wkc .wkcr .v,html .ap .aucode,html .ap .shk,html .ap .shlink .in,html .ap .probadge,html .ap .air,html .ap .rex b,html .ap .wqh .wn,html .ap .tdh2 .rv,html .ap .tdh2 .pn,html .ap .rrc .chip,html .ap .rrx,html .ap .sycode,html .ap .aifp{font-stretch:78%;font-variant-numeric:tabular-nums lining-nums}

/* page title sits on a heavy rule like a form-guide heading */
html .ap .top{border-bottom:1px solid var(--ink)}
html .ap .top h1{font-size:clamp(28px,3vw,40px);text-transform:uppercase;letter-spacing:.005em}
html .ap .brand{font-stretch:70%;font-size:24px}
html .ap .brand svg rect{fill:var(--ink)}
html .ap .brand svg path{stroke:var(--bg)}
html .ap .nethead .big,html .ap .wktop .big{font-stretch:64%;font-weight:900}
html .ap :focus-visible{outline:3px solid var(--br);outline-offset:2px}

/* flat print: no auras, glass, spotlights or glossy gradients */
html .ap .app::before,html .ap .app::after,html .ap .splash::before,html .ap .card::after,html .ap .netcard::before,html .ap .aup::before,html .ap .aip::before,html .ap .tdh::before{display:none!important}
html:root .ap{--glass:var(--sf);--spot:transparent;--au1:transparent;--au2:transparent;--dot:transparent}
html:root .ap .app,html:root:not([data-theme=dark]) .ap .app{background:var(--bg)}
html .ap .card{background:var(--sf);border:1px solid var(--ln);box-shadow:none}
html .ap .top{background:var(--bg);-webkit-backdrop-filter:none;backdrop-filter:none}
html .ap .side{background:var(--bg);-webkit-backdrop-filter:none;backdrop-filter:none;border-right:1px solid var(--ink)}
html .ap .tabbar,html:root[data-theme=dark] .ap .tabbar{background:var(--bg);-webkit-backdrop-filter:none;backdrop-filter:none;border-top:1px solid var(--ink)}
html .ap .ov{-webkit-backdrop-filter:none;backdrop-filter:none}
html:root .ap .nav.on,html:root:not([data-theme=dark]) .ap .nav.on{background:var(--ink);color:var(--bg)}
html:root .ap .btn.pri,html:root:not([data-theme=dark]) .ap .btn.pri{background:var(--br);color:var(--brt);box-shadow:none}
html .ap .btn.pri:hover{background:var(--win);color:#F1F2EC}
html .ap .shsl{background:#121311}
/* modal sheets read as printed slips */
html .ap .md{border:2px solid var(--ink);box-shadow:0 30px 60px -30px rgba(18,19,17,.55)}
/* card titles set like form-guide headings */
html .ap .ch h2{font-stretch:70%;font-weight:850;font-size:19px;letter-spacing:.01em;text-transform:uppercase}
html .ap .ch{border-bottom:2px solid var(--ink);padding-bottom:10px;margin:0 20px;padding-left:0;padding-right:0}

/* TradeLog mark and the AI button: a square ink tile (yellow at night), no old light-blue */
html .ap .aimk .bg,html .splash svg rect{fill:var(--ink);rx:0}
html .ap .aimk rect:not(.bg){fill:var(--bg)}
html:root[data-theme=dark] .ap .aimk .bg{fill:var(--br)}
html:root[data-theme=dark] .ap .aimk rect:not(.bg){fill:#121311}
html .ap .aifab{padding:0;border:2px solid var(--ink);background:var(--ink);color:var(--bg);box-shadow:0 14px 30px -14px rgba(18,19,17,.55);transition:background .2s,border-color .2s}
html .ap .aifab:hover{transform:none;box-shadow:0 14px 30px -14px rgba(18,19,17,.55)}
html:root[data-theme=dark] .ap .aifab{background:var(--br);border-color:var(--br);color:#121311}
html .ap .aifab>.aimk{border-radius:0!important}
html .ap .aifab:focus-visible{outline:3px solid var(--br);outline-offset:3px}
html:root[data-theme=dark] .ap .aifab:focus-visible{outline-color:var(--ink)}
html .ap .aifp{background:var(--fs-yellow);color:#121311;border:1.5px solid #121311}

/* splash mark: ink tile, paper bars */
html .ap .spl path{stroke:var(--bg)}
html .ap .spl svg{filter:none}
html:root[data-theme=dark] .ap .spl svg rect{fill:var(--br)}
html:root[data-theme=dark] .ap .spl path{stroke:#121311}

/* calendar month switcher: arrows as icons, the middle button says where you are */
html .ap .calnav{width:40px;padding:0;display:inline-grid;place-items:center}
html .ap .cali{display:inline-flex;width:18px;height:18px}
html .ap .cali svg{width:18px;height:18px;stroke-width:2.4}
html .ap .cali.l{transform:rotate(90deg)}
html .ap .cali.r{transform:rotate(-90deg)}
html .ap .calnow{min-width:112px}
html .ap .calnow.on{opacity:1;background:transparent;color:var(--ink3);border-color:var(--ln);cursor:default}
html .ap .calnow:not(.on){background:var(--ink);color:var(--bg);border-color:var(--ink)}
html:root[data-theme=dark] .ap .calnow:not(.on){background:var(--br);color:#121311;border-color:var(--br)}

/* visible pickers under symbol, setup, session and tag fields */
html .ap .pk{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
html .ap .pk .chip{min-height:36px;padding:0 12px;font-weight:600;font-size:13.5px;background:var(--bg);border-color:var(--ln);color:var(--ink)}
html .ap .pk .chip:hover{border-color:var(--ink)}
html .ap .pk .chip.on{background:var(--ink);border-color:var(--ink);color:var(--bg)}
html:root[data-theme=dark] .ap .pk .chip.on{background:var(--br);border-color:var(--br);color:#121311}
html .ap .pk .pkm{background:transparent;border-style:dashed;color:var(--ink3);font-weight:600}
html .ap #pk_f_sym .chip,html .ap #pk_f_sym input{font-stretch:80%;letter-spacing:.02em}
html .ap #f_sym{font-stretch:80%;font-weight:700;letter-spacing:.03em;text-transform:uppercase}
html .ap .pk .chip[hidden]{display:none}

/* night edition: no heavy white rules around the page frame */
html:root[data-theme=dark] .ap .top{border-bottom:1px solid var(--ln)}
html:root[data-theme=dark] .ap .side{border-right:1px solid var(--ln)}
html:root[data-theme=dark] .ap .tabbar{border-top:1px solid var(--ln)}

/* lighter page frame in the day edition too */
html:root:not([data-theme=dark]) .ap .top{border-bottom:1px solid var(--ink)}
html:root:not([data-theme=dark]) .ap .side{border-right:1px solid var(--ink)}
html:root:not([data-theme=dark]) .ap .tabbar{border-top:1px solid var(--ink)}
/* content starts below the frame line, never on it */
html .ap #view{padding-top:20px}
/* global search in the top bar */
html .ap .ctl{flex:1;justify-content:flex-end;min-width:0}
html .ap .gsrch{position:relative;flex:1 1 220px;max-width:380px;min-width:180px;margin-right:auto;margin-left:24px}
html .ap .gsrch .in{min-height:44px;padding-left:40px;padding-right:36px;background:var(--sf);font-size:15px}
html .ap .gsrch .in::-webkit-search-cancel-button{cursor:pointer}
html .ap .gsx-ico{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--ink3);pointer-events:none;display:flex}
html .ap .gsx-ico svg{width:18px;height:18px}
html .ap .gsrch kbd{position:absolute;right:10px;top:50%;transform:translateY(-50%);font:700 12px/1 var(--f);font-stretch:80%;color:var(--ink3);border:1px solid var(--ln);padding:3px 6px;pointer-events:none}
html .ap .gsrch .in:focus+kbd,html .ap .gsrch .in:not(:placeholder-shown)+kbd{display:none}
@media (max-width:1320px){html .ap .gsrch{flex-basis:100%;max-width:none;margin:0;order:-1}}
@media (max-width:760px){html .ap .gsrch{display:none}}
/* phones: the controls take their own full row under the title, as before the search box */
@media (max-width:900px){html .ap .top .ctl{flex:1 1 100%}}
/* phones: month title on its own line, the three month buttons share the row under it */
@media (max-width:640px){
  html .ap .calhead{flex-wrap:wrap}
  html .ap .calhead h2{flex:1 1 100%;margin-right:0}
  html .ap .calnow{min-width:0;flex:1 1 auto}
}