:root{--color-eager-green: #58cc02;--color-storybook-green: #d7ffb8;--color-spark-blue: #1cb0f6;--color-fresh-leaf: #a5ed6e;--color-night-ink: #000437;--color-paper-white: #ffffff;--color-charcoal: #4b4b4b;--color-pencil-gray: #777777;--color-faded-gray: #afafaf;--color-cardinal: #ff4b4b;--color-green-shade: #46a302;--font-feather: "Nunito", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-duolingo-sans: "Nunito Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--text-caption: 13px;--leading-caption: 1.23;--text-nav-label: 15px;--leading-nav-label: 1.33;--tracking-nav-label: .795px;--text-body: 17px;--leading-body: 1.18;--text-subheading: 19px;--leading-subheading: 1.4;--text-heading-sm: 32px;--leading-heading-sm: 1.2;--text-heading: 48px;--leading-heading: 1.2;--tracking-heading: -.96px;--font-weight-medium: 500;--font-weight-bold: 700;--spacing-8: 8px;--spacing-12: 12px;--spacing-16: 16px;--spacing-24: 24px;--spacing-32: 32px;--spacing-40: 40px;--spacing-48: 48px;--spacing-64: 64px;--spacing-80: 80px;--radius: 12px;--border: 2px solid var(--color-faded-gray);--lift: 0 4px 0 var(--color-faded-gray);--lift-sm: 0 2px 0 var(--color-faded-gray)}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;background:var(--color-paper-white);color:var(--color-charcoal);font-family:var(--font-duolingo-sans);font-size:var(--text-body);font-weight:var(--font-weight-medium);line-height:var(--leading-body)}h1,h2,h3{margin:0;font-family:var(--font-duolingo-sans);font-weight:var(--font-weight-bold);color:var(--color-charcoal)}a{color:var(--color-spark-blue);font-weight:var(--font-weight-bold);text-decoration:none}a:hover{text-decoration:underline}button,input{font:inherit}:focus-visible{outline:2px solid var(--color-spark-blue);outline-offset:2px}.page{max-width:760px;margin:0 auto;padding:var(--spacing-48) var(--spacing-24) var(--spacing-80)}.route-view>.page{padding-top:var(--spacing-80)}.hero h1{font-family:var(--font-feather);font-weight:800;font-size:clamp(var(--text-heading-sm),6vw,var(--text-heading));line-height:var(--leading-heading);letter-spacing:-.02em;color:var(--color-eager-green)}.lede{margin:var(--spacing-16) 0 var(--spacing-32);max-width:480px;color:var(--color-pencil-gray)}.card{background:var(--color-paper-white);border:var(--border);border-radius:var(--radius);box-shadow:var(--lift);padding:var(--spacing-24)}.field label,.tag-label{display:block;margin-bottom:var(--spacing-8);font-weight:var(--font-weight-bold);color:var(--color-charcoal)}.field input,.notes-search input{width:100%;border:var(--border);border-radius:var(--radius);padding:var(--spacing-12) var(--spacing-16);background:var(--color-paper-white);color:var(--color-charcoal)}.field input::placeholder,.notes-search input::placeholder{color:var(--color-faded-gray)}.field input:focus,.notes-search input:focus{border-color:var(--color-spark-blue);outline:none}.field+.field{margin-top:var(--spacing-16)}.toggle{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-12);margin:var(--spacing-24) 0}.toggle button{border:var(--border);border-radius:var(--radius);background:var(--color-paper-white);color:var(--color-pencil-gray);font-size:var(--text-nav-label);font-weight:var(--font-weight-bold);line-height:var(--leading-nav-label);letter-spacing:var(--tracking-nav-label);text-transform:uppercase;padding:var(--spacing-12) var(--spacing-16);cursor:pointer}.toggle button{box-shadow:var(--lift-sm)}.toggle button:hover{color:var(--color-charcoal)}.toggle button:active,.pager button:not(:disabled):active,.trending-chip:not(:disabled):active,.submit:not(:disabled):active{transform:translateY(2px);box-shadow:none}.toggle button.active{background:var(--color-storybook-green);border-color:var(--color-eager-green);color:var(--color-charcoal)}.submit{width:100%;border:0;border-radius:var(--radius);padding:var(--spacing-16);margin-top:var(--spacing-24);background:var(--color-eager-green);box-shadow:0 4px 0 var(--color-green-shade);color:var(--color-paper-white);font-size:var(--text-nav-label);font-weight:var(--font-weight-bold);line-height:var(--leading-nav-label);letter-spacing:var(--tracking-nav-label);text-transform:uppercase;cursor:pointer}.submit:disabled{background:var(--color-faded-gray);box-shadow:none;cursor:not-allowed}.status{margin-top:var(--spacing-16);padding:var(--spacing-12) var(--spacing-16);border:var(--border);border-radius:var(--radius);font-size:var(--text-caption);line-height:var(--leading-caption);font-weight:var(--font-weight-bold)}.status.ok{background:var(--color-storybook-green);border-color:var(--color-eager-green);color:var(--color-charcoal)}.status.error{background:var(--color-paper-white);border-color:var(--color-cardinal);color:var(--color-cardinal)}.auth-switch{margin:var(--spacing-16) 0 0;color:var(--color-pencil-gray);font-size:var(--text-caption);line-height:var(--leading-caption)}.auth-switch button{border:0;background:none;padding:0;color:var(--color-spark-blue);font-size:var(--text-caption);font-weight:var(--font-weight-bold);cursor:pointer}.auth-switch button:hover{text-decoration:underline}.notes-shell{min-height:100vh}.notes-bar{display:flex;align-items:center;gap:var(--spacing-16);padding:var(--spacing-80) var(--spacing-24) var(--spacing-16);border-bottom:var(--border);background:var(--color-paper-white);position:sticky;top:0;z-index:10}.notes-bar h1{flex:0 0 auto;font-size:var(--text-heading-sm);line-height:var(--leading-heading-sm)}.notes-search{flex:1;min-width:10rem;margin-left:auto;max-width:22rem}.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}.pager{display:flex;align-items:center;justify-content:center;gap:var(--spacing-16);margin-top:var(--spacing-32)}.pager p{margin:0;color:var(--color-pencil-gray);font-size:var(--text-caption);font-weight:var(--font-weight-bold)}.pager button,.note-confirm-actions button{border:var(--border);border-radius:var(--radius);background:var(--color-paper-white);box-shadow:var(--lift-sm);color:var(--color-spark-blue);font-size:14px;font-weight:var(--font-weight-bold);padding:var(--spacing-12) var(--spacing-16);cursor:pointer}.pager button:disabled{color:var(--color-faded-gray);box-shadow:none;cursor:default}.floating-nav{position:fixed;top:var(--spacing-16);left:50%;transform:translate(-50%);max-width:calc(100vw - var(--spacing-24));z-index:50}.floating-nav-bar{position:relative;display:flex;align-items:center;height:48px;overflow:hidden;border:var(--border);border-radius:var(--radius);background:var(--color-paper-white);box-shadow:var(--lift-sm)}.floating-nav-bar.collapsed{justify-content:center;cursor:pointer}.floating-nav-mark{flex:0 0 auto;display:flex;padding:0 var(--spacing-8) 0 var(--spacing-16);color:var(--color-eager-green)}.floating-nav-mark svg,.floating-nav-burger svg{width:22px;height:22px}.floating-nav-items{display:flex;align-items:center;gap:4px;padding-right:var(--spacing-12)}.floating-nav-items[aria-hidden=true]{pointer-events:none}.floating-nav-items button{border:0;background:transparent;color:var(--color-pencil-gray);font-size:var(--text-nav-label);font-weight:var(--font-weight-bold);line-height:var(--leading-nav-label);letter-spacing:var(--tracking-nav-label);text-transform:uppercase;white-space:nowrap;padding:var(--spacing-8) var(--spacing-12);border-radius:var(--radius);cursor:pointer}.floating-nav-items button:hover{color:var(--color-charcoal)}.floating-nav-items button.active{background:var(--color-storybook-green);color:var(--color-charcoal)}.floating-nav-burger{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;pointer-events:none;color:var(--color-charcoal)}@media (max-width: 720px){.floating-nav-mark{padding:0 4px 0 var(--spacing-12)}.floating-nav-items{padding-right:var(--spacing-8)}.floating-nav-items button{font-size:var(--text-caption);padding:var(--spacing-8)}}.note-list{display:grid;gap:var(--spacing-16)}.note-card{background:var(--color-paper-white);border:var(--border);border-radius:var(--radius);box-shadow:var(--lift);overflow:hidden}.note-card-top{display:flex;align-items:stretch}.note-card header{flex:1;min-width:0;width:100%;border:0;background:transparent;text-align:left;padding:var(--spacing-16);cursor:pointer}.note-card h2{font-size:var(--text-subheading);line-height:var(--leading-subheading)}.note-card .translation{margin:4px 0 0;color:var(--color-pencil-gray)}.note-delete{flex:0 0 auto;border:0;background:transparent;color:var(--color-faded-gray);cursor:pointer;padding:0 var(--spacing-16);display:flex;align-items:center}.note-delete:hover:not(:disabled){color:var(--color-cardinal)}.note-delete:disabled{color:var(--color-faded-gray);cursor:wait}.note-delete svg{width:20px;height:20px}.note-delete-error{margin:0;padding:0 var(--spacing-16) var(--spacing-12);color:var(--color-cardinal);font-size:var(--text-caption);font-weight:var(--font-weight-bold)}.tag-filter{display:flex;gap:var(--spacing-8);overflow-x:auto;padding:var(--spacing-12) var(--spacing-24);border-bottom:var(--border);background:var(--color-paper-white)}.note-tags,.capture-tags{display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-8)}.note-tags{padding:0 var(--spacing-16) var(--spacing-16)}.tag-chip{display:inline-flex;align-items:center;gap:4px;border:var(--border);border-radius:var(--radius);background:var(--color-paper-white);padding:6px var(--spacing-12);font-size:var(--text-caption);line-height:var(--leading-caption);font-weight:var(--font-weight-bold);color:var(--color-pencil-gray);cursor:pointer;white-space:nowrap}.tag-filter .tag-chip{box-shadow:var(--lift-sm)}.tag-filter .tag-chip:active{transform:translateY(2px);box-shadow:none}.tag-chip.selected,.tag-filter .tag-chip[aria-pressed=true]{background:var(--color-storybook-green);border-color:var(--color-eager-green);color:var(--color-charcoal)}.note-tags .tag-chip,.capture-tags .tag-chip{cursor:default}.note-tags .tag-chip button,.capture-tags .tag-chip button{border:0;background:none;color:var(--color-pencil-gray);cursor:pointer;padding:0 0 0 2px;font-size:var(--text-body);line-height:1}.note-tags .tag-chip button:hover,.capture-tags .tag-chip button:hover{color:var(--color-cardinal)}.tag-add input,.capture-tags input{width:8rem;border:2px dashed var(--color-faded-gray);border-radius:var(--radius);padding:6px var(--spacing-12);background:var(--color-paper-white);color:var(--color-charcoal);font-size:var(--text-caption);font-weight:var(--font-weight-bold)}.tag-add input::placeholder,.capture-tags input::placeholder{color:var(--color-faded-gray)}.tag-add input:focus,.capture-tags input:focus{border-style:solid;border-color:var(--color-spark-blue);outline:none}.note-confirm{border:var(--border);border-radius:var(--radius);box-shadow:var(--lift);padding:var(--spacing-24);background:var(--color-paper-white);color:var(--color-charcoal);width:min(22rem,calc(100% - var(--spacing-32)))}.note-confirm::backdrop{background:#00043759}.note-confirm p{margin:0 0 var(--spacing-24)}.note-confirm-actions{display:flex;justify-content:flex-end;gap:var(--spacing-12)}.note-confirm-actions .note-confirm-remove{border-color:var(--color-night-ink);background:var(--color-night-ink);color:var(--color-paper-white)}.note-confirm-actions button:disabled{opacity:.45;cursor:wait}.note-body{padding:0 var(--spacing-16) var(--spacing-16);border-top:var(--border);color:var(--color-pencil-gray)}.note-body table{width:100%;border-collapse:collapse;margin:var(--spacing-12) 0 var(--spacing-16)}.note-body th,.note-body td{border-bottom:1px solid var(--color-faded-gray);padding:var(--spacing-8);text-align:left}.note-body th{color:var(--color-charcoal)}.empty{color:var(--color-pencil-gray)}.trending{margin-top:var(--spacing-48)}.trending h2{font-size:var(--text-subheading);line-height:var(--leading-subheading);margin-bottom:var(--spacing-16)}.trending-list{display:flex;flex-wrap:wrap;gap:var(--spacing-12)}.trending-chip{display:grid;gap:2px;min-width:9rem;text-align:left;border:var(--border);border-radius:var(--radius);background:var(--color-paper-white);box-shadow:var(--lift-sm);padding:var(--spacing-12) var(--spacing-16);cursor:pointer}.trending-chip:hover:not(:disabled){border-color:var(--color-spark-blue);box-shadow:0 2px 0 var(--color-spark-blue)}.trending-chip:disabled{box-shadow:none;cursor:default}.trending-chip.mine{background:var(--color-storybook-green);border-color:var(--color-eager-green)}.trending-chip strong{color:var(--color-charcoal);font-size:var(--text-subheading);font-weight:var(--font-weight-bold)}.trending-chip .translation{color:var(--color-pencil-gray);font-size:var(--text-caption);line-height:var(--leading-caption)}.trending-chip .learners{color:var(--color-spark-blue);font-size:var(--text-caption);line-height:var(--leading-caption);font-weight:var(--font-weight-bold)}.trending-chip.mine .learners{color:var(--color-charcoal)}