:root {
    --gpp-ink: #183248;
    --gpp-muted: #526577;
    --gpp-line: #dce5eb;
    --gpp-paper: #f7fafb;
    --gpp-accent: #236d68;
}
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid #287c91 !important; outline-offset: 3px; }
button, input, select, textarea { font: inherit; }
button:not(:disabled), summary { cursor: pointer; }
button:disabled, [aria-disabled="true"] { cursor: wait; opacity: .65; }
.gpp-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.gpp-skip-link { position: fixed; left: 1rem; top: -6rem; z-index: 10000; padding: .8rem 1rem; background: #183248; color: #fff; border-radius: .5rem; }
.gpp-skip-link:focus { top: .75rem; }
.gpp-connection-notice { position: fixed; top: .5rem; left: 50%; transform: translateX(-50%); z-index: 9999; max-width: calc(100% - 2rem); width: max-content; padding: .7rem 1rem; border-radius: .6rem; background: #fff7df; color: #62470c; border: 1px solid #dcc67a; box-shadow: 0 4px 20px #18324818; font-size: .875rem; }
.gpp-label { display: block; font-size: .875rem; font-weight: 600; margin-bottom: .45rem; }
.gpp-input { display: block; width: 100%; min-height: 44px; border: 1px solid var(--gpp-line); border-radius: .65rem; padding: .65rem .85rem; color: var(--gpp-ink); background: #fff; }
.gpp-button { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 44px; padding: .65rem 1rem; border-radius: .7rem; font-size: .875rem; font-weight: 600; text-decoration: none; border: 1px solid transparent; transition: background .15s, border-color .15s; }
.gpp-button-primary { background: var(--gpp-ink); color: #fff; }
.gpp-button-primary:hover { background: #264c67; }
.gpp-button-outline { border-color: var(--gpp-line); background: #fff; color: var(--gpp-ink); }
.gpp-button-outline:hover, .gpp-button-subtle:hover { background: #eaf1f4; border-color: #b7cbd5; }
.gpp-button-subtle { background: transparent; color: var(--gpp-ink); }
.gpp-text-button { min-height: 44px; background: none; border: 0; color: var(--gpp-accent); font-size: .8rem; padding: .35rem; text-decoration: underline; text-underline-offset: 3px; }
.gpp-small { color: var(--gpp-muted); font-size: .8125rem; line-height: 1.65; }
.gpp-eyebrow { text-transform: uppercase; font-size: .65rem; font-weight: 700; letter-spacing: .15em; color: var(--gpp-accent); margin: 0 0 .9rem; }
.workspace-page { margin: 0; min-height: 100vh; color: var(--gpp-ink); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: radial-gradient(ellipse at 70% 0, #e9f4f1 0, transparent 45%), var(--gpp-paper); }
.workspace-header { max-width: 1280px; margin: auto; min-height: 94px; padding: 1rem 2rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; border-bottom: 1px solid var(--gpp-line); }
.workspace-brand { display: flex; align-items: center; gap: .7rem; font-size: 1.1rem; font-weight: 700; letter-spacing: -.025em; text-decoration: none; color: var(--gpp-ink); }
.workspace-brand img { border-radius: 50%; }
.workspace-brand small { display: block; font-weight: 400; font-size: .7rem; color: var(--gpp-muted); letter-spacing: 0; margin-top: .2rem; }
.workspace-nav { display: flex; align-items: center; gap: .25rem; }
.workspace-layout { max-width: 1280px; margin: auto; display: grid; grid-template-columns: 250px minmax(0, 1fr); }
.workspace-sidebar { padding: 2.5rem 1.5rem 2rem 2rem; border-right: 1px solid var(--gpp-line); display: flex; flex-direction: column; gap: .65rem; }
.workspace-sidebar > .gpp-eyebrow { line-height: 1.8; margin-bottom: .3rem; }
.workspace-sidebar > .gpp-small { margin: .25rem 0 1rem; }
.folder-tools { margin-top: .8rem; }
.folder-actions { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .1rem; }
.workspace-note { margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid var(--gpp-line); font-size: .8rem; line-height: 1.7; }
.workspace-note strong { display: block; margin-top: .5rem; }
.workspace-note p { color: var(--gpp-muted); }
.gpp-status-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--gpp-accent); box-shadow: 0 0 0 4px #236d6814; }
.workspace-main { min-width: 0; padding: 2.5rem 2.5rem 4rem; }
.workspace-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1.5rem; }
.workspace-heading h1 { font-size: clamp(1.5rem, 3vw, 2.2rem); line-height: 1.2; font-weight: 600; letter-spacing: -.045em; margin: 0; }
.library-search { display: flex; gap: .6rem; }
.library-search input { min-width: 0; padding-left: 1rem; }
#library-status { min-height: 1.4rem; margin: 1rem 0; }
.library-list { display: grid; gap: .7rem; }
.library-item { background: #ffffffde; border: 1px solid var(--gpp-line); border-radius: .85rem; padding: 1.1rem 1.15rem; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 1rem; transition: border-color .15s, box-shadow .15s; }
.library-item:hover { border-color: #abc7cf; box-shadow: 0 5px 18px #18324808; }
.library-item-link { text-decoration: none; color: var(--gpp-ink); min-width: 0; }
.library-item-title { font-size: .95rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 0 0 .4rem; }
.library-item-preview { font-size: .82rem; color: var(--gpp-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 0; line-height: 1.6; }
.library-item-time { font-size: .7rem; color: var(--gpp-muted); display: block; margin-top: .5rem; }
.library-item-actions { position: relative; }
.library-item-actions summary { list-style: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: .5rem; border: 1px solid var(--gpp-line); font-size: 1.2rem; }
.library-item-actions summary::-webkit-details-marker { display: none; }
.library-item-actions[open] summary { background: #edf4f5; }
.library-action-menu { position: absolute; right: 0; top: calc(100% + .35rem); z-index: 5; width: 235px; max-width: 75vw; background: #fff; padding: .65rem; border: 1px solid var(--gpp-line); border-radius: .7rem; box-shadow: 0 8px 25px #18324820; }
.library-action-menu a, .library-action-menu button { display: block; width: 100%; padding: .7rem .5rem; font-size: .8rem; text-align: left; border: 0; border-radius: .3rem; background: none; color: var(--gpp-ink); text-decoration: none; }
.library-action-menu a:hover, .library-action-menu button:hover { background: var(--gpp-paper); }
.library-action-menu .gpp-label { font-size: .7rem; padding: .2rem .5rem; }
.library-action-menu select { font-size: .8rem; }
.library-action-menu .library-delete { color: #a52e35; }
.library-load-more { display: flex; margin: 1.5rem auto; }
.workspace-empty { text-align: center; padding: 2.5rem 0 1rem; }
.empty-mark { display: inline-grid; place-items: center; width: 52px; height: 52px; background: #e9f3f0; color: var(--gpp-accent); border-radius: 1rem; font-size: 1.7rem; }
.workspace-empty h2 { font-size: 1.35rem; letter-spacing: -.025em; font-weight: 600; margin: 1.25rem 0 .75rem; }
.workspace-empty > p { max-width: 530px; margin: .75rem auto; color: var(--gpp-muted); font-size: .9rem; line-height: 1.7; }
.starter-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .75rem; margin: 2rem 0 1.5rem; }
.starter-card { text-align: left; padding: 1.2rem 1rem; background: #fff; border: 1px solid var(--gpp-line); border-radius: .75rem; color: var(--gpp-ink); transition: border-color .15s, background .15s; }
.starter-card:hover { background: #f2f8f7; border-color: #89b6ae; }
.starter-card strong { display: block; font-size: .85rem; line-height: 1.5; }
.starter-card > span { display: block; font-size: .75rem; color: var(--gpp-muted); line-height: 1.6; margin-top: .65rem; }
body.chat-workspace { height: 100dvh; }
.chat-workspace .chat-topbar { flex-shrink: 0; display: flex; align-items: center; justify-content: space-between; gap: .7rem; padding: .7rem 1rem; background: #fffffff2; border-bottom: 1px solid var(--gpp-line); z-index: 20; }
.chat-topbar-links { display: flex; align-items: center; gap: .35rem; }
.chat-topbar-label { font-size: .8rem; color: var(--gpp-muted); }
.chat-workspace #chat-container { padding-top: 1.5rem; padding-bottom: 1.5rem; scroll-padding-bottom: 2rem; }
.chat-workspace .chat-composer { position: relative; flex-shrink: 0; background: linear-gradient(#f7fafbcc, #fff); padding: .8rem 1rem max(.8rem, env(safe-area-inset-bottom)); border-top: 1px solid var(--gpp-line); }
.chat-workspace #prompt-input { padding: .9rem 1rem; min-height: 80px; max-height: min(32vh, 320px); font-size: 1rem; line-height: 1.5; box-shadow: 0 3px 15px #1832480a; border-color: var(--gpp-line); border-width: 1px; }
.chat-workspace .prompt-actions { position: static !important; display: flex; justify-content: flex-end; flex-wrap: wrap; gap: .45rem; padding: .6rem 0 .1rem; }
.chat-workspace .prompt-actions button, .chat-workspace .prompt-actions label { min-height: 44px; }
.chat-workspace #model-selector-btn { width: 11.5rem; margin-right: auto; }
.chat-workspace .prompt-actions > :first-child { margin-right: auto; }
.chat-workspace .message-menu-btn { min-width: 36px; min-height: 36px; }
.chat-billing-note { margin: 0 auto 1rem; max-width: 64rem; font-size: .75rem; color: var(--gpp-muted); line-height: 1.6; }
.chat-billing-note summary { min-height: 40px; display: list-item; padding: .4rem 0; }
.chat-billing-note p { max-width: 800px; }
.chat-welcome { max-width: 720px; margin: 2rem auto; text-align: center; }
.chat-welcome h1 { margin: .8rem 0; font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 600; letter-spacing: -.035em; }
.chat-welcome > p { color: var(--gpp-muted); font-size: .9rem; }
.composer-hint { display: flex; justify-content: space-between; gap: .7rem; font-size: .7rem; color: var(--gpp-muted); margin-top: .45rem; }
.chat-live-status { min-height: 1.25rem; font-size: .75rem; color: var(--gpp-muted); }
.auth-form label:not([for="terms"]) { display: block; margin-bottom: .4rem; font-size: .875rem; font-weight: 600; }
.auth-form input:not([type="checkbox"]):not([type="hidden"]) { min-height: 44px; font-size: 1rem; }
.auth-form button[type="submit"] { min-height: 44px; }
.auth-form input[type="checkbox"]:focus-visible + span { outline: 3px solid #287c91; outline-offset: 3px; }
.getting-started { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1.5rem; }
.getting-started article { padding: 1.5rem; border-top: 2px solid #b4d3cc; }
.getting-started h3 { margin: .75rem 0; font-size: 1.1rem; }
.getting-started p { color: var(--gpp-muted); line-height: 1.65; font-size: .9rem; }
@media (max-width: 800px) {
    .workspace-layout { grid-template-columns: 200px minmax(0,1fr); }
    .workspace-sidebar { padding: 2rem 1rem; }
    .workspace-main { padding: 2rem 1.25rem; }
    .starter-grid { grid-template-columns: 1fr; }
    .starter-card { padding: 1rem; }
    .starter-card > span { margin-top: .25rem; }
}
@media (max-width: 600px) {
    .workspace-header { min-height: 78px; padding: .8rem 1rem; }
    .workspace-brand { font-size: 1rem; }
    .workspace-nav .gpp-button { padding: .5rem; font-size: .75rem; }
    .workspace-brand img { width: 35px; height: 35px; }
    .workspace-layout { display: block; }
    .workspace-sidebar { display: grid; grid-template-columns: 1fr 1fr; padding: 1.1rem 1rem; border-right: 0; border-bottom: 1px solid var(--gpp-line); }
    .workspace-sidebar > .gpp-eyebrow, .workspace-sidebar > .gpp-small, .workspace-note { display: none; }
    .folder-tools { grid-column: 1 / -1; margin-top: .5rem; }
    .folder-tools .gpp-label { margin-bottom: .35rem; }
    .folder-actions { justify-content: flex-start; gap: .8rem; }
    .workspace-main { padding: 1.8rem 1rem 3rem; }
    .workspace-heading { align-items: flex-start; flex-direction: column; gap: .6rem; }
    .workspace-heading > .gpp-small:empty { display: none; }
    .library-item { padding: .9rem; gap: .6rem; }
    .workspace-empty { padding-top: 1.3rem; }
    .chat-topbar-label { display: none; }
    .chat-workspace .chat-topbar { padding: .5rem .7rem; }
    .chat-topbar .gpp-button { padding: .5rem .7rem; font-size: .75rem; }
    .chat-workspace #chat-container { padding: 1rem; }
    .chat-workspace .chat-composer { padding-left: .75rem; padding-right: .75rem; }
    .chat-workspace #model-selector-btn { width: 10rem; }
    .chat-workspace #voice-setup > span { display: none; }
    .chat-workspace #voice-control { gap: .2rem; padding: 0 .25rem; }
    .chat-workspace #voice-setup { gap: .2rem; }
    .composer-hint > :last-child { display: none; }
    .chat-welcome { margin: 1rem auto; }
    .getting-started { grid-template-columns: 1fr; gap: .5rem; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
