@font-face{font-family:"SF Pro Rounded Local";src:url("./assets/fonts/SF-Pro-Rounded-Semibold.otf") format("opentype");font-weight:600;font-style:normal;font-display:swap}
:root{--bg:#141313;--field:#3c3c3c;--row:#1d1d1d;--line:#383838;--white:#fff;--muted:#7c7c7c}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg)}
body{color:var(--white);font-family:"SF Pro Rounded Local",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
.app-shell{width:min(1241px,calc(125% - 34px));margin:0 auto;padding-top:20px;transform:scale(.8);transform-origin:top center}
.top-nav{height:25px;display:flex;align-items:center;justify-content:center;gap:50px;margin-bottom:25px}
.top-nav a{color:#657070;text-decoration:none;font-size:20px;font-weight:600;line-height:25px;transition:color 150ms ease-out}
.top-nav a:hover{color:#bfc4c4}
.top-nav a.active{color:#fff}
.top-nav a:focus-visible{outline:2px solid #7c7c7c;outline-offset:5px;border-radius:4px}
.hero-image{display:block;width:423px;height:auto;aspect-ratio:1541/1004;object-fit:contain;margin:0 auto 55px}
.entry-panel{display:grid;grid-template-columns:184px 184px 320px 320px 64px 64px;gap:21px;align-items:center;justify-content:space-between;width:100%}
.term-picker{position:relative;width:100%;z-index:4}
.term-select{width:100%;display:flex!important;align-items:center;justify-content:space-between;text-align:left;padding:0 24px!important}
.term-select img{width:24px!important;height:24px!important;flex:0 0 auto}
.term-menu{position:absolute;left:0;bottom:calc(100% + 8px);width:100%;overflow:hidden;border:1px solid var(--line);border-radius:18px;background:var(--row);box-shadow:0 16px 36px rgba(0,0,0,.32);z-index:20}
.term-menu[hidden]{display:none}
.term-menu button{width:100%;height:64px!important;padding:0 24px!important;border:0!important;border-bottom:1px solid #303030!important;border-radius:0!important;background:transparent!important;color:var(--muted);font:600 20px "SF Pro Rounded Local",system-ui,sans-serif!important;text-align:left;cursor:pointer}
.term-menu button:last-child{border-bottom:0!important}
.term-menu button:hover,.term-menu button:focus-visible{background:#292929!important;color:var(--white)}
.term-menu button[aria-selected="true"]{color:var(--white)}
.entry-panel input,.entry-panel button{height:66px;border:1px solid #636363;border-radius:18px;background:var(--field);color:var(--white);font:600 20px "SF Pro Rounded Local",system-ui,sans-serif}
.entry-panel input{padding:0 24px;outline:0}
input::placeholder{color:var(--muted);opacity:1}
input:focus::placeholder{color:transparent;opacity:0}
.entry-panel input.invalid{border-color:#8d5555}
.entry-panel button{padding:0;cursor:pointer;display:grid;place-items:center;outline:0}
.entry-panel button img{width:30px;height:30px}
.entry-panel button:hover{background:#4b4b4b}
.entry-panel button:active{transform:scale(.97)}
input:focus-visible,button:focus-visible{outline:2px solid #7c7c7c;outline-offset:2px}
.entry-panel input:focus-visible,.search-panel input:focus-visible{outline:0}
.search-panel{position:relative;width:100%;margin:43px 0 15px}
.search-panel input{width:100%;height:66px;border:1px solid var(--line);border-radius:18px;background:var(--row);outline:0;color:#fff;padding:0 20px 0 78px;font:600 20px "SF Pro Rounded Local",system-ui,sans-serif;-webkit-appearance:none;appearance:none}
.search-panel input::placeholder{color:#7c7c7c;opacity:1}
.search-panel input::-webkit-search-cancel-button{display:none}
.search-panel img{position:absolute;z-index:1;left:24px;top:18px;width:30px;height:30px;pointer-events:none}
.student-row{height:66px;display:flex;align-items:center;border:1px solid var(--line);border-radius:18px;background:var(--row);overflow:visible;margin-bottom:17px;padding:0 17px 0 24px;font:600 18px "SF Pro Rounded Local",system-ui,sans-serif;cursor:default;transition:border-color .18s ease,background .18s ease}
.student-row:hover{border-color:#4d4d4d;background:#202020}
.student-row.expired{opacity:.2}
.student-info{display:grid;grid-template-columns:100px 100px 194px 200px 91px 38px 91px 60px;column-gap:16px;align-items:center;flex:1 1 auto;min-width:0}
.student-info>div{min-width:0;padding:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.student-field{display:flex;align-items:center;gap:6px}.student-phone{justify-content:flex-end}.student-field .student-value{position:relative;display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.private-value-measure{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;visibility:hidden}.private-value-mask{position:absolute;inset:0;display:block;overflow:visible;text-overflow:clip;white-space:nowrap}.private-character{position:relative;display:inline-block}.private-character-source{display:inline-block;visibility:hidden}.private-character-mask{position:absolute;inset:0;display:grid;place-items:center}.copy-button{width:20px;height:32px;flex:0 0 20px;padding:0;border:0;background:transparent;display:grid;place-items:center;cursor:copy}.copy-button img{width:16px;height:16px;display:block}.copy-button:hover{filter:brightness(1.35)}.copy-button:active{transform:scale(.96)}.copy-button[data-copied]{filter:brightness(1.7)}
.student-code,.student-days,.student-days strong{color:var(--muted);font-size:18px;font-weight:600}
.student-term{color:var(--muted);font-size:18px;font-weight:600;white-space:nowrap}
.student-info .upgrade-picker{position:relative;overflow:visible;width:38px;height:64px}
.student-upgrade{position:relative;display:grid!important;place-items:center;width:38px;height:64px;padding:0;border:0;background:transparent;cursor:pointer}
.student-upgrade img{width:30px;height:30px;display:block}
.student-upgrade:disabled{cursor:default}
.student-upgrade:disabled img{display:none}
.student-upgrade:disabled::before{content:"";width:30px;height:30px;background:#7c7c7c;mask:url('./assets/icons/Upgrade.svg') center/contain no-repeat;-webkit-mask:url('./assets/icons/Upgrade.svg') center/contain no-repeat}
.student-upgrade:not(:disabled):active{transform:scale(.94)}
.upgrade-picker .term-menu{width:184px;left:0}
.entry-panel .term-menu button{color:var(--muted);display:block}
.entry-panel .term-menu button[aria-selected="true"],.entry-panel .term-menu button:hover,.entry-panel .term-menu button:focus-visible{color:var(--white)}
.entry-panel button:focus-visible{outline:2px solid #7c7c7c;outline-offset:2px}
.term-menu button:focus-visible{outline:2px solid #7c7c7c;outline-offset:-3px}
.term-select{min-width:0}
.entry-panel input{width:100%;min-width:0}
.student-error{color:#ac5b5b;font-size:16px;margin:12px 0 0}
.student-row:has(.term-menu:not([hidden])){position:relative;z-index:30}
.masked-star{position:relative;top:2px}
.student-actions{display:flex;align-items:center;gap:8px;margin-left:auto;flex:0 0 auto}
.new-question-dot{width:8px;height:8px;margin-right:4px;border-radius:50%;background:#22d3b6;box-shadow:0 0 0 3px rgba(34,211,182,.08);flex:0 0 auto}
.status-toggle,.delete-button,.note-button{width:38px;height:64px;padding:0;border:0;background:transparent;cursor:pointer;display:grid;place-items:center}
.status-toggle:active,.delete-button:active,.note-button:active{transform:scale(.94)}
.status-toggle img,.delete-button img,.note-button img{width:30px;height:30px;display:block}
.delete-dialog{width:min(410px,calc(100% - 32px));padding:0;border:1px solid #454545;border-radius:18px;background:#1d1d1d;color:var(--white);box-shadow:0 24px 80px rgba(0,0,0,.55);font-family:"SF Pro Rounded Local",system-ui,sans-serif}
.delete-dialog::backdrop{background:rgba(10,10,10,.76);backdrop-filter:blur(6px)}
.delete-dialog-content{padding:30px}
.delete-dialog h2{margin:0;font-size:22px;font-weight:600;letter-spacing:-.01em}
.delete-dialog p{margin:12px 0 28px;color:var(--muted);font-size:16px;line-height:1.45}
.delete-dialog-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.delete-dialog-actions button{height:50px;border-radius:16px;border:1px solid #555;font:600 16px "SF Pro Rounded Local",system-ui,sans-serif;cursor:pointer}
.dialog-cancel{background:#303030;color:#fff}
.dialog-confirm{background:#fff;color:#141313;border-color:#fff!important}
.delete-dialog-actions button:hover{filter:brightness(1.08)}
.delete-dialog-actions button:active{transform:scale(.98)}
@media(max-width:760px){.app-shell{width:calc(125% - 28px);padding-top:32px}.hero-image{width:100%;height:auto;margin-bottom:40px}.entry-panel{grid-template-columns:1fr 1fr;gap:12px}.term-picker{grid-column:1/-1}.entry-panel input:nth-child(4){grid-column:1/-1}.entry-panel button{width:66px}.student-row{height:auto;min-height:66px;padding:12px 14px;font-size:16px}.student-info{gap:18px;flex-wrap:wrap}.student-actions{align-self:stretch}.student-code,.student-term,.student-days,.student-days strong{font-size:16px}}
@media(max-width:760px){.student-info{grid-template-columns:1fr 1fr;flex:1 1 auto;gap:12px 18px}}
@media(max-width:760px){.entry-panel .term-select{width:100%}.student-info{width:100%}.student-row{flex-wrap:wrap}.student-actions{margin-left:auto}.student-upgrade{height:40px}.student-info .upgrade-picker{height:40px}}

/* AI for UI: surfaces + animations. Resting dimensions remain unchanged. */
:root{--ui-ease:cubic-bezier(.215,.61,.355,1);--surface-ring:inset 0 0 0 1px rgb(255 255 255/.12);--surface-ring-hover:inset 0 0 0 1px rgb(255 255 255/.2);--dialog-ring:0 0 0 1px rgb(255 255 255/.14)}
.student-row{border-color:transparent;box-shadow:var(--surface-ring);transition:background-color 150ms ease,box-shadow 150ms ease}
.entry-panel button,.status-toggle,.delete-button,.note-button,.delete-dialog-actions button{transition:transform 150ms var(--ui-ease),background-color 150ms ease,filter 150ms ease}
.entry-panel button:active,.status-toggle:active,.delete-button:active,.note-button:active{transform:scale(.96)}
.delete-dialog{opacity:0;transform:scale(.97);box-shadow:var(--dialog-ring);transition:opacity 200ms var(--ui-ease),transform 200ms var(--ui-ease),display 200ms allow-discrete,overlay 200ms allow-discrete}
.delete-dialog[open]{opacity:1;transform:scale(1)}
.delete-dialog::backdrop{opacity:0;transition:opacity 200ms var(--ui-ease),display 200ms allow-discrete,overlay 200ms allow-discrete}
.delete-dialog[open]::backdrop{opacity:1}
@starting-style{.delete-dialog[open]{opacity:0;transform:scale(.97)}.delete-dialog[open]::backdrop{opacity:0}}
@media(hover:hover) and (pointer:fine){.student-row:hover{border-color:transparent;background:#202020;box-shadow:var(--surface-ring-hover)}.entry-panel button:hover{background:#4b4b4b}.delete-dialog-actions button:hover{filter:brightness(1.08)}}
@media(hover:none),(pointer:coarse){.top-nav a:not(.active):hover{color:#657070}.student-row:hover{border-color:transparent;background:var(--row);box-shadow:var(--surface-ring)}.entry-panel button:hover{background:var(--field)}.delete-dialog-actions button:hover{filter:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}