/* TI-84 Plus CE faceplate.
   Geometry is a 258 x 604 unit plate scaled so the 232 x 174 LCD is exactly
   320 x 240 CSS px (1 unit = 320/232 px), like the real CE screen. */
@font-face{font-family:'TI84Screen';src:url(/assets/fonts/ti84-screen.woff2?v=7) format('woff2');font-display:block}
@font-face{font-family:'TI84Status';src:url(/assets/fonts/ti84-status.woff2?v=3) format('woff2');font-display:block}

.ti84-body.ti84ce{
    position:relative;
    flex-shrink:0;
    width:355.862px;            /* 258 * 320/232 */
    height:833.103px;           /* 604 * 320/232 */
    padding:0;
    margin:0;
    border:0;
    border-radius:11px;
    background:#000;
    box-shadow:0 0 0 1px rgba(255,255,255,.07),0 24px 60px rgba(0,0,0,.55);
    transform-origin:top center;
    user-select:none;
    -webkit-user-select:none;
    -webkit-tap-highlight-color:transparent;
}
.ti84ce .ce-face{position:absolute;left:0;top:0;width:100%;height:100%;display:block;pointer-events:none}
.ti84ce .ce-face .ce-key .kb{transition:filter .06s,fill .06s}
.ti84ce .ce-face .ce-key.down .kb{filter:brightness(.8)}
.ti84ce .ce-face .ce-gen.down .kb{fill:#3b3b3b}
.ti84ce .ce-face .ce-key.down path:not(.kb){transform:translateY(.4px)}
.ti84ce.is-2nd #ce-second .kb{stroke:#fff;stroke-width:1.4}
.ti84ce.is-alpha #ce-alpha .kb{stroke:#fff;stroke-width:1.4}

/* ---------- key hit areas (transparent, over the artwork) ---------- */
.ti84ce .ti84-buttons{position:absolute;left:0;top:0;width:100%;height:100%;display:block;margin:0;padding:0;gap:0;pointer-events:none;z-index:3}
.ti84ce .calc-btn.ce-hit{
    all:unset;
    position:absolute;
    box-sizing:border-box;
    pointer-events:auto;
    cursor:pointer;
    border-radius:7px;
    -webkit-tap-highlight-color:transparent;
    touch-action:manipulation;
}
.ti84ce .calc-btn.ce-hit:focus-visible{outline:2px solid #44c8f5;outline-offset:-3px}
.ti84ce .calc-btn.ce-hit-arrow{border-radius:0;left:0;top:0;width:100%;height:100%}
.ti84ce .ce-dpad{position:absolute;clip-path:circle(50% at 50% 50%);pointer-events:none}
.ti84ce .ce-dpad-hub{position:absolute;left:33%;top:33%;width:34%;height:34%;border-radius:50%;pointer-events:auto;cursor:default}
.ti84ce .calc-btn.ce-hit-arrow:focus-visible{outline:none;background:rgba(68,200,245,.25)}

/* ---------- LCD ---------- */
.ti84ce .ti84-screen-bezel{
    position:absolute;
    left:17.931px;              /* 13 units */
    top:40px;                   /* 29 units */
    width:320px;
    height:240px;
    margin:0;
    padding:0;
    border-radius:0;
    background:#fff;
    box-shadow:none;
    overflow:hidden;
    z-index:2;
}
.ti84ce .ti84-screen{
    position:absolute;
    left:0;top:0;width:320px;height:240px;
    min-height:0;
    margin:0;padding:0;
    border:0;border-radius:0;
    background:#fff;
    color:#000;
    font-family:'TI84Screen',ui-monospace,monospace;
    font-size:20px;
    line-height:20px;
    font-weight:normal;
    overflow:hidden;
    user-select:text;
    -webkit-user-select:text;
}
.ti84ce .screen-status-bar{
    position:absolute;
    left:0;top:0;width:320px;height:30px;
    display:block;
    margin:0;padding:0 0 0 2px;
    border:0;
    background:#525552;
    color:#fff;
    font-family:'TI84Status',ui-monospace,monospace;
    font-size:13px;
    line-height:13px;
    white-space:nowrap;
    word-spacing:0;
    overflow:hidden;
}
.ti84ce .status-item{font:inherit;color:#fff;letter-spacing:0;text-transform:none;margin:0;padding:0}
.ti84ce .status-item.active{font:inherit;color:#fff}
.ti84ce .status-battery{
    position:absolute;
    left:303px;top:4px;
    width:14px;height:20px;
    margin:0;
    background:#c5c2c5;
    border-radius:2px;
    font-size:0;
    color:transparent;
}
.ti84ce .status-battery svg{display:none}
.ti84ce .status-battery::before{content:'';position:absolute;left:4px;top:-2px;width:6px;height:2px;background:#c5c2c5}
.ti84ce .status-battery::after{content:'';position:absolute;left:4px;top:3px;width:6px;height:15px;background:#009e00}

.ti84ce .screen-content{
    position:absolute;
    left:0;top:34px;right:0;bottom:0;
    display:flex;
    flex-direction:column;
    font-family:inherit;
    color:#000;
    overflow:hidden;
}
.ti84ce .screen-history{
    flex:0 0 auto;
    min-height:0;
    max-height:none;
    overflow:visible;
    font-size:20px;
    line-height:20px;
    color:#000;
}
.ti84ce .screen-history .history-line,
.ti84ce .screen-history .result-line{
    position:relative;
    min-height:20px;
    margin:0;
    font-size:20px;
    line-height:20px;
    font-weight:normal;
    color:#000;
    white-space:pre-wrap;
    word-break:break-all;
}
.ti84ce .screen-history .history-line{text-align:left;padding:0 8px 0 0}
.ti84ce .screen-history .result-line{text-align:right;padding:0 8px 0 0}
/* dotted divider under each answer, as on the CE home screen */
.ti84ce .screen-history .result-line::after{
    content:'';
    position:absolute;
    left:0;right:0;bottom:-1px;
    height:2px;
    background:repeating-linear-gradient(90deg,transparent 0 2px,#000 2px 4px,transparent 4px 6px);
}
.ti84ce .screen-input{
    flex:0 0 auto;
    min-height:20px;
    margin:0;padding:0 8px 0 0;
    font-size:20px;
    line-height:20px;
    font-weight:normal;
    text-align:left;
    color:#000;
    white-space:pre-wrap;
    word-break:break-all;
}
.ti84ce .calc-cursor{
    display:inline-block;
    width:12px;height:20px;
    margin:0;
    vertical-align:top;
    background:linear-gradient(#000,#000) no-repeat 2px 3px/10px 14px;
    animation:ceBlink 1s steps(1,end) infinite;
    position:relative;
}
.ti84ce.is-2nd .calc-cursor::after,
.ti84ce.is-alpha .calc-cursor::after{
    position:absolute;left:0;top:0;width:12px;height:20px;
    color:#fff;
    text-align:center;
    font:20px/20px 'TI84Screen',ui-monospace,monospace;
}
.ti84ce.is-2nd .calc-cursor::after{content:'\2191'}
.ti84ce.is-alpha .calc-cursor::after{content:'A'}
@keyframes ceBlink{0%{opacity:1}50%{opacity:0}}
.ti84ce .screen-result{
    flex:0 0 auto;
    min-height:0;
    padding:0 8px 0 0;
    font-size:20px;
    line-height:20px;
    text-align:right;
    color:#000;
}
.ti84ce .screen-result:empty{display:none}
.ti84ce .screen-indicators{display:none}

/* no browser scrollbars inside the LCD */
.ti84ce .ti84-screen-bezel *{scrollbar-width:none}
.ti84ce .ti84-screen-bezel *::-webkit-scrollbar{display:none}

/* ---------- on-screen menus (MATH, MODE, VARS ...) ---------- */
.ti84ce .calc-overlay-menu{
    top:30px;
    background:#fff;
    color:#000;
    padding:0;
    font-family:'TI84Screen',ui-monospace,monospace;
    font-size:20px;
    line-height:20px;
}
.ti84ce .calc-overlay-menu .menu-title{
    font:inherit;
    margin:0;padding:0 2px;
    border:0;
    background:#000;
    color:#fff;
}
.ti84ce .calc-overlay-menu .menu-tabs{gap:0;margin:0;background:#fff}
.ti84ce .calc-overlay-menu .menu-tab{
    flex:0 0 auto;
    padding:0 6px;
    font:inherit;
    background:#fff;
    color:#000;
    border:0;
    border-radius:0;
}
.ti84ce .calc-overlay-menu .menu-tab.active{background:#000;color:#fff}
.ti84ce .calc-overlay-menu .menu-tab-content{max-height:none;min-height:0}
.ti84ce .calc-overlay-menu .menu-option{padding:0 2px;font:inherit;color:#000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ti84ce .calc-overlay-menu .menu-option:hover{background:#000;color:#fff}
.ti84ce .calc-overlay-menu .menu-close{
    margin-top:auto;
    padding:0;
    font:inherit;
    text-align:center;
    background:#525552;
    color:#fff;
    border:0;
}
.ti84ce .calc-overlay-menu .menu-close:hover{background:#000}
.ti84ce .mode-setting-row{gap:0 8px;padding:0 2px}
.ti84ce .mode-opt{padding:0 2px;font:inherit;color:#000;border-radius:0}
.ti84ce .mode-opt.selected{background:#000;color:#fff}

/* ---------- graph screen: the whole LCD ---------- */
.ti84ce .graph-screen{
    position:absolute;
    left:0;top:0;width:320px;height:240px;
    margin:0;
    border:0;border-radius:0;
    background:#fff;
    overflow:hidden;
}
.ti84ce #graphCanvas{position:absolute;left:0;top:0;width:320px!important;height:240px!important}
.ti84ce .graph-controls{
    position:absolute;
    right:3px;top:3px;
    gap:3px;
    padding:0;
    background:transparent;
    border:0;
    z-index:4;
}
.ti84ce .graph-controls .btn-graph{
    width:22px;height:22px;
    font-size:.65rem;
    border-radius:3px;
    background:rgba(255,255,255,.85);
    border:1px solid #9a9a9a;
}

/* ---------- small screens: the page script scales the plate to fit ---------- */
@media (max-width:768px){
    .ti84-body.ti84ce{padding:0;border-radius:11px;width:355.862px}
}

/* the History list scrolls inside a sidebar that stays in view (desktop) instead of growing the page */
@media (min-width:769px){
    .calculator-page{align-items:flex-start}
    .calc-sidebar{position:sticky;top:53px;height:calc(100vh - 53px);align-self:flex-start}
}

/* zoom controls sit centred above the calculator, as on the reference */
.calculator-wrapper:has(.ti84ce){flex-direction:column;align-items:center}
.calculator-wrapper:has(.ti84ce) .calc-zoom-controls{position:static;margin:0 auto 12px;align-self:center}

/* ---------- entry line: cursor, templates (MathPrint), history selection ---------- */
.ti84ce .screen-input{height:auto;min-height:20px;overflow:visible}
.ti84ce .ti-cur{background:#000;color:#fff;display:inline-block;min-width:12px;height:20px;vertical-align:top;animation:ceBlink 1s steps(1,end) infinite}
.ti84ce .ti-cur.ti-cur-end{background:#000;color:#000;width:12px}
.ti84ce .ti-sup .ti-cur.ti-cur-end{width:8px;height:13px;min-width:8px}
.ti84ce .ti-cur.ti-cur-ins{background:none;color:#000;box-shadow:inset 0 -3px 0 #000}
.ti84ce .ti-cur.ti-cur-end.ti-cur-ins{background:none}
.ti84ce.is-2nd .ti-cur-end,.ti84ce.is-alpha .ti-cur-end{background:#000}
.ti84ce .ti-sup{font-family:'TI84Status',ui-monospace,monospace;font-size:13px;line-height:13px;position:relative;top:-8px;margin-left:1px}
.ti84ce .ti-rad{display:inline-block;vertical-align:top;white-space:nowrap}
.ti84ce .ti-radsym{display:inline-block;width:10px;overflow:hidden;vertical-align:top}
.ti84ce .ti-radin{display:inline-block;vertical-align:top;border-top:2px solid #000;margin-left:-3px;padding-right:2px;min-width:12px;box-sizing:content-box}
.ti84ce .ti-radidx{font-family:'TI84Status',ui-monospace,monospace;font-size:13px;position:relative;top:-6px;margin-right:-6px}
.ti84ce .screen-history .history-line.ti-tall,.ti84ce .screen-input.ti-tall{padding-top:6px}
.ti84ce .screen-history .history-line.ti-tallrad,.ti84ce .screen-input.ti-tallrad{padding-top:4px}
.ti84ce .ti-sel{background:#000;color:#fff}
.ti84ce .ti-more{display:inline-block;width:12px;height:20px;vertical-align:top;position:relative;font-size:0}
.ti84ce .ti-more::before{content:'';position:absolute;left:2px;top:4px;border-right:8px solid #000;border-top:6px solid transparent;border-bottom:6px solid transparent}

/* ---------- CE error screen: title bar, Quit / Goto, rule, help text ---------- */
.ti84ce .ti-error-screen{position:absolute;left:0;top:30px;right:0;bottom:0;z-index:40;background:#fff;color:#000;padding:4px 0 0;font:20px/20px 'TI84Screen',ui-monospace,monospace}
.ti84ce .ti-err-title{text-align:center;height:20px}
.ti84ce .ti-err-title span{background:#000;color:#fff;padding:0 6px;display:inline-block}
.ti84ce .ti-err-opt{padding:0;cursor:pointer;white-space:nowrap;height:20px}
.ti84ce .ti-err-num{background:#000;color:#fff}
.ti84ce .ti-err-rule{border-top:2px solid #000;margin:3px 0 18px}
.ti84ce .ti-err-help{white-space:normal}
.ti84ce .ti-err-l{white-space:pre;height:20px}
.ti84ce .ti-err-cont{padding-left:24px}

/* ---------- TI menus (MATH ...) and the MODE screen ---------- */
.ti84ce .ti-menu,.ti84ce .ti-mode{position:absolute;left:0;top:30px;width:320px;height:210px;background:#fff;color:#000;z-index:30;display:none;overflow:hidden;white-space:pre}
.ti84ce .ti-menu{font:20px/20px 'TI84Screen',ui-monospace,monospace}
.ti84ce .tm-head{position:absolute;left:0;top:6px;height:20px}
.ti84ce .tm-tab{display:inline-block;height:20px;padding-right:2px;margin-right:-2px}
.ti84ce .tm-tab.sel,.ti84ce .tm-n.sel{background:linear-gradient(#000,#000) no-repeat 0 1px/100% 18px;color:#fff}
.ti84ce .tm-row{position:absolute;left:0;height:20px;white-space:pre}
.ti84ce .tm-n{display:inline-block;height:20px;padding-right:1px;margin-right:-1px}
.ti84ce .ti-mode{font:13px/14px 'TI84Status',ui-monospace,monospace}
.ti84ce .tm-mrow{position:absolute;left:0;width:320px;height:14px}
.ti84ce .tm-mlab{position:absolute;top:0;height:14px;line-height:14px;white-space:pre}
.ti84ce .tm-mlab.blue{color:#000084}
.ti84ce .tm-mopt{position:absolute;top:0;height:14px;box-sizing:border-box;padding:0 2px;line-height:14px;white-space:pre}
.ti84ce .tm-mopt i{font-style:normal;display:block;position:relative;top:1px}
.ti84ce .tm-mopt.sel{background:#000;color:#fff}
.ti84ce .tm-mopt.cur:not(.sel){animation:tmBlink 1s steps(1,end) infinite}
.ti84ce .tm-mopt.cur.sel i{animation:tmBlinkTxt 1s steps(1,end) infinite}
@keyframes tmBlink{0%{background:#000;color:#fff}50%{background:transparent;color:#000}}
@keyframes tmBlinkTxt{0%{background:#000;color:#fff}50%{background:#fff;color:#000}}

/* ---------- fractions (n/d, Un/d), x-th root, empty-slot boxes ---------- */
.ti84ce .ti-frac{display:inline-block;vertical-align:top;height:20px;margin:0 2px;text-align:center}
.ti84ce .ti-fn,.ti84ce .ti-fd{display:block;font-family:'TI84Status',ui-monospace,monospace;font-size:13px;line-height:10px;height:10px;letter-spacing:-1.8px;padding:0 2px;white-space:pre}
.ti84ce .ti-fn{margin:-3px 0 2px}
.ti84ce .ti-fd{margin:2px 0 0;padding-top:2px;height:10px;border-top:2px solid #000;box-sizing:content-box}
.ti84ce .ti-frac .ti-cur.ti-cur-end{width:11px;min-width:11px;height:10px}
.ti84ce .ti-mixed,.ti84ce .ti-fw{display:inline}
.ti84ce .screen-history .history-line.ti-fraclines,.ti84ce .screen-history .result-line.ti-fraclines,.ti84ce .screen-input.ti-fraclines{padding-top:6px;padding-bottom:6px}
.ti84ce .ti-box{display:inline-block;box-sizing:border-box;width:7px;height:10px;border:1px dotted #000;vertical-align:top}
.ti84ce .ti-nd{font-weight:bold;-webkit-text-stroke:.5px #000}

/* ---------- abs bars, matrices, shortcut popups, colour rows ---------- */
.ti84ce .ti-abs{display:inline-block;vertical-align:top;height:20px;box-sizing:border-box;border-left:2px solid #000;border-right:2px solid #000;padding:0 2px;margin:0 1px}
.ti84ce .ti-mat{display:inline-block;vertical-align:top;position:relative;padding:0 8px;margin:0 2px}
.ti84ce .ti-mat::before,.ti84ce .ti-mat::after{content:'';position:absolute;top:2px;bottom:2px;width:5px;border:2px solid #000}
.ti84ce .ti-mat::before{left:0;border-right:0}
.ti84ce .ti-mat::after{right:0;border-left:0}
.ti84ce .ti-mrow{display:block;white-space:nowrap;height:20px}
.ti84ce .ti-mcell{display:inline-block;min-width:24px;height:20px;padding:0 6px;text-align:center}
.ti84ce .ti-pop{position:absolute;left:0;top:0;width:320px;height:240px;z-index:35;display:none;pointer-events:none}
.ti84ce .tp-box{position:absolute;background:#fff;border:2px solid #000;box-sizing:border-box;font:20px/20px 'TI84Screen',ui-monospace,monospace;white-space:pre;pointer-events:auto}
.ti84ce .tp-row{position:absolute;height:20px;right:2px}
.ti84ce .tp-ycell{right:auto;width:54px}
.ti84ce .tp-row.sel .tp-n{background:#000;color:#fff}
.ti84ce .tp-icon{position:absolute;right:4px;top:0;color:#0000ff;font:13px/20px 'TI84Status',ui-monospace,monospace;letter-spacing:-1px}
.ti84ce .tp-tabs{position:absolute;left:2px;top:222px;height:18px;display:flex;overflow:hidden;font:20px/16px 'TI84Screen',ui-monospace,monospace;pointer-events:none}
.ti84ce .tp-tab{display:block;width:63px;height:18px;box-sizing:border-box;border:2px solid #000;border-bottom:0;border-radius:6px 6px 0 0;text-align:center;background:#c5c2c5;margin-right:-2px;overflow:hidden;white-space:pre}
.ti84ce .tp-tab.sel{background:#fff}
.ti84ce .tp-mh,.ti84ce .tp-mr{display:flex;height:20px}
.ti84ce .tp-mh span,.ti84ce .tp-mr span{flex:1;text-align:center;border-left:2px solid #000}
.ti84ce .tp-mh span:first-child,.ti84ce .tp-mr span:first-child{border-left:0}
.ti84ce .tp-mr span.sel,.ti84ce .tp-mok.sel{background:#000;color:#fff}
.ti84ce .tp-mok{height:20px;text-align:center;border-top:2px solid #000}
.ti84ce .tm-color{display:inline-block;width:108px;height:18px;line-height:18px;text-align:center;margin:1px 0 0 2px;border:1px solid #000;vertical-align:top;box-sizing:border-box}

/* ---------- graph screens (Y=, WINDOW, GRAPH, TABLE, FORMAT) ---------- */
.ti84ce .ti-g{position:absolute;left:0;top:30px;width:320px;height:210px;z-index:20;background:#fff;display:none;overflow:hidden;font:20px/20px 'TI84Screen',ui-monospace,monospace;white-space:pre}
.ti84ce .ti-g canvas{position:absolute;left:0;top:0;width:320px;height:210px;image-rendering:pixelated;image-rendering:crisp-edges}
.ti84ce .tg-o{position:absolute;left:0;top:0;width:320px;height:210px}
.ti84ce .tg-t{position:absolute;white-space:pre}
.ti84ce .tg-small{font:13px/13px 'TI84Status',ui-monospace,monospace}
.ti84ce .tg-n{letter-spacing:-1.2px}
.ti84ce .tg-dot{letter-spacing:-3.6px}
.ti84ce .tg-sub{font-size:9px;position:relative;top:3px;margin-left:-1px}
.ti84ce .tg-colored{color:#00f}
.ti84ce .tg-line{position:absolute;left:0;height:20px;white-space:pre}
.ti84ce .tg-yrow{position:absolute;left:0;width:320px;height:20px}
.ti84ce .tg-rule{position:absolute;left:0;width:320px;height:2px;background:repeating-linear-gradient(90deg,#000 0 2px,transparent 2px 6px);background-position:2px 0}
.ti84ce .tg-sw{position:absolute;left:3px;top:4px;width:8px;height:12px}
.ti84ce .tg-st{position:absolute;left:14px;top:3px;width:12px;height:14px;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='14' shape-rendering='crispEdges'><path d='M0 0h3l9 11v3h-3L0 3z' fill='black'/></svg>") no-repeat}
.ti84ce .tg-st.cur{animation:ceBlink 1s steps(1,end) infinite}
.ti84ce .tg-yl{position:absolute;left:26px;top:0;white-space:pre}
.ti84ce .tg-eq{position:absolute;left:50px;top:0;width:12px;text-align:left}
.ti84ce .tg-eq.on{background:linear-gradient(#000,#000) no-repeat 0 3px/10px 14px;color:#fff}
.ti84ce .tg-eq.cur{animation:ceBlink 1s steps(1,end) infinite}
.ti84ce .tg-ex{position:absolute;left:62px;top:0;right:8px;white-space:pre-wrap;word-break:break-all}
.ti84ce .tg-opt{position:absolute;white-space:pre}
.ti84ce .tg-opt.sel{background:#000;color:#fff}
.ti84ce .tg-opt.cur{animation:ceBlink 1s steps(1,end) infinite}
.ti84ce .tg-rule2{position:absolute;left:0;width:320px;height:2px;background:#000}
.ti84ce .tg-vline{position:absolute;top:19px;height:154px;background:#000}
.ti84ce .tg-gr{position:absolute;left:0;width:320px;height:1px;background:#e6e3e6}
.ti84ce .tg-th{position:absolute;top:0;left:0;width:61px;height:17px;line-height:17px;text-align:center;font:20px/17px 'TI84Screen',ui-monospace,monospace;white-space:pre}
.ti84ce .tg-th.x{left:0}
.ti84ce .tg-tcell{position:absolute;height:13px;font:13px/13px 'TI84Status',ui-monospace,monospace;padding-left:7px;box-sizing:border-box;white-space:pre;overflow:hidden}
.ti84ce .tg-tcell.sel{background:#000;color:#fff}
.ti84ce .tg-tx{position:absolute;left:0;top:174px;width:320px;height:36px;background:#fff}
.ti84ce .tg-txt{position:absolute;left:0;top:16px;font:20px/20px 'TI84Screen',ui-monospace,monospace}
.ti84ce .tg-box{display:inline-block;min-width:96px;height:18px;line-height:18px;text-align:center;vertical-align:top;margin-top:1px;border:1px solid #000;box-sizing:border-box;background:#c5c2c5}
.ti84ce .tg-box.axesColor,.ti84ce .tg-box.bg{background:#000;color:#fff}
.ti84ce .tg-box.border{background:#fff;min-width:140px}

.ti84ce .ti-sneg{display:inline-block;width:4px;height:2px;background:#000;margin-right:2px;position:relative;top:-3px;vertical-align:middle}

.ti84ce .tg-status2{position:absolute;left:2px;top:14px;font:13px/13px 'TI84Status',ui-monospace,monospace;color:#fff;white-space:pre;letter-spacing:-.3px}
.ti84ce .tg-valbox{position:absolute;left:0;top:172px;width:320px;height:38px;background:#fff;border-top:2px solid #000;border-bottom:2px solid #000;box-sizing:border-box}
.ti84ce .tg-vb{position:absolute;left:0;top:2px;font:20px/20px 'TI84Screen',ui-monospace,monospace}

.ti84ce .tg-ylp{left:14px}

/* ---------- STAT screens ---------- */
.ti84ce .ts-title{position:absolute;left:0;top:6px;width:320px;height:20px;text-align:center}
.ti84ce .ts-title span{display:inline-block;background:#000;color:#fff;padding:0 4px;height:18px;line-height:18px;margin-top:1px}
.ti84ce .tg-th.hsel{background:#000;color:#fff}

.ti84ce .tm-bracket{position:absolute;width:5px;border:2px solid #000;box-sizing:border-box}
.ti84ce .tm-bracket.l{left:4px;border-right:0}
.ti84ce .tm-bracket.r{border-left:0}

.ti84ce .tg-plotsub{height:20px}
.ti84ce .tg-plotsub span{position:absolute;top:0;font:13px/20px 'TI84Status',ui-monospace,monospace}
.ti84ce .tp-svg{position:absolute;left:12px;top:3px}
.ti84ce .tg-ptype{display:inline-block;width:22px;height:18px;vertical-align:top;margin:1px 0 0 2px;position:relative}
.ti84ce .tg-ptype .tp-svg{left:2px;top:3px}
.ti84ce .tg-ptype.sel{background:#000}
.ti84ce .tg-ptype.sel svg *{stroke:#fff!important;fill:#fff}
.ti84ce .tg-ptype.cur{outline:1px solid #000}

/* graph cursors: idle ring and the blinking free cursor */
.ti84ce .tg-ring{position:absolute;width:7px;height:7px;box-sizing:border-box;border:2px solid #00f;pointer-events:none}
.ti84ce .tg-fc{position:absolute;width:9px;height:9px;pointer-events:none}
.ti84ce .tg-fc i{position:absolute;left:0;top:0;width:9px;height:9px;background-repeat:no-repeat}
.ti84ce .tg-fc .a{animation:fcA .53s steps(1,end) infinite}
.ti84ce .tg-fc .b{animation:fcB .53s steps(1,end) infinite}
@keyframes fcA{0%{opacity:1}50%{opacity:0}}
@keyframes fcB{0%{opacity:0}50%{opacity:1}}

/* TVM Solver: the small square in front of the value that was solved */
.ti84ce .tf-mark{position:absolute;left:2px;width:6px;height:6px;background:#000}

/* STAT TESTS: the colour box on the Color: row */
.ti84ce .tt-color{display:inline-block;width:108px;text-align:center;height:18px;line-height:18px;vertical-align:top;margin-top:1px}
.ti84ce .tt-color.cur{animation:ceBlink 1s steps(1,end) infinite}