*{margin:0;padding:0;box-sizing:border-box}body{background:#111;display:flex;justify-content:center;align-items:center;min-height:100vh;font-family:Arial,Helvetica,sans-serif;user-select:none;-webkit-user-select:none}.calculator{font-size:min(2vw,3.19vh);width:99dvw;max-height:97dvh;aspect-ratio:16 / 9;display:flex;flex-direction:column;background:linear-gradient(180deg,#b8b0a0,#a89c8c 5%,#8c8478 50%,#6e685e);border-radius:.6em;box-shadow:0 .3em 1.5em #0009,inset 0 .08em #ffffff26}.display-frame{flex:none;background:linear-gradient(180deg,#777,#999 .15em,#bbb .3em);border-radius:.3em;padding:.2em .3em .25em;margin-bottom:1em}.display-screen{background:linear-gradient(180deg,#c8c4b0,#b8b4a2 40%,#aca894);border-radius:.2em;height:4.2em;position:relative;overflow:hidden}#pointer_div{position:relative;width:100%;height:100%}.display-text{z-index:1;position:absolute;font-weight:700;font-size:1.9em;font-family:sans-serif;left:3%;top:15%}.display-indicator{z-index:1;position:absolute;font-size:.84em;font-family:sans-serif;top:70%}#modifier{left:3%}#pgrm{left:16%}#begin{left:28%}#dmyc{left:38%}.key-row{display:flex;flex:1;padding:0 .15em;margin-bottom:.4em;gap:.1em}.key-row:last-child{margin-bottom:0}.key{flex:1;min-width:0;border:none;border-radius:.3em .3em .25em .25em;cursor:pointer;display:flex;flex-direction:column;margin-right:.28em;padding:0;overflow:visible;position:relative;font-family:Arial,Helvetica,sans-serif;container-type:size;background-color:transparent}.key:last-child{margin-right:0}.key:active{transform:translateY(.07em);filter:brightness(.85)}.key-face{display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;border-radius:.3em .3em 0 0;padding:.1em .15em 0;line-height:1.15}.key-label{font-size:30cqh;font-weight:700}.key-f{font-size:14cqh;font-weight:700;color:#e89030;letter-spacing:.03em;line-height:1}.key-light .key-face .key-f{color:#71400b}.key-pad{flex:none;height:22cqh;font-size:14cqh;font-weight:700;line-height:1.5;text-align:center;letter-spacing:.02em;padding-bottom:4cqh;border-radius:0 0 .5em .5em;transform-origin:top center}.key-dark .key-face{background:linear-gradient(180deg,#4a4540,#3a3530 60%,#302c28);color:#e8e4dc;box-shadow:inset 0 .08em #ffffff14}.key-dark .key-pad{background:linear-gradient(180deg,#47423e,#222);color:#5898c8}.key-light .key-face{background:linear-gradient(180deg,#ccc4b4,#b4ac9c 60%,#a8a090);color:#2a2520;box-shadow:inset 0 .08em #ffffff40}.key-light .key-pad{background:linear-gradient(180deg,#908880,#807870);color:#143b58}.key-orange .key-face{background:linear-gradient(180deg,#e89030,#d07020 60%,#c06018);color:#fff;box-shadow:inset 0 .08em #fff3}.key-orange .key-pad{background:linear-gradient(180deg,#a04810,#903808);color:#fff}.key-blue .key-face{background:linear-gradient(180deg,#4898d0,#3878b0 60%,#2868a0);color:#fff;box-shadow:inset 0 .08em #fff3}.key-blue .key-pad{background:linear-gradient(180deg,#1c4870,#143858);color:#80c0f0}.key-f-mod .key-face{background:linear-gradient(180deg,#4a4540,#3a3530 60%,#302c28);color:#e89030;box-shadow:inset 0 .08em #ffffff14}.key-f-mod .key-pad{background:linear-gradient(180deg,#2a2622,#222)}.key-grid{display:grid;grid-template-columns:repeat(10,1fr);grid-template-rows:1fr 1fr;flex:2;padding:0 .15em;margin-bottom:.4em;gap:.4em .38em}.key-grid .key{margin-right:0}.key-enter{grid-row:1 / 3;grid-column:6}.key-enter .key-label.tiny{font-size:12cqh}.key-enter .key-f{font-size:7cqh}.key-enter .key-pad{height:11cqh;font-size:7cqh;padding-bottom:2cqh}.key-label.small{font-size:22cqh}.key-label.tiny{font-size:19cqh}.key-f-clear{display:block;font-size:.4em;letter-spacing:.08em}.arrow-down{font-size:1.2em}