/* The Andalus Academy, Student Toolkit styles (calculator, formula sheets,
   periodic table, converters). Shared by the home page and the lesson room. */
.tk-modal { position: fixed; inset: 0; z-index: 90; display: flex; align-items: flex-start; justify-content: center; padding: 4vh 1rem; background: rgba(11,10,9,.82); backdrop-filter: blur(8px); overflow-y: auto; animation: tkFade .2s ease; }
@keyframes tkFade { from { opacity: 0; } to { opacity: 1; } }
.tk-panel { width: 100%; max-width: 40rem; margin: auto; background: #101D3E; border: 1px solid rgba(127,176,242,.25); border-radius: 1.25rem; box-shadow: 0 30px 90px -20px rgba(0,0,0,.85); animation: tkPop .3s cubic-bezier(.16,1,.3,1); }
.tk-panel.wide { max-width: 66rem; }
@keyframes tkPop { from { opacity: 0; transform: translateY(18px) scale(.96); } to { opacity: 1; transform: none; } }
.tk-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.25rem; border-bottom: 1px solid rgba(201,162,39,.15); }
.tk-head h3 { font-family: "Bodoni Moda", serif; font-size: 1.4rem; color: #F5EFE2; }
.tk-close { display: inline-flex; height: 2.1rem; width: 2.1rem; align-items: center; justify-content: center; border-radius: .6rem; border: 1px solid rgba(201,162,39,.3); color: #E9D38A; cursor: pointer; transition: background .2s; }
.tk-close:hover { background: rgba(201,162,39,.12); }
.tk-body { padding: 1.25rem; }
html.light .tk-panel { background: #FBF7EE; border-color: rgba(201,162,39,.3); }
html.light .tk-head h3 { color: #1F1B16; }

.tk-calc-display { background: rgba(0,0,0,.35); border: 1px solid rgba(201,162,39,.2); border-radius: .8rem; padding: 1rem 1.1rem; text-align: right; margin-bottom: .9rem; }
.tk-calc-expr { min-height: 1.1rem; font-size: .85rem; color: #9DACC9; word-break: break-all; }
.tk-calc-out { font-family: "Bodoni Moda", serif; font-size: 2rem; color: #F5EFE2; word-break: break-all; }
.tk-calc-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: .55rem; }
.tk-key { padding: .9rem 0; border-radius: .7rem; border: 1px solid rgba(201,162,39,.2); background: rgba(255,255,255,.04); color: #F5EFE2; font-size: 1.05rem; cursor: pointer; transition: transform .1s, background .15s, border-color .15s; }
.tk-key:hover { background: rgba(201,162,39,.12); border-color: rgba(201,162,39,.4); }
.tk-key:active { transform: scale(.94); }
.tk-key.op { color: #E9D38A; } .tk-key.fn { color: #9B8CFF; font-size: .85rem; }
.tk-key.eq { background: var(--grad-btn-gold); color: #0A1330; border: none; font-weight: 700; }
html.light .tk-calc-display { background: rgba(255,255,255,.7); } html.light .tk-calc-out { color: #1F1B16; } html.light .tk-key { color: #1F1B16; background: #fff; }
/* ---- scientific (ClassWiz-style) keypad ---- */
.tk-calc-status { display:flex; gap:.7rem; justify-content:flex-end; min-height:.85rem; margin-bottom:.25rem; font-size:.58rem; letter-spacing:.14em; text-transform:uppercase; color:#6f6a5f; }
.tk-calc-status .on { color:#E9D38A; font-weight:600; }
.tk-sci-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:.45rem; }
.tk-skey { padding:.62rem 0; border-radius:.6rem; border:1px solid rgba(201,162,39,.18); background:rgba(255,255,255,.04); color:#F5EFE2; font-size:.95rem; cursor:pointer; transition:transform .08s, background .15s, border-color .15s; min-height:2.65rem; line-height:1; }
.tk-skey:hover { background:rgba(201,162,39,.12); border-color:rgba(201,162,39,.4); }
.tk-skey:active { transform:scale(.93); }
.tk-skey.fn { color:#9B8CFF; font-size:.82rem; }
.tk-skey.op { color:#E9D38A; font-size:1.05rem; }
.tk-skey.util { color:#F2856D; font-size:.78rem; letter-spacing:.04em; }
.tk-skey.eq { background: var(--grad-btn-gold); color:#0A1330; border:none; font-weight:700; font-size:1.1rem; }
.tk-skey.shift-on { background:linear-gradient(120deg,#9B8CFF,#7E6FE0); color:#fff; border-color:transparent; }
.tk-skey .sh { display:block; font-size:.56rem; color:#9B8CFF; line-height:1; margin-bottom:.12rem; min-height:.6rem; }
.tk-skey.span2 { grid-column:span 2; } .tk-skey.span3 { grid-column:span 3; }
html.light .tk-skey { color:#1F1B16; background:#fff; }
html.light .tk-skey.fn { color:#6A45D0; } html.light .tk-skey.op { color:#9A7613; } html.light .tk-skey.util { color:#C0452C; }
html.light .tk-calc-status { color:#9b927f; } html.light .tk-calc-status .on { color:#9A7613; }
/* ---- physical scientific-calculator skin (generic device look; no Casio branding) ---- */
.tk-body.casio { padding: 1rem; }
.casio-shell { background: linear-gradient(160deg,#363b44 0%,#23262d 58%,#191b21 100%); border:1px solid #0d0e12; border-radius:1.3rem; padding:.9rem .85rem 1.1rem; box-shadow: inset 0 1px 0 rgba(255,255,255,.07), inset 0 0 0 1px rgba(255,255,255,.02), 0 22px 48px -24px rgba(0,0,0,.85); }
.casio-brand { display:flex; align-items:center; justify-content:space-between; margin:.1rem .25rem .8rem; }
.casio-solar { display:inline-flex; gap:3px; }
.casio-solar i { width:15px; height:9px; border-radius:1px; background:linear-gradient(#2a2d33,#15171c); border:1px solid #0b0c10; box-shadow:inset 0 1px 0 rgba(255,255,255,.05); }
.casio-name { font-size:.58rem; letter-spacing:.16em; text-transform:uppercase; color:#8b9198; }
.tk-body.casio .tk-calc-display { background:linear-gradient(#bcc6af,#a7b49a); border:1px solid #6c7464; border-radius:.45rem; box-shadow: inset 0 2px 7px rgba(0,0,0,.32), inset 0 0 0 2px rgba(255,255,255,.14); padding:.65rem .8rem .75rem; margin-bottom:.95rem; }
.tk-body.casio .tk-calc-status { color:#46503c; } .tk-body.casio .tk-calc-status .on { color:#1d2616; font-weight:700; }
.tk-body.casio .tk-calc-expr { color:#1a2113; font-family: ui-monospace, "Courier New", monospace; font-size:1.5rem; line-height:1.25; min-height:1.5rem; }
.tk-body.casio .tk-calc-out { color:#3a472f; font-family: ui-monospace, "Courier New", monospace; font-weight:600; letter-spacing:.01em; font-size:1.05rem; line-height:1.2; margin-top:.15rem; }
.tk-body.casio .tk-sci-grid { gap:.4rem; }
.tk-body.casio .tk-skey { background:linear-gradient(#3d434d,#2d323b); color:#ece5d5; border:1px solid #0e0f14; border-radius:.55rem; box-shadow:0 2px 0 #111318, inset 0 1px 0 rgba(255,255,255,.07); font-weight:500; }
.tk-body.casio .tk-skey:hover { background:linear-gradient(#464d58,#343a45); }
.tk-body.casio .tk-skey:active { transform:translateY(2px); box-shadow:0 0 0 #111318, inset 0 1px 3px rgba(0,0,0,.45); }
.tk-body.casio .tk-skey.num { background:linear-gradient(#5b626d,#474d58); color:#fff; }
.tk-body.casio .tk-skey.num:hover { background:linear-gradient(#646b77,#4f5662); }
.tk-body.casio .tk-skey.op { color:#ffd98a; }
.tk-body.casio .tk-skey.util { color:#f0c98a; }
.tk-body.casio .tk-skey.eq { background:linear-gradient(#E8AB42,#C9851E); color:#1c1305; border:1px solid #8f5d12; box-shadow:0 2px 0 #7d5010, inset 0 1px 0 rgba(255,255,255,.25); }
.tk-body.casio .tk-skey.eq:active { box-shadow:0 0 0 #7d5010, inset 0 1px 3px rgba(0,0,0,.3); }
.tk-body.casio .tk-skey .sh { color:#E9A33C; }
.tk-body.casio .tk-skey.shift-on { background:linear-gradient(#E9A33C,#C9821F); color:#1c1305; border-color:#8f5d12; }
.tk-body.casio .tk-skey.shift-on .sh { color:#1c1305; }
/* keep the device dark in light theme too (it's a physical object) */
html.light .tk-body.casio .tk-skey { color:#ece5d5; background:linear-gradient(#3d434d,#2d323b); }
html.light .tk-body.casio .tk-skey.num { color:#fff; background:linear-gradient(#5b626d,#474d58); }
html.light .tk-body.casio .tk-skey.op { color:#ffd98a; } html.light .tk-body.casio .tk-skey.util { color:#f0c98a; }
html.light .tk-body.casio .tk-skey.eq { color:#1c1305; }
html.light .tk-body.casio .tk-calc-out { color:#121707; } html.light .tk-body.casio .tk-calc-expr { color:#39452f; }
html.light .tk-body.casio .tk-calc-status { color:#46503c; } html.light .tk-body.casio .tk-calc-status .on { color:#1d2616; }

.ptable-wrap { overflow-x: auto; padding-bottom: .4rem; }
.ptable { display: grid; grid-template-columns: repeat(18, minmax(30px, 1fr)); gap: 3px; min-width: 620px; }
.pt-el { position: relative; aspect-ratio: 1; border-radius: 4px; border: 1px solid rgba(255,255,255,.08); display: flex; flex-direction: column; align-items: center; justify-content: center; cursor: pointer; padding: 1px; transition: transform .12s, box-shadow .12s; }
.pt-el:hover { transform: scale(1.18); z-index: 3; box-shadow: 0 8px 18px -5px rgba(0,0,0,.7); }
.pt-el .num { font-size: 7px; opacity: .75; line-height: 1; } .pt-el .sym { font-weight: 700; font-size: 12px; line-height: 1.1; color: #fff; }
.pt-c1{background:rgba(242,133,109,.32)} .pt-c2{background:rgba(244,183,64,.30)} .pt-c3{background:rgba(201,162,39,.30)} .pt-c4{background:rgba(91,192,190,.30)} .pt-c5{background:rgba(155,140,255,.30)} .pt-c6{background:rgba(111,168,220,.30)} .pt-c7{background:rgba(94,200,192,.32)} .pt-c8{background:rgba(233,211,138,.30)} .pt-c9{background:rgba(215,155,192,.30)} .pt-c10{background:rgba(217,140,140,.30)} .pt-c0{background:rgba(184,174,156,.25)}
.pt-detail { margin-top: 1rem; border: 1px solid rgba(201,162,39,.2); border-radius: .9rem; padding: 1rem 1.1rem; min-height: 4.5rem; }

.tk-tabs { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.tk-tab { padding: .45rem 1rem; border-radius: .6rem; border: 1px solid rgba(201,162,39,.25); background: rgba(201,162,39,.05); color: #F5EFE2; font-size: .85rem; cursor: pointer; transition: all .2s; }
.tk-tab:hover { background: rgba(201,162,39,.12); }
.tk-tab.active { background: linear-gradient(120deg, #2C6ED5, #4285E4); color: #F2F7FF; border-color: #4285E4; }
.tk-formula { display: flex; justify-content: space-between; gap: 1rem; padding: .6rem .2rem; border-bottom: 1px solid rgba(201,162,39,.1); }
.tk-formula:last-child { border-bottom: 0; }
.tk-formula .lbl { color: #9DACC9; font-size: .85rem; }
/* ---- equation-sheet card layout (physics / trig tools) ---- */
.tk-sheet { display: grid; grid-template-columns: repeat(auto-fill, minmax(248px, 1fr)); gap: .7rem; }
.tk-fcard { border: 1px solid rgba(201,162,39,.16); background: rgba(20,17,15,.45); border-radius: .9rem; padding: .8rem .95rem; }
.tk-fcard h4 { font-size: .64rem; letter-spacing: .12em; text-transform: uppercase; color: #E9D38A; margin-bottom: .35rem; }
.tk-frow { display: flex; justify-content: space-between; align-items: baseline; gap: .8rem; padding: .3rem 0; border-bottom: 1px dashed rgba(201,162,39,.12); }
.tk-frow:last-child { border-bottom: 0; }
.tk-frow .l { font-size: .8rem; color: #9DACC9; }
.tk-frow .e { font-family: "Bodoni Moda", serif; font-size: .98rem; color: #F3E7BE; text-align: right; white-space: nowrap; }
html.light .tk-fcard { background: rgba(255,255,255,.65); border-color: rgba(201,162,39,.22); }
html.light .tk-frow { border-bottom-color: rgba(201,162,39,.18); }
html.light .tk-frow .l { color: #6E6453; } html.light .tk-frow .e { color: #7E6116; }
.tk-formula .eq { color: #F5EFE2; font-family: "Bodoni Moda", serif; font-size: 1rem; text-align: right; }
.tk-section-title { font-size: .72rem; text-transform: uppercase; letter-spacing: .1em; color: #E9D38A; margin: 1rem 0 .3rem; }
html.light .tk-tab { color: #1F1B16; } html.light .tk-formula .eq { color: #1F1B16; } html.light .pt-el .sym { color: #1F1B16; }
.tk-body .field { width: 100%; background: rgba(255,255,255,.04); border: 1px solid rgba(201,162,39,.25); border-radius: .7rem; padding: .6rem .8rem; color: #F5EFE2; font-size: .95rem; transition: border-color .2s; }
.tk-body .field:focus { outline: none; border-color: #C9A227; }
.tk-body .label { display: block; font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: #9DACC9; margin-bottom: .35rem; }
.tk-body select.field option { color: #1F1B16; }
html.light .tk-body .field { background: #fff; color: #1F1B16; }
html.light .tk-body .label { color: #6E6453; }