:root{color-scheme:light;--bg-main: #f4efe7;--bg-panel: rgba(255, 252, 246, .92);--bg-panel-strong: #fffaf2;--bg-input: rgba(255, 250, 242, .96);--bg-input-focus: #ffffff;--bg-empty: rgba(255, 250, 242, .78);--bg-accent: #d7c1a5;--surface-line: #d5c7b6;--surface-line-strong: #b8a58f;--text-main: #352b23;--text-muted: #6f6254;--shadow-soft: 0 18px 40px rgba(92, 72, 47, .12);--shadow-card: 0 12px 24px rgba(92, 72, 47, .08);--button-main: #7c5f43;--button-main-hover: #694f37;--button-alt: #ebe2d5;--button-alt-hover: #dfd2c0;--button-danger: #c97d63;--button-danger-hover: #b96d53;--outline-focus: #5d442d}[data-theme=dark]{color-scheme:dark;--bg-main: #12100e;--bg-panel: rgba(30, 26, 22, .95);--bg-panel-strong: #221d18;--bg-input: #1a1612;--bg-input-focus: #26211c;--bg-empty: rgba(34, 29, 24, .78);--bg-accent: #3d352c;--surface-line: #3d352c;--surface-line-strong: #5d4d3d;--text-main: #e8e2d8;--text-muted: #9b8d7d;--shadow-soft: 0 18px 40px rgba(0, 0, 0, .6);--shadow-card: 0 12px 24px rgba(0, 0, 0, .4);--button-main: #a67c52;--button-main-hover: #bc8e5f;--button-alt: #2d2620;--button-alt-hover: #3d352c;--outline-focus: #a67c52}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at top left,rgba(217,193,165,.55),transparent 28%),linear-gradient(180deg,#f8f4ed 0%,var(--bg-main) 44%,#ece4d8 100%);color:var(--text-main);font-family:Avenir Next,Trebuchet MS,Segoe UI,sans-serif;transition:background-color .3s ease,color .3s ease}[data-theme=dark] body{background:radial-gradient(circle at top left,rgba(166,124,82,.15),transparent 28%),linear-gradient(180deg,#221d18 0%,var(--bg-main) 44%,#0f0d0b 100%)}.theme-footer{display:flex;justify-content:flex-end;margin-top:32px;padding:0 32px}.theme-toggle{background:var(--button-alt);color:var(--text-main);border:0;border-radius:999px;padding:.5rem 1rem;font-size:.85rem;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:8px;transition:background-color .14s ease,transform .14s ease}.theme-toggle:hover{background:var(--button-alt-hover);transform:translateY(-1px)}h1,h2,h3,p{margin-top:0}button,input,textarea,select{font:inherit}#app{width:100%}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:-100px;left:50%;transform:translate(-50%);background:var(--button-main);color:#fff;padding:12px 24px;z-index:1500;border-radius:0 0 12px 12px;text-decoration:none!important;font-weight:700;transition:top .2s ease;box-shadow:var(--shadow-soft)}.skip-link:focus{top:0;outline:none}.app-shell{max-width:1120px;margin:0 auto;padding:48px 20px 56px}.page-header{margin-bottom:24px;padding:32px;border:1px solid var(--surface-line);border-radius:28px;background:linear-gradient(135deg,var(--bg-panel-strong),var(--bg-panel));box-shadow:var(--shadow-soft);position:relative}.page-header h1{margin-bottom:10px;font-family:Georgia,Times New Roman,serif;font-size:clamp(2.4rem,5vw,4rem);font-weight:700;letter-spacing:-.04em}.page-kicker,.section-label,.entry-label{margin-bottom:10px;color:var(--text-muted);font-size:.78rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase}.page-subtitle{max-width:640px;margin-bottom:0;color:var(--text-muted);font-size:1rem;line-height:1.6}.header-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:8px}.user-info{display:flex;align-items:flex-start;gap:16px}.user-controls{display:flex;flex-direction:column;align-items:flex-end;gap:8px}.user-email{color:var(--text-muted);font-size:.85rem;font-weight:500;margin-bottom:4px}.logout-button,.theme-toggle{background:var(--button-alt);color:var(--text-main);border:0;border-radius:999px;padding:.5rem 1rem;font-size:.85rem;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:8px;transition:background-color .14s ease,transform .14s ease}.logout-button:hover,.theme-toggle:hover{background:var(--button-alt-hover);transform:translateY(-1px)}.theme-toggle{position:absolute;bottom:32px;right:32px}.theme-toggle svg{width:16px;height:16px}.dashboard-layout{display:grid;gap:24px}.coursework-panel,.form-panel,.status-panel,.joke-panel{border:1px solid rgba(184,165,143,.75);border-radius:24px;background:var(--bg-panel);box-shadow:var(--shadow-card);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.coursework-panel,.form-panel,.joke-panel{padding:24px}.form-panel{padding:0;overflow:hidden}.form-container{max-height:0;opacity:0;overflow:hidden;transition:max-height .4s cubic-bezier(.4,0,.2,1),opacity .3s ease,padding .4s ease;padding:0 24px}.form-container.is-open{max-height:1000px;opacity:1;padding:24px}.toggle-form-button{width:100%;padding:16px;border:0;background:transparent;color:var(--button-main);font-weight:700;font-size:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;transition:background-color .14s ease}.toggle-form-button:hover{background-color:#7c5f430d}.toggle-form-button svg{transition:transform .3s ease}.toggle-form-button.is-open svg{transform:rotate(45deg)}.status-panel{padding:28px}.status-panel-error{border-color:#c97d63b3}.status-title{margin-bottom:8px;font-size:1.1rem;font-weight:700}.joke-panel{width:100%}.joke-panel section{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap}.joke-content{flex:1;min-width:280px;display:grid;gap:14px}.spotify-container{flex:0 0 320px;min-width:300px;border-radius:18px;overflow:hidden;line-height:0}.joke-actions{display:flex;align-items:center;gap:12px}.joke-actions button:first-child{min-width:145px;justify-content:center}.mute-button{width:40px;height:40px;border-radius:50%;border:1px solid var(--surface-line);background:transparent;color:var(--text-muted);display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;transition:all .14s ease}.mute-button:hover{background:#7c5f4314;border-color:var(--button-main);color:var(--button-main);transform:scale(1.05)}.mute-button.is-muted{color:var(--button-danger);border-color:var(--button-danger)}.mute-icon{width:20px;height:20px;pointer-events:none;filter:brightness(0) invert(1)}@media(max-width:768px){.joke-panel section{flex-direction:column;align-items:stretch}.spotify-container{flex:1}}.joke-panel h2{margin-bottom:0;font-family:Georgia,Times New Roman,serif;font-size:1.5rem;line-height:1.2}.joke-panel p{margin-bottom:0;color:var(--text-muted);line-height:1.6}.empty-state{padding:20px;border:1px dashed var(--surface-line-strong);border-radius:18px;background:var(--bg-empty)}.section-heading{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid var(--surface-line)}.heading-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end}.search-input{padding:6px 14px;border:1px solid var(--surface-line);border-radius:999px;background:var(--bg-panel-strong);color:var(--text-main);font-size:.85rem;width:200px;transition:all .14s ease}.search-input:focus{outline:none;border-color:var(--button-main);box-shadow:0 0 0 3px #7c5f431a;width:240px}.sort-select{padding:6px 10px;border:1px solid var(--surface-line);border-radius:999px;background:var(--bg-panel-strong);color:var(--text-muted);font-size:.85rem;font-weight:600;cursor:pointer;outline:none;transition:border-color .14s ease}.sort-select:hover,.sort-select:focus{border-color:var(--button-main)}.section-heading h2{margin-bottom:0;font-family:Georgia,Times New Roman,serif;font-size:1.8rem}.section-meta{margin-bottom:3px;color:var(--text-muted);font-size:.95rem}.form-heading{margin-bottom:18px}.coursework-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:24px;align-items:start}.coursework-entry{display:flex;flex-direction:column;height:100%;padding:24px;border:1px solid var(--surface-line);border-radius:20px;background:var(--bg-panel-strong);transition:transform .2s ease,box-shadow .2s ease}.coursework-entry:hover{transform:translateY(-4px);box-shadow:var(--shadow-card)}.entry-header{display:flex;justify-content:space-between;gap:12px;align-items:start;margin-bottom:20px}.entry-header h3{margin-bottom:0;font-size:1.3rem;line-height:1.25}.entry-unit{margin-bottom:0;padding:6px 10px;border:1px solid var(--surface-line);border-radius:999px;background:#d7c1a533;color:var(--text-muted);font-size:.85rem;font-weight:600;white-space:nowrap}.coursework-table{width:100%;border-collapse:collapse;flex-grow:1}.coursework-table tr{border-top:1px solid rgba(213,199,182,.5)}.coursework-table tr:first-child{border-top:none}.coursework-table th,.coursework-table td{padding:10px 0;text-align:left;vertical-align:top;line-height:1.4}.coursework-table th{width:100px;color:var(--text-muted);font-size:.75rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase}.coursework-table td{font-size:.95rem}.entry-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px;padding-top:16px;border-top:1px solid var(--surface-line);align-items:center}.form{display:grid;gap:8px}.form label{margin-top:10px;color:var(--text-muted);font-size:.92rem;font-weight:700}.form input,.form textarea,.form select{width:100%;padding:.8rem .95rem;border:1px solid var(--surface-line);border-radius:12px;background:var(--bg-input);color:var(--text-main);accent-color:var(--button-main);transition:border-color .14s ease,box-shadow .14s ease,background-color .14s ease}.form input[type=date]{cursor:pointer}.form input[type=date]::-webkit-calendar-picker-indicator{cursor:pointer;padding:4px;border-radius:6px;filter:sepia(100%) hue-rotate(340deg) saturate(500%) brightness(40%);transition:background-color .14s ease}.form input[type=date]::-webkit-calendar-picker-indicator:hover{background-color:var(--button-alt)}.form input:focus,.form textarea:focus,.form select:focus{outline:none;border-color:var(--button-main);box-shadow:0 0 0 4px #7c5f4324;background:var(--bg-input-focus)}.form input:focus-visible,.form textarea:focus-visible,.form select:focus-visible,.action-button:focus-visible,.primary-button:focus-visible{outline:3px solid var(--outline-focus);outline-offset:3px;box-shadow:0 0 0 5px #5d442d3d}.form textarea{min-height:120px;resize:vertical}.action-button,.primary-button,.joke-panel button{border:0;border-radius:999px;padding:.72rem 1.4rem;min-height:44px;cursor:pointer;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:.92rem;transition:transform .14s ease,background-color .14s ease,color .14s ease,border-color .14s ease,box-shadow .14s ease}.joke-panel button{justify-self:start}.primary-button,.joke-panel button{background:var(--button-main);color:#fffaf4}.primary-button:hover,.joke-panel button:hover{background:var(--button-main-hover);transform:translateY(-2px);box-shadow:0 4px 12px #7c5f4333}.primary-button:active,.joke-panel button:active{transform:translateY(0)}.secondary-button{background:var(--button-alt);color:var(--text-main)}.secondary-button:hover{background:var(--button-alt-hover);transform:translateY(-2px);box-shadow:0 4px 12px #5c482f1a}.delete-button{background:#c97d631a;color:#c97d63;border:1px solid rgba(201,125,99,.2)}[data-theme=dark] .delete-button{background:#c97d6333;color:#ffb7a0;border-color:#c97d6366}.delete-button:hover{background:var(--button-danger);color:#fff7f3;border-color:var(--button-danger);transform:translateY(-2px);box-shadow:0 4px 12px #c97d6333}.form .primary-button{margin-top:12px;padding:.8rem 2.4rem;width:auto;justify-self:end}.entry-actions .action-button{padding:.5rem 1.2rem;min-height:38px;font-size:.85rem}.joke-panel button:disabled{cursor:wait;opacity:.82}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#352b2366;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:flex-start;justify-content:center;z-index:2000;opacity:0;visibility:hidden;transition:all .3s ease;overflow-y:auto;padding:60px 20px}[data-theme=dark] .modal-overlay{background-color:#0009}.modal-overlay.is-open{opacity:1;visibility:visible}.modal-content{background:var(--bg-panel-strong);padding:32px;border-radius:28px;width:90%;max-width:500px;box-shadow:var(--shadow-soft);position:relative;transform:translateY(20px);transition:transform .3s ease}.modal-overlay.is-open .modal-content{transform:translateY(0)}.modal-close-button{position:absolute;top:20px;right:20px;background:var(--button-alt);border:0;border-radius:50%;width:36px;height:36px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text-main);transition:all .14s ease}.modal-close-button:hover{background:var(--button-alt-hover);transform:scale(1.1)}.add-button-small{background:var(--button-main);color:#fffaf4;border:0;border-radius:999px;padding:6px 16px;font-size:.85rem;font-weight:700;display:flex;align-items:center;gap:8px;cursor:pointer;transition:all .14s ease}.add-button-small:hover{background:var(--button-main-hover);transform:translateY(-1px)}.empty-state-actions{margin-top:16px}.reset-button{background:var(--button-alt);color:var(--text-main);border:0;border-radius:999px;padding:8px 16px;font-size:.9rem;font-weight:700;cursor:pointer;transition:all .14s ease}.reset-button:hover{background:var(--button-alt-hover)}.notification-container{position:fixed;bottom:24px;right:24px;z-index:1000;display:grid;gap:12px;pointer-events:none}.notification{padding:14px 24px;background:var(--button-main);color:#fff;border-radius:999px;box-shadow:var(--shadow-soft);font-weight:700;font-size:.95rem;animation:slide-in .3s ease-out forwards;pointer-events:auto}@keyframes slide-in{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.auth-container{max-width:420px;margin:40px auto;padding:40px;border:1px solid rgba(184,165,143,.75);border-radius:28px;background:var(--bg-panel);box-shadow:var(--shadow-card);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.supabase-auth-button{font-weight:700!important;transition:transform .14s ease!important}.supabase-auth-button:hover{transform:translateY(-1px)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.edit-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:18px}.edit-actions .action-button,.edit-actions .primary-button{height:44px;margin-top:0}.save-button{min-width:132px;margin-top:0;text-align:center}@media(max-width:720px){.app-shell{padding:28px 14px 40px}.page-header,.coursework-panel,.form-panel,.status-panel{padding:18px;border-radius:20px}.section-heading,.entry-header{flex-direction:column;align-items:start}.coursework-table th,.coursework-table td{display:block;width:100%;padding-left:0;padding-right:0}.coursework-table th{padding-bottom:2px}.coursework-table td{padding-top:0;padding-bottom:14px}}@media(max-width:600px){.app-shell{padding:24px 12px 40px;width:100%;max-width:100vw;overflow-x:hidden}.page-header{padding:16px 16px 12px;border-radius:20px;width:100%;margin-bottom:20px;box-sizing:border-box}.header-top{flex-direction:column-reverse;align-items:flex-end;gap:8px;margin-bottom:6px;width:100%}.user-info{width:100%;justify-content:flex-end}.user-controls{align-items:flex-end;text-align:right;width:100%}.user-email{font-size:.8rem;word-break:break-all;max-width:100%;display:block}.logout-button{padding:.4rem .8rem;font-size:.8rem;margin-top:4px}.page-header h1{font-size:clamp(1.5rem,8vw,2.2rem);line-height:1.1;margin-top:12px;margin-bottom:4px}.page-subtitle{font-size:.85rem;line-height:1.3}.theme-toggle{position:absolute!important;top:10px;left:10px;bottom:auto!important;right:auto!important;width:36px;height:36px;border-radius:50%;padding:0!important;justify-content:center!important;overflow:hidden;transition:width .3s cubic-bezier(.4,0,.2,1),border-radius .3s ease;z-index:100}.theme-toggle:hover{width:120px;border-radius:20px;padding:0 12px!important;justify-content:flex-start!important}.theme-toggle-text{display:none}.theme-toggle:hover .theme-toggle-text{display:inline;margin-left:8px;font-size:.75rem}}
