:root{
    --joy:#E8A94B; --calm:#5FA0AC; --neutral:#8B8E9C; --stressed:#C1684A; --sad:#5B6EA6; --angry:#A6435A;
    --ink:#22252F; --paper:#F4F1EF; --paper-edge:#E4DFDA; --sub:#6B6E7A; --line:#D9D3CC; --accent:#C77D3F;
    --display: "Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
    --body: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    --mono: ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace;
  }
  *{box-sizing:border-box;}
  html,body{margin:0;padding:0;}
  html{background:#13161F;}
  body{font-family:var(--body); color:var(--ink); min-height:100vh; overflow-x:hidden; background:var(--sky-a,#3A4A6B); transition:background 1.4s ease;}
  #sky{position:fixed; inset:0; z-index:-2; background:linear-gradient(180deg, var(--sky-a,#3A4A6B) 0%, var(--sky-b,#1F2438) 100%); transition:background 1.6s ease;}
  #status-bar-mask{position:fixed; top:0; left:0; right:0; height:env(safe-area-inset-top); background:var(--sky-a,#3A4A6B); z-index:1000; pointer-events:none; transition:background 1.6s ease;}
  #neural-bg{position:fixed; inset:0; z-index:5; pointer-events:none;}
  #sky::after{content:""; position:absolute; inset:0; background:radial-gradient(ellipse 60% 40% at 50% 0%, rgba(255,255,255,0.10), transparent 60%);}
  .wrap{max-width:720px;margin:0 auto;padding:calc(36px + env(safe-area-inset-top)) 20px 40px;}
  header.top{display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:28px; padding:0 4px; flex-wrap:wrap; gap:12px;}
  .brand{color:#F3EFE4;}
  .brand h1{font-family:var(--display); font-weight:400; font-size:29px; margin:0; letter-spacing:0.3px;}
  .brand p{margin:2px 0 0; font-size:12.5px; color:#F3EFE4; font-family:var(--display); letter-spacing:0.3px;}
  .header-right{display:flex; align-items:center; gap:8px; flex:none;}
  nav.tabs{display:flex; gap:4px; background:rgba(255,255,255,0.08); padding:4px; border-radius:999px;}
  nav.tabs button{border:none; background:transparent; color:#F3EFE4; font-family:var(--display); font-size:13px; padding:8px 16px; border-radius:999px; cursor:pointer; transition:all .2s;}
  nav.tabs button.active{background:#F7F4EC; color:var(--ink); font-weight:600;}
  .signout{background:transparent; border:none; color:#F3EFE4; font-family:var(--display); font-size:11px; cursor:pointer; margin-left:10px; text-decoration:underline;}
  #app header.top{display:none;}
  #app{padding-bottom:calc(120px + env(safe-area-inset-bottom));}
  .card{background:#F4F1EF; border-radius:14px; box-shadow:0 30px 60px -20px rgba(10,12,25,0.45), 0 2px 0 rgba(228,223,218,0.7) inset; padding:30px 30px 26px; position:relative;}
  .card + .card{margin-top:18px;}
  .huey-float{
    position:fixed; bottom:calc(72px + env(safe-area-inset-bottom)); right:20px; z-index:500;
    display:none; align-items:center; justify-content:center;
    pointer-events:none;
  }
  .huey-float.visible{display:flex;}
  .huey-glow{
    position:absolute; width:80px; height:80px; border-radius:50%;
    background:var(--huey-hex, #8B8E9C); filter:blur(18px); opacity:0.45;
    animation:huey-breathe 3.6s ease-in-out infinite;
  }
  .huey-avatar{
    position:relative; width:50px; height:50px; border-radius:50%;
    background:var(--huey-hex, #8B8E9C); display:flex; align-items:center; justify-content:center; cursor:grab;
    box-shadow:0 6px 20px -4px rgba(0,0,0,0.35); transition:background .8s ease;
    animation:huey-breathe 3.6s ease-in-out infinite; pointer-events:auto;
    touch-action:none;
  }
  .huey-avatar:active{ cursor:grabbing; }
  .huey-avatar.huey-jolt{ animation:huey-jolt 0.5s ease; }
  .huey-zzz{
    position:absolute; top:-14px; right:-16px; font-family:var(--mono); font-size:11px;
    color:#8B8E9C; font-weight:600; letter-spacing:1px; animation:huey-zzz-float 2.4s ease-in-out infinite;
  }
  @keyframes huey-zzz-float{ 0%{opacity:0.4; transform:translateY(0);} 50%{opacity:1; transform:translateY(-5px);} 100%{opacity:0.4; transform:translateY(0);} }
  @keyframes huey-breathe{ 0%,100%{transform:scale(1);} 50%{transform:scale(1.07);} }
  @keyframes huey-jolt{
    0%{transform:scale(1) rotate(0);}
    20%{transform:scale(1.28) rotate(-9deg);}
    45%{transform:scale(0.92) rotate(7deg);}
    70%{transform:scale(1.1) rotate(-4deg);}
    100%{transform:scale(1) rotate(0);}
  }
  .huey-bubble{
    position:absolute; bottom:64px; right:0; left:auto;
    background:#22252F; color:#F7F4EC; font-family:var(--body); font-size:12.5px; line-height:1.45;
    padding:9px 13px; border-radius:12px; width:180px; text-align:left;
    opacity:0; pointer-events:none; transition:opacity .3s ease;
  }
  .huey-bubble::after{
    content:""; position:absolute; bottom:-6px; right:18px; left:auto;
    border-left:6px solid transparent; border-right:6px solid transparent; border-top:6px solid #22252F;
  }
  .huey-bubble.visible{opacity:1;}
  .huey-chat-icon{
    position:absolute; top:-8px; right:-8px; width:24px; height:24px; border-radius:50%;
    background:#fff; border:1px solid var(--line); font-size:12px; cursor:pointer;
    pointer-events:auto; box-shadow:0 2px 6px rgba(0,0,0,0.2);
  }
  .huey-chat-panel{
    position:absolute; bottom:64px; right:0; left:auto;
    width:280px; background:var(--paper); border-radius:10px; box-shadow:0 16px 40px -10px rgba(0,0,0,0.4);
    padding:10px; pointer-events:none; opacity:0; transition:opacity .4s ease;
  }
  .huey-chat-close{
    position:absolute; top:6px; right:7px; background:none; border:none;
    font-size:13px; color:var(--sub); cursor:pointer; padding:2px 4px; line-height:1;
    pointer-events:auto;
  }
  .huey-chat-close:hover{ color:var(--ink); }
  .huey-chat-panel.open{opacity:1; pointer-events:auto;}
  .huey-chat-close{
    position:absolute; top:6px; right:7px; background:none; border:none;
    font-size:13px; color:var(--sub); cursor:pointer; padding:2px 4px; line-height:1;
    pointer-events:auto;
  }
  .huey-chat-close:hover{ color:var(--ink); }
  .huey-chat-messages{max-height:160px; overflow-y:auto; display:flex; flex-direction:column; gap:6px; margin-bottom:8px;}
  .huey-chat-msg{font-family:var(--body); font-size:12px; line-height:1.4; padding:6px 9px; border-radius:8px; max-width:85%;}
  .onb-msg{display:flex; align-items:flex-start; gap:10px;}
  .onb-msg .avatar{width:32px; height:32px; border-radius:50%; background:#5FA0AC; flex:none; display:flex; align-items:center; justify-content:center;}
  .onb-msg p{font-size:14.5px; color:var(--ink); margin:0; padding-top:4px; line-height:1.5;}
  .onb-answer{align-self:flex-end; background:var(--ink); color:#F7F4EC; font-family:var(--body); font-size:13.5px; padding:8px 14px; border-radius:999px; max-width:80%; margin-left:auto;}
  .huey-chat-msg.mine{align-self:flex-end; background:var(--ink); color:#F7F4EC;}
  .huey-chat-msg.huey{align-self:flex-start; background:#fff; border:1px solid var(--line); color:var(--ink);}
  .huey-chat-input-row{display:flex; gap:6px;}
  .huey-chat-input-row input{flex:1; border:1px solid var(--line); border-radius:999px; padding:6px 10px; font-size:16px; outline:none;}
  .huey-chat-input-row button{border:none; background:var(--ink); color:#F7F4EC; border-radius:999px; padding:6px 11px; font-size:11px; cursor:pointer; flex:none;}
  .dateline{font-family:var(--mono); font-size:12px; color:var(--sub); letter-spacing:0.5px; text-transform:uppercase; margin-bottom:18px; display:flex; justify-content:space-between; align-items:center;}
  h2.prompt{font-family:var(--display); font-weight:400; font-size:22px; margin:0 0 20px; color:var(--ink);}
  .moods{display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-bottom:22px;}
  .mood-btn{-webkit-appearance:none; appearance:none; border:1.5px solid var(--line); background:#fff; border-radius:999px; padding:8px 12px; font-family:var(--body); font-size:13.5px; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:7px; color:var(--ink); transition:all .15s; width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; -webkit-tap-highlight-color:transparent;}
  .mood-btn .dot{width:9px;height:9px;border-radius:50%;flex:none;}
  .mood-btn.selected{border-color:transparent; color:#fff; box-shadow:0 4px 14px -4px rgba(0,0,0,0.35);}
  .mood-btn:active:not(.selected){background:#e8e2db;}
  .mood-btn-custom{grid-column:1/-1; justify-self:start; margin-top:4px; border-style:dashed;}
  .mood-btn-custom.selected{border-style:solid;}
  textarea{width:100%; min-height:150px; border:none; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:transparent; font-family:var(--display); font-size:17px; line-height:1.6; color:var(--ink); padding:16px 0; resize:vertical; outline:none; scrollbar-color: var(--ink) transparent;}
  .entry-box-wrap{position:relative;}
  .greeting-overlay{
    position:absolute; inset:0; background:var(--paper);
    display:flex; align-items:center; justify-content:center; text-align:center;
    font-family:var(--display); font-size:17px; color:var(--ink); line-height:1.6;
    padding:16px; pointer-events:none; opacity:1; transition:opacity 0.8s ease;
  }
  .greeting-overlay.hidden{opacity:0;}
  textarea::-webkit-scrollbar{width:8px;}
  textarea::-webkit-scrollbar-track{background:transparent;}
  textarea::-webkit-scrollbar-thumb{background-color:var(--ink); border-radius:8px;}
  textarea::placeholder{color:#B7B0A0; font-style:italic;}
  .tagrow{display:flex; flex-wrap:wrap; gap:7px; margin:16px 0;}
  .tag-suggest{border:1px dashed var(--line); background:transparent; border-radius:999px; padding:5px 12px; font-size:12.5px; color:var(--sub); cursor:pointer; font-family:var(--body);}
  .tag-suggest.on{background:var(--ink); color:#fff; border-color:var(--ink);}
  .tag-input{border:none; border-bottom:1px solid var(--line); background:transparent; font-size:13px; padding:5px 2px; font-family:var(--mono); color:var(--ink); outline:none; min-width:120px;}
  .rowbar{display:flex; align-items:center; justify-content:space-between; margin-top:6px;}
  .toggle-wrap{display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--sub); font-family:var(--mono);}
  .switch{position:relative; width:34px; height:19px; background:#D9D2BE; border-radius:999px; cursor:pointer; transition:background .2s;}
  .switch.on{background:var(--ink);}
  .switch::after{content:"";position:absolute; width:15px;height:15px; top:2px;left:2px; background:#fff; border-radius:50%; transition:left .2s;}
  .switch.on::after{left:17px;}
  .save-btn{border:none; background:var(--ink); color:#F7F4EC; padding:11px 22px; border-radius:8px; font-family:var(--body); font-size:13.5px; font-weight:600; cursor:pointer; letter-spacing:0.2px;}
  .save-btn:disabled{opacity:0.5; cursor:default;}
  .save-btn:hover:not(:disabled){opacity:0.9;}
  .reflection{margin-top:18px; padding:18px 20px; border-radius:10px; background:#FBF9F3; border-left:3px solid var(--accent); font-family:var(--display); font-size:15.5px; line-height:1.65; color:#3A3D46;}
  .reflection .label{font-family:var(--mono); font-size:10.5px; text-transform:uppercase; letter-spacing:1px; color:var(--sub); margin-bottom:8px; display:block;}
  .reflection.loading{color:var(--sub); font-style:italic;}
  .reply-thread{margin-top:10px; display:flex; flex-direction:column; gap:8px;}
  .reply-msg{font-family:var(--body); font-size:13.5px; line-height:1.5; padding:8px 12px; border-radius:10px; max-width:88%;}
  .reply-msg-user{align-self:flex-end; background:var(--ink); color:#F7F4EC;}
  .reply-msg-ai{align-self:flex-start; background:#fff; border:1px solid var(--line); color:var(--ink);}
  .reply-box{display:flex; gap:8px; margin-top:10px;}
  .reply-input{flex:1; border:1px solid var(--line); border-radius:999px; padding:8px 14px; font-size:13px; font-family:var(--body); outline:none;}
  .reply-send{border:none; background:var(--ink); color:#F7F4EC; border-radius:999px; padding:8px 16px; font-size:12.5px; font-family:var(--body); cursor:pointer; flex:none;}
  .reply-send:disabled{opacity:0.5;}
  .section-title{font-family:var(--mono); font-size:11.5px; letter-spacing:1.2px; text-transform:uppercase; color:#C9CCDB; margin:34px 0 12px 4px;}
  .entry{padding:16px 0; border-bottom:1px solid var(--line);}
  .folder{border-bottom:1px solid var(--line); padding:14px 0;}
  .folder:last-child{border-bottom:none;}
  .folder-head{display:flex; align-items:center; justify-content:space-between; cursor:pointer;}
  .folder-head .left{display:flex; align-items:center; gap:10px;}
  .folder-dot{width:10px; height:10px; border-radius:50%; flex:none;}
  .folder-title{font-family:var(--display); font-size:15.5px; color:var(--ink);}
  .folder-count{font-family:var(--mono); font-size:11.5px; color:var(--sub);}
  .folder-chevron{font-family:var(--mono); font-size:11px; color:var(--sub); transition:transform .2s;}
  .folder.open .folder-chevron{transform:rotate(90deg);}
  .folder-body{display:none; padding-top:10px;}
  .folder.open .folder-body{display:block;}
  .folder-body .entry:first-child{padding-top:0;}
  .folder-body .entry:last-child{border-bottom:none; padding-bottom:0;}
  .entry:last-child{border-bottom:none;}
  .entry-head{display:flex; align-items:center; justify-content:space-between; cursor:pointer;}
  .entry-head .left{display:flex; align-items:center; gap:10px;}
  .entry-dot{width:10px;height:10px;border-radius:50%;flex:none;}
  .entry-date{font-family:var(--mono); font-size:12px; color:var(--sub);}
  .entry-snippet{font-size:13.5px; color:#555; max-width:340px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .entry-body{display:none; padding-top:12px; font-family:var(--display); font-size:15px; line-height:1.6;}
  .entry.open .entry-body{display:block;}
  .entry-tags{margin-top:10px; display:flex; gap:6px; flex-wrap:wrap;}
  .entry-tags span{font-family:var(--mono); font-size:10.5px; background:#EFEADB; padding:3px 8px; border-radius:999px; color:var(--sub);}
  .delete-entry-btn{margin-top:14px; background:none; border:1px solid #D9C8C5; color:#A05545; font-family:var(--body); font-size:12px; padding:6px 12px; border-radius:6px; cursor:pointer; transition:all .15s;}
  .delete-entry-btn:hover{background:#FBF0EE; border-color:#C07060;}
  /* You tab */
  .you-profile-card{display:flex; align-items:center; gap:20px; padding:22px 26px;}
  .you-avatar{width:54px; height:54px; border-radius:50%; flex:none; display:flex; align-items:center; justify-content:center; font-family:var(--display); font-size:24px; color:#fff; font-weight:400; letter-spacing:0;}
  .you-avatar-wrap{display:flex; flex-direction:column; align-items:center; gap:8px; flex:none;}
  .you-avatar-picker{display:flex; gap:6px; flex-wrap:wrap; justify-content:center;}
  .you-avatar-opt{width:30px; height:30px; border-radius:50%; border:2px solid transparent; background:var(--paper); display:flex; align-items:center; justify-content:center; font-size:15px; cursor:pointer; transition:border-color .15s; padding:0; line-height:1;}
  .you-avatar-opt:hover{border-color:var(--line);}
  .you-avatar-opt.selected{border-color:var(--ink); box-shadow:0 0 0 1px var(--ink);}
  .you-profile-info{flex:1; min-width:0;}
  .you-name-row{display:flex; align-items:center; gap:10px; margin-bottom:5px;}
  .you-name{font-family:var(--display); font-size:20px; font-weight:400; color:var(--ink);}
  .you-name-edit-btn{background:none; border:1px solid var(--line); color:var(--sub); font-size:11px; font-family:var(--mono); padding:3px 9px; border-radius:6px; cursor:pointer; transition:all .15s; white-space:nowrap;}
  .you-name-edit-btn:hover{color:var(--ink); border-color:var(--ink);}
  .you-name-input{font-family:var(--display); font-size:18px; color:var(--ink); border:none; border-bottom:2px solid var(--accent); background:transparent; outline:none; padding:2px 0; width:100%; max-width:200px;}
  .you-meta{margin:2px 0 0; font-size:12px; color:var(--sub); font-family:var(--mono);}
  .you-footer-copy{font-family:var(--mono); font-size:10px; color:#5A5E70; margin:0 0 18px; text-align:center;}
  .you-stats{display:grid; grid-template-columns:repeat(2,1fr); grid-auto-rows:88px; gap:12px; margin-top:18px;}
  .you-stat-card{padding:16px 12px !important; margin-top:0 !important; text-align:center; display:flex; flex-direction:column; align-items:center; justify-content:center; overflow:hidden;}
  .you-stat-val{font-family:var(--display); font-size:28px; font-weight:400; color:var(--ink); line-height:1; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .you-stat-lbl{font-size:11px; color:var(--sub); font-family:var(--mono); margin-top:5px; text-transform:uppercase; letter-spacing:.5px; white-space:nowrap;}
  .you-pref-label{margin:0; font-size:14px; font-weight:600; color:var(--ink);}
  .you-pref-sub{margin:3px 0 0; font-size:12.5px; color:var(--sub);}
  .you-action-card{padding:0; overflow:hidden;}
  .you-action-card .natal-expand-btn{padding:12px 20px;}
  .you-action-row{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px 20px;}
  .you-action-row-sep{border-top:1px solid var(--line);}
  .you-action-desc{margin:0; font-size:13px; color:var(--sub); line-height:1.4;}
  .you-action-btn{flex:none; padding:6px 13px; font-size:13px;}
  .danger-btn{background:#C05A4A; border:none; color:#fff; font-family:var(--body); font-size:13.5px; font-weight:600; padding:11px 22px; border-radius:8px; cursor:pointer; transition:all .2s; white-space:nowrap; letter-spacing:0.2px;}
  .danger-btn:hover{opacity:0.88;}
  .mood-dist-row{display:flex; align-items:center; gap:10px; padding:6px 0;}
  .mood-dist-row+.mood-dist-row{margin-top:2px;}
  .mood-dist-label{font-size:13px; color:var(--ink); width:86px; flex:none;}
  .mood-dist-bar-wrap{flex:1; height:7px; background:var(--line); border-radius:999px; overflow:hidden;}
  .mood-dist-bar{height:100%; border-radius:999px; transition:width .5s ease;}
  .mood-dist-pct{font-family:var(--mono); font-size:11px; color:var(--sub); width:30px; text-align:right; flex:none;}
  .you-about-card{padding:0; overflow:hidden;}
  .you-about-row{padding:14px 24px;}
  .you-about-row+.you-about-row{border-top:1px solid var(--line);}
  .you-about-lbl{margin:0 0 5px; font-size:10.5px; color:var(--sub); font-family:var(--mono); text-transform:uppercase; letter-spacing:.5px;}
  .you-about-val-wrap{display:flex; align-items:center; gap:10px; flex-wrap:wrap;}
  .you-about-val{font-size:14px; color:var(--ink); flex:1; line-height:1.4;}
  .you-about-val.empty-val{color:var(--sub); font-style:italic;}
  .you-about-edit{flex:none;}
  /* Natal chart section */
  .natal-big-three{display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:16px;}
  .natal-planet-tile{display:flex; flex-direction:column; align-items:center; text-align:center; padding:12px 8px; background:var(--paper-edge); border-radius:10px;}
  .natal-planet-label{font-family:var(--mono); font-size:10px; letter-spacing:.8px; text-transform:uppercase; color:var(--sub); margin:0 0 2px;}
  .natal-planet-desc{font-family:var(--body); font-size:9px; color:var(--sub); opacity:.7; margin:0 0 6px; line-height:1.3; letter-spacing:0;}
  .natal-sign-symbol{font-size:20px; line-height:1; margin:0 0 4px; min-height:24px; display:flex; align-items:center; justify-content:center;}
  .natal-sign{font-family:var(--display); font-size:14px; color:var(--ink); margin:0; line-height:1.2; word-break:break-word;}
  .natal-sign-deg{font-size:11px; color:var(--sub); margin:3px 0 0; font-family:var(--mono);}
  .natal-form label{display:block; font-size:11px; color:var(--sub); margin:0 0 5px; font-family:var(--mono); text-transform:uppercase; letter-spacing:.6px;}
  .natal-form-row{margin-bottom:14px;}
  .natal-input{width:100%; padding:9px 12px; border:1px solid var(--line); border-radius:8px; font-size:14px; font-family:var(--body); background:#fff; color:var(--ink); outline:none; box-sizing:border-box; appearance:none; -webkit-appearance:none;}
  .natal-input:focus{border-color:var(--sub);}
  .natal-optional{font-size:11px; color:var(--sub); margin-left:3px; font-family:var(--body); text-transform:none; letter-spacing:0; font-weight:400;}
  .natal-hint{margin:5px 0 0; font-size:11.5px; color:var(--sub); line-height:1.4;}
  .natal-checkbox-row{display:flex; align-items:center; gap:6px; margin-top:7px; font-size:13px; color:var(--sub); cursor:pointer; width:fit-content;}
  .natal-checkbox-row input[type=checkbox]{accent-color:var(--ink); width:14px; height:14px; cursor:pointer;}
  .natal-location-wrap{position:relative;}
  .natal-location-results{position:absolute; top:100%; left:0; right:0; background:var(--paper); border:1px solid var(--line); border-top:none; border-radius:0 0 8px 8px; z-index:20; max-height:200px; overflow-y:auto; display:none; box-shadow:0 8px 20px -4px rgba(0,0,0,.14);}
  .natal-location-result{padding:10px 12px; cursor:pointer; font-size:13px; color:var(--ink); border-bottom:1px solid var(--line); line-height:1.35;}
  .natal-location-result:last-child{border-bottom:none;}
  .natal-location-result:hover{background:var(--paper-edge);}
  .natal-expand-btn{background:none; border:none; color:var(--sub); font-family:var(--mono); font-size:11px; letter-spacing:.5px; cursor:pointer; padding:8px 0 4px; text-align:left; width:100%;}
  .natal-expand-btn:hover{color:var(--ink);}
  .natal-full-chart{margin-bottom:4px;}
  .natal-full-row{display:flex; align-items:baseline; gap:8px; padding:5px 0; border-bottom:1px solid var(--line);}
  .natal-full-row:last-child{border-bottom:none;}
  .natal-full-label{font-family:var(--mono); font-size:11px; letter-spacing:.5px; text-transform:uppercase; color:var(--sub); width:90px; flex-shrink:0;}
  .natal-full-planet-desc{display:block; font-family:var(--body); font-size:9.5px; color:var(--sub); opacity:.7; text-transform:none; letter-spacing:0; margin-top:1px;}
  .natal-full-sign{font-size:14px; color:var(--ink); flex:1;}
  .natal-full-deg{font-family:var(--mono); font-size:11px; color:var(--sub);}
  .natal-edit-row{display:flex; align-items:center; justify-content:space-between; margin-top:12px; padding-top:12px; border-top:1px solid var(--line);}
  .natal-location-label{font-size:12px; color:var(--sub); font-family:var(--mono); margin:0;}
  @media (max-width:480px){
    .you-profile-card{padding:18px 18px;}
    .you-action-row{flex-direction:column; align-items:flex-start; gap:10px;}
    .you-action-btn{align-self:stretch;}
    .you-stats{gap:8px; grid-auto-rows:82px;}
    .you-stat-card{padding:12px 6px !important;}
    .you-stat-val{font-size:20px;}
  }
  .empty{color:var(--sub); font-size:14px; font-style:italic; padding:10px 4px;}
  .pattern-loading{color:var(--sub); font-size:14px; font-style:italic; padding:10px 4px;}
  .loading-dots{display:inline-flex; gap:3px; align-items:center; margin-left:3px; vertical-align:middle;}
  .loading-dots span{display:inline-block; width:3px; height:3px; border-radius:50%; background:var(--sub); animation:dot-seq 1.4s ease-in-out infinite;}
  .loading-dots span:nth-child(2){animation-delay:.18s;}
  .loading-dots span:nth-child(3){animation-delay:.36s;}
  .chart-card{padding:26px 30px 20px;}
  .chart-mode-tabs{display:flex; gap:4px; background:#EFEADB; padding:4px; border-radius:999px; width:fit-content; margin-bottom:16px;}
  .chart-mode-tabs button{border:none; background:transparent; color:var(--sub); font-family:var(--body); font-size:12px; padding:6px 13px; border-radius:999px; cursor:pointer; transition:all .2s;}
  .chart-mode-tabs button.active{background:#fff; color:var(--ink); font-weight:600; box-shadow:0 1px 3px rgba(0,0,0,0.08);}
  .themewords{display:flex; flex-wrap:wrap; gap:10px 16px; align-items:baseline; margin-top:8px;}
  .theme-word{font-family:var(--display); color:var(--ink); line-height:1.3; cursor:default; transition:opacity .2s;}
  .theme-word:hover{opacity:1 !important;}
  .wc{font-family:var(--mono); font-size:9px; color:var(--sub); margin-left:3px; vertical-align:super; font-weight:400;}
  .voice-row{display:flex; align-items:center; gap:10px; margin:2px 0 12px;}
  .mic-btn{border:1px solid var(--line); background:#fff; border-radius:999px; width:40px; height:40px; display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:16px; padding:0; transition:all .2s; flex:none;}
  .mic-btn:hover{border-color:var(--ink);}
  .mic-btn.listening{background:var(--angry); border-color:var(--angry); animation:mic-pulse 1.4s infinite;}
  @keyframes mic-pulse{0%{box-shadow:0 0 0 0 rgba(166,67,90,0.45);}70%{box-shadow:0 0 0 10px rgba(166,67,90,0);}100%{box-shadow:0 0 0 0 rgba(166,67,90,0);}}
  .mic-status{font-family:var(--mono); font-size:11.5px; color:var(--sub);}
  .mic-label{font-family:var(--mono); font-size:11.5px; color:var(--sub); font-style:italic;}
  /* auth gate */
  #auth-gate{max-width:420px; margin:14vh auto 0; text-align:center;}
  #auth-gate .card{text-align:left;}
  #auth-gate input:not([type=checkbox]){width:100%; padding:11px 12px; border:1px solid var(--line); border-radius:8px; font-size:16px; font-family:var(--body); margin:14px 0; outline:none;}
  #auth-gate .save-btn{width:100%;}
  .consent-group{border:1px solid var(--line); border-radius:8px; padding:12px 14px; margin:6px 0 16px; display:flex; flex-direction:column; gap:10px; background:#FDFCF9;}
  .age-check{display:flex; align-items:flex-start; gap:10px; font-size:13px; color:var(--sub); cursor:pointer; margin:0;}
  .age-check input[type=checkbox]{margin-top:2px; flex:none; width:16px; height:16px; cursor:pointer; accent-color:var(--ink);}
  .consent-link{color:var(--ink); text-underline-offset:2px;}
  #auth-msg{font-size:12.5px; color:var(--sub); margin-top:10px; font-family:var(--mono);}
  /* Demo picker sits inside 420px auth-gate — 4 columns never fit; use 3 at all sizes */
  #demo-mood-picker{grid-template-columns:repeat(3,1fr);}
  #demo-mood-picker .mood-btn{font-size:12.5px; padding:7px 8px;}
  #demo-mood-picker .mood-btn .dot{display:none;}
  ::selection{background:var(--accent); color:#fff;}
  /* ─── Splash / loading screen ─── */
  #splash{
    position:fixed; inset:0; z-index:9999;
    background:#1B1F2E;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:0;
    transition:opacity .35s ease;
  }
  #splash.fade-out{ opacity:0; pointer-events:none; }
  #splash.gone{ display:none; }
  .splash-word{
    font-family:var(--display); font-weight:400; font-size:32px;
    color:#F3EFE4; letter-spacing:0.2px;
    animation:splash-in 1s cubic-bezier(.22,.84,.4,1) both;
  }
  .splash-dots{
    display:flex; gap:5px; margin-top:20px;
    animation:splash-in .8s .5s ease both;
  }
  .splash-dot{
    display:inline-block; width:4px; height:4px; border-radius:50%;
    background:#E8A94B;
    animation:dot-seq 1.4s ease-in-out infinite;
  }
  .splash-dot:nth-child(2){ animation-delay:.18s; }
  .splash-dot:nth-child(3){ animation-delay:.36s; }
  @keyframes splash-in{
    from{ opacity:0; transform:translateY(8px); }
    to  { opacity:1; transform:translateY(0); }
  }
  @keyframes dot-seq{
    0%,80%,100%{ opacity:.25; transform:scale(1); }
    40%        { opacity:1;   transform:scale(1.5); }
  }
  /* ─────────────────────────────── */
  #pull-indicator{
    position:fixed; top:0; left:0; right:0; display:flex; justify-content:center;
    padding-top:14px; font-family:var(--mono); font-size:11px; color:#F3EFE4;
    transform:translateY(-60px); transition:transform 0.2s ease; z-index:999; pointer-events:none;
  }
  #pull-indicator.visible{transition:none;}
  #pull-indicator.releasing{transform:translateY(0) !important; transition:transform 0.2s ease;}
  /* ─── Calendar (By day) ─── */
  .cal-header{display:flex; align-items:center; justify-content:space-between; margin-bottom:4px;}
  .cal-title{font-family:var(--display); font-size:16px; font-weight:600; color:var(--ink);}
  .cal-nav{border:none; background:transparent; font-size:22px; color:var(--sub); padding:4px 6px; cursor:pointer; line-height:1; flex:none; border-radius:6px;}
  .cal-nav:disabled{opacity:0.2; cursor:default;}
  .cal-nav:not(:disabled):hover{background:rgba(0,0,0,0.05);}
  .cal-today-row{text-align:center; margin:2px 0 10px;}
  .cal-today-btn{border:1px solid var(--line); background:transparent; border-radius:999px; font-family:var(--mono); font-size:10.5px; letter-spacing:0.5px; text-transform:uppercase; color:var(--sub); padding:3px 14px; cursor:pointer;}
  .cal-today-btn:hover{border-color:var(--ink); color:var(--ink);}
  .cal-grid{display:grid; grid-template-columns:repeat(7,1fr); gap:2px 0; margin-top:10px;}
  .cal-dow{font-family:var(--mono); font-size:10px; text-align:center; color:var(--sub); padding-bottom:8px; letter-spacing:0.3px;}
  .cal-filler{min-height:36px;}
  .cal-day{text-align:center; padding:5px 2px 4px; border-radius:6px; min-height:36px; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; gap:3px;}
  .cal-day-num{font-family:var(--mono); font-size:13px; color:#B0B3BC; line-height:1.2;}
  .cal-day.has-entries .cal-day-num{color:var(--ink); font-weight:600;}
  .cal-day.has-entries{cursor:pointer;}
  .cal-day.has-entries:hover{background:rgba(0,0,0,0.04);}
  .cal-dot{display:block; background:var(--accent); border-radius:999px; color:#fff; font-family:var(--mono); font-weight:700;}
  .cal-dot:empty{width:4px; height:4px;}
  .cal-dot:not(:empty){font-size:8px; line-height:1; padding:1px 4px; min-width:14px; text-align:center;}
  .cal-day:not(.has-entries) .cal-dot{display:none;}
  .cal-day.selected{background:var(--ink);}
  .cal-day.selected .cal-day-num{color:#F7F4EC;}
  .cal-day.selected .cal-dot{background:rgba(255,255,255,0.35);}
  .cal-day.today:not(.selected) .cal-day-num{color:var(--accent); font-weight:700;}
  .cal-selected-entries{margin-top:18px; padding-top:14px; border-top:1px solid var(--line);}
  .cal-selected-title{font-family:var(--mono); font-size:10.5px; letter-spacing:0.8px; text-transform:uppercase; color:var(--sub); margin-bottom:8px;}
  .mood-history-entries{margin-top:0;}
  .mood-history-date{font-family:var(--mono); font-size:10.5px; letter-spacing:0.8px; text-transform:uppercase; color:var(--sub); margin:16px 0 6px; padding-top:16px; border-top:1px solid var(--line);}
  .mood-history-date:first-child{margin-top:0; padding-top:0; border-top:none;}
  @media (max-width:600px){
    .wrap{padding:calc(24px + env(safe-area-inset-top)) 14px 40px;}
    .card{padding:20px 16px 18px;}
    .you-stats{grid-auto-rows:82px;}
    .you-stat-card{padding:12px 6px !important;}
    .you-stat-val{font-size:20px;}
    .entry-snippet{max-width:120px;}
    .brand h1{font-size:24px;}
    header.top{flex-wrap:nowrap; align-items:center;}
    .brand{flex:1; min-width:0;}
    nav.tabs{flex:none;}
    nav.tabs button{padding:7px 10px; font-size:12px;}
    .moods{grid-template-columns:repeat(3,1fr); gap:5px;}
    .mood-btn{font-size:12.5px; padding:7px 8px;}
    .mood-btn .dot{display:none;}
    .mood-btn-custom{margin-top:3px;}
    h2.prompt{font-size:19px;}
    textarea{font-size:16px;}
    .rowbar{flex-wrap:wrap; gap:12px;}
    .save-btn{width:100%;}
    #auth-gate{margin-top:6vh;}
    #auth-gate input:not([type=checkbox]){margin:10px 0;}
  }
  .footer-links{text-align:center; font-family:var(--mono); font-size:11px; color:#8B8E9C; margin:34px 0 10px;}
  .footer-link{color:#F3EFE4;}
  .site-footer{background:#13161F; border-top:1px solid #252938; padding:28px 20px 0;}
  .site-footer .footer-cols{padding-bottom:20px;}
  .footer-cols{display:grid; grid-template-columns:repeat(3,1fr); gap:20px 24px; font-family:var(--mono); font-size:11px; max-width:400px; margin:0 auto;}
  .footer-col{display:flex; flex-direction:column; gap:7px;}
  .footer-col-title{margin:0 0 2px; font-size:10px; letter-spacing:1.2px; text-transform:uppercase; color:#5A5E70;}
  .footer-col .footer-link, .footer-col a{color:#C9CCDB; text-decoration:none;}
  .footer-col .footer-link:hover, .footer-col a:hover{color:#F3EFE4;}

/* ─── You / Account area ─── */
.you-profile-card{display:flex; flex-direction:column; align-items:center; gap:8px; padding-top:32px; padding-bottom:28px;}
.you-avatar{
  width:80px; height:80px; border-radius:50%; background:var(--ink); color:#F7F4EC;
  font-family:var(--display); font-size:32px; font-weight:600; letter-spacing:0.5px;
  display:flex; align-items:center; justify-content:center; flex:none;
  cursor:pointer; transition:transform .15s, box-shadow .15s;
  box-shadow:0 0 0 3px var(--paper), 0 0 0 5px var(--ink);
}
.you-avatar:hover{transform:scale(1.04);}
.you-avatar-hint{font-family:var(--mono); font-size:10.5px; color:var(--sub); margin:2px 0 6px; letter-spacing:0.5px;}
.you-name{font-family:var(--display); font-size:20px; color:var(--ink); font-weight:500; text-align:center; margin:4px 0 0;}
.you-email{font-family:var(--mono); font-size:12px; color:var(--sub); text-align:center; word-break:break-all;}
.you-edit-btn{
  border:1px solid var(--line); background:transparent; color:var(--ink);
  font-family:var(--body); font-size:12.5px; padding:6px 16px; border-radius:999px;
  cursor:pointer; margin-top:4px; transition:all .15s;
}
.you-edit-btn:hover{border-color:var(--ink);}
.you-edit-form{width:100%; max-width:280px; display:flex; flex-direction:column; gap:10px; margin-top:4px;}
.you-edit-form input{
  width:100%; padding:10px 12px; border:1px solid var(--line); border-radius:8px;
  font-size:16px; font-family:var(--body); outline:none; text-align:center;
}
.you-edit-form input:focus{border-color:var(--ink);}
.you-edit-btns{display:flex; gap:8px; justify-content:center;}
.you-edit-save{
  border:none; background:var(--ink); color:#F7F4EC;
  font-family:var(--body); font-size:13px; font-weight:600;
  padding:9px 20px; border-radius:8px; cursor:pointer;
}
.you-edit-save:hover{opacity:0.88;}
.you-edit-cancel{
  border:1px solid var(--line); background:transparent; color:var(--sub);
  font-family:var(--body); font-size:13px;
  padding:9px 16px; border-radius:8px; cursor:pointer;
}
.you-edit-cancel:hover{border-color:var(--sub);}
.you-list-card{padding:0 30px;}
.you-row{
  display:flex; align-items:center; justify-content:space-between;
  padding:15px 0; border-bottom:1px solid var(--line);
  text-decoration:none; color:var(--ink); cursor:pointer;
}
.you-row:last-child{border-bottom:none;}
.you-row-label{font-family:var(--body); font-size:14.5px; color:var(--ink);}
.you-chevron{font-family:var(--mono); font-size:16px; color:var(--sub); line-height:1;}
.you-sub{font-family:var(--mono); font-size:11px; color:var(--sub);}
.you-row-control{cursor:default;}
.you-row-disabled{cursor:default; opacity:0.55;}
.you-row-disabled .you-row-label{color:var(--sub);}
.you-row-info{cursor:default;}
.you-row-info .you-row-label{color:var(--ink);}
.you-ai-explain{
  padding:14px 0 16px;
  border-bottom:1px solid var(--line);
}
.you-ai-explain p{
  font-family:var(--body); font-size:13px; color:var(--sub);
  line-height:1.55; margin:0 0 10px;
}
.you-ai-explain p:last-child{margin-bottom:0;}
.you-row-danger .you-row-label{color:#c0392b;}
.you-confirm-zone{padding:12px 0 16px; border-bottom:1px solid var(--line);}
.you-confirm-msg{font-family:var(--body); font-size:13.5px; color:var(--ink); margin:0 0 12px; line-height:1.5;}
.you-confirm-danger{font-family:var(--body); font-size:12.5px; color:#c0392b; margin:0 0 14px; line-height:1.4;}
.you-confirm-btns{display:flex; gap:10px; flex-wrap:wrap;}
.you-confirm-cancel{
  padding:8px 18px; border-radius:8px; border:1px solid var(--line);
  background:transparent; font-family:var(--body); font-size:13px; color:var(--ink);
  cursor:pointer;
}
.you-confirm-cancel:hover{border-color:var(--ink);}
.you-confirm-destructive{
  padding:8px 18px; border-radius:8px; border:none;
  background:#c0392b; font-family:var(--body); font-size:13px; color:#fff;
  cursor:pointer;
}
.you-confirm-destructive:hover{background:#a93226;}

/* Search */
.search-card{padding:14px 20px 10px;}
.search-row{display:flex; align-items:center; gap:8px;}
.search-row input[type=search]{
  flex:1; padding:9px 12px; border:1px solid var(--line); border-radius:8px;
  font-size:14px; font-family:var(--body); background:var(--paper); color:var(--ink);
  outline:none; -webkit-appearance:none;
}
.search-row input[type=search]:focus{border-color:var(--ink);}
.search-clear{
  padding:6px 10px; border:1px solid var(--line); border-radius:8px;
  background:transparent; font-size:12px; color:var(--sub); cursor:pointer;
  flex:none;
}
.search-clear:hover{border-color:var(--ink); color:var(--ink);}
.search-mood-row{display:flex; gap:6px; flex-wrap:wrap; margin-top:10px;}
.search-mood-btn{
  padding:5px 12px; border-radius:20px; border:1px solid var(--line);
  background:transparent; font-size:12px; font-family:var(--mono); color:var(--sub);
  cursor:pointer; transition:background 0.15s, color 0.15s;
}
.search-mood-btn.active{background:var(--ink); color:var(--paper); border-color:var(--ink);}
.search-mood-dot{display:inline-block; width:8px; height:8px; border-radius:50%; flex:none; margin-right:4px; vertical-align:middle;}
#search-results{padding:0 0 8px;}
#search-results .section-title{padding-top:10px;}

/* Entry delete */
.entry-delete-row{
  margin-top:10px; padding-top:8px; border-top:1px solid var(--line);
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
}
.entry-delete-btn{
  padding:5px 12px; border:1px solid var(--line); border-radius:6px;
  background:transparent; font-size:12px; font-family:var(--mono); color:var(--sub);
  cursor:pointer;
}
.entry-delete-btn:hover{border-color:#c0392b; color:#c0392b;}
.entry-delete-confirm{
  display:inline-flex; align-items:center; gap:8px;
  font-size:12px; font-family:var(--body); color:var(--ink);
}
.entry-delete-yes{
  padding:4px 10px; border:none; border-radius:5px;
  background:#c0392b; color:#fff; font-size:12px; cursor:pointer;
}
.entry-delete-yes:hover{background:#a93226;}
.entry-delete-no{
  padding:4px 10px; border:1px solid var(--line); border-radius:5px;
  background:transparent; font-size:12px; cursor:pointer; color:var(--sub);
}
.entry-delete-no:hover{border-color:var(--ink);}

@media (max-width:600px){
  /* On mobile the bottom nav is fixed; give footer-cols enough bottom room */
  .site-footer .footer-cols{padding-bottom:calc(80px + env(safe-area-inset-bottom));}
  .you-list-card{padding:0 16px;}
  .search-card{padding:12px 14px 8px;}
}

/* ─── Confirm dialog ─── */
.confirm-overlay{
  position:fixed; inset:0; z-index:2000;
  background:rgba(0,0,0,0.55);
  display:flex; align-items:center; justify-content:center;
  padding:24px;
}
.confirm-card{
  background:var(--paper); border-radius:18px;
  padding:26px 22px 20px; max-width:300px; width:100%;
  box-shadow:0 24px 60px -10px rgba(0,0,0,0.55);
}
.confirm-msg{
  font-family:var(--body); font-size:15px; color:var(--ink);
  line-height:1.5; margin:0 0 22px; text-align:center;
}
.confirm-btns{display:flex; gap:10px;}
.confirm-cancel-btn{
  flex:1; border:1px solid var(--line); background:transparent;
  color:var(--ink); font-family:var(--body); font-size:14px;
  padding:12px; border-radius:10px; cursor:pointer;
}
.confirm-ok-btn{
  flex:1; border:none; background:#B53030;
  color:#fff; font-family:var(--body); font-size:14px; font-weight:500;
  padding:12px; border-radius:10px; cursor:pointer;
}
.confirm-cancel-btn:active{opacity:0.7;}
.confirm-ok-btn:active{opacity:0.8;}

/* ─── Bottom nav ─── */
.bottom-nav{
  position:fixed; bottom:0; left:0; right:0; z-index:300;
  display:none;
  grid-template-columns:repeat(5,1fr);
  background:#1A1E2F;
  border-top:1px solid rgba(255,255,255,0.07);
  padding-bottom:env(safe-area-inset-bottom);
  box-shadow:0 -4px 20px -4px rgba(0,0,0,0.4);
}
.bottom-nav.visible{display:grid;}
.bnav-btn{
  border:none; background:transparent; color:rgba(243,239,228,0.4);
  display:flex; flex-direction:column; align-items:center; justify-content:flex-start;
  gap:4px; padding:12px 4px 6px;
  cursor:pointer; font-family:var(--body); font-size:10px; letter-spacing:0.2px;
  transition:color .15s; -webkit-tap-highlight-color:transparent;
}
.bnav-btn.active{color:#F3EFE4;}
.bnav-btn svg{width:24px; height:24px; stroke-width:1.6; fill:none; stroke:currentColor;}
.bnav-plus-circle{
  width:46px; height:46px; border-radius:50%;
  background:var(--paper); color:var(--ink);
  display:flex; align-items:center; justify-content:center;
  font-size:28px; font-weight:300; line-height:1;
  box-shadow:0 4px 16px -4px rgba(0,0,0,0.5);
  margin-top:-8px;
}

/* ─── Write view back bar ─── */
.write-back-bar{padding:10px 0 4px;}
.write-back-btn{
  border:none; background:transparent; color:rgba(243,239,228,0.6);
  font-family:var(--body); font-size:14px; padding:4px 0;
  cursor:pointer; -webkit-tap-highlight-color:transparent;
}
.write-back-btn:hover{color:#F3EFE4;}

/* ─── Home view ─── */
.home-hero{padding:28px 0 6px;}
.home-time-label{font-family:var(--display); font-size:20px; color:rgba(243,239,228,0.55); margin:0 0 4px; font-style:italic;}
.home-hero-name-row{display:flex; align-items:center; gap:12px; margin-bottom:2px;}
.home-hero-avatar{width:42px; height:42px; border-radius:50%; background:var(--ink); color:#F7F4EC; font-size:18px; display:flex; align-items:center; justify-content:center; flex:none; font-family:var(--display); font-weight:600; letter-spacing:0; border:2px solid rgba(255,255,255,0.15);}
.home-name{font-family:var(--display); font-size:30px; font-weight:400; color:#F3EFE4; margin:0;}
.home-how{font-family:var(--body); font-size:16px; color:rgba(243,239,228,0.55); margin:6px 0 28px;}
.home-week-row{display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin-bottom:4px;}
.home-week-card{
  background:#F4F1EF;
  border-radius:14px;
  box-shadow:0 30px 60px -20px rgba(10,12,25,0.45), 0 2px 0 rgba(228,223,218,0.7) inset;
  padding:16px 12px 14px;
  display:flex; flex-direction:column; gap:4px;
}
.home-week-icon{font-size:20px; line-height:1; margin-bottom:4px;}
.home-week-val{font-family:var(--display); font-size:26px; font-weight:400; color:var(--ink); line-height:1;}
.home-week-lbl{font-family:var(--mono); font-size:9.5px; color:var(--sub); text-transform:uppercase; letter-spacing:0.5px; margin-top:auto;}
.home-start-btn{
  width:100%; margin-top:12px; padding:14px;
  border:none; border-radius:12px; background:#F4F1EF; color:var(--ink);
  font-family:var(--body); font-size:15px; font-weight:600;
  cursor:pointer; -webkit-tap-highlight-color:transparent;
  box-shadow:0 4px 14px -4px rgba(0,0,0,0.3);
}
.home-start-btn:hover{opacity:0.92;}
#view-home .section-title:first-of-type{margin-top:10px;}
#home-recent-wrap .entry{padding:14px 20px;}
#home-recent-wrap .entry:last-child{border-bottom:none;}

/* ─── Learn tab ─── */
.learn-article-list{display:flex; flex-direction:column; gap:10px;}
.learn-card{
  display:block; text-decoration:none;
  background:#F4F1EF; border-radius:14px;
  padding:20px 22px 18px;
  box-shadow:0 16px 32px -12px rgba(10,12,25,0.4), 0 2px 0 rgba(228,223,218,0.7) inset;
  transition:transform 0.15s ease, box-shadow 0.15s ease;
}
.learn-card:hover{transform:translateY(-1px); box-shadow:0 22px 40px -12px rgba(10,12,25,0.5);}
.learn-card-eyebrow{font-family:var(--mono); font-size:9.5px; letter-spacing:1.2px; text-transform:uppercase; color:var(--accent); margin-bottom:8px;}
.learn-card-title{font-family:var(--display); font-weight:400; font-size:17px; color:var(--ink); line-height:1.25; margin:0 0 8px; text-wrap:balance;}
.learn-card-desc{font-size:12.5px; line-height:1.6; color:var(--sub); margin:0 0 14px;}
.learn-card-meta{display:flex; align-items:center; justify-content:space-between;}
.learn-card-domain{font-family:var(--mono); font-size:9px; letter-spacing:0.5px; color:#9AA0B4;}
.learn-card-read{font-family:var(--mono); font-size:9px; color:var(--accent); letter-spacing:0.5px;}
.learn-footer-note{font-family:var(--mono); font-size:10px; color:rgba(201,204,219,0.4); text-align:center; margin:20px 0 8px; letter-spacing:0.5px;}
.home-all-entries-btn{
  display:block; width:100%; margin-top:8px; padding:12px;
  border:1px solid rgba(255,255,255,0.1); border-radius:10px;
  background:transparent; color:rgba(243,239,228,0.55);
  font-family:var(--mono); font-size:11px; letter-spacing:0.5px;
  text-align:center; cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.home-all-entries-btn:hover{color:rgba(243,239,228,0.8); border-color:rgba(255,255,255,0.2);}

/* ─── Auth gate two-column layout ─── */
.auth-layout{display:block;}
.auth-left{display:none;}

/* ─── Desktop sidebar ─── */
#desktop-sidebar{display:none;}

/* ─── Desktop breakpoint ─── */
@media (min-width:900px){

  /* Auth gate: two columns */
  #auth-gate{
    max-width:none;
    margin:0;
    padding:0;
    text-align:left;
    min-height:100vh;
    display:flex;
    align-items:stretch;
  }
  .auth-layout{
    display:grid;
    grid-template-columns:1fr minmax(400px, 520px);
    min-height:100vh;
    width:100%;
    max-width:1320px;
    margin:0 auto;
  }
  .auth-left{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:60px 64px;
    gap:0;
    max-width:680px;
    justify-self:end;
    width:100%;
  }
  .auth-wordmark{
    font-family:var(--display);
    font-size:22px;
    font-weight:400;
    color:#F3EFE4;
    letter-spacing:0.3px;
    margin-bottom:40px;
  }
  .auth-headline{
    font-family:var(--display);
    font-size:48px;
    font-weight:400;
    color:#F3EFE4;
    line-height:1.15;
    margin:0 0 20px;
    text-wrap:balance;
  }
  .auth-sub{
    font-family:var(--body);
    font-size:16px;
    color:rgba(243,239,228,0.65);
    line-height:1.6;
    margin:0 0 36px;
  }
  .auth-sub em{font-style:italic; color:#F3EFE4;}
  .auth-example{
    background:rgba(255,255,255,0.06);
    border:1px solid rgba(255,255,255,0.10);
    border-radius:14px;
    padding:22px 24px;
    margin-bottom:28px;
  }
  .auth-ex-meta{display:flex; align-items:center; gap:10px; margin-bottom:12px;}
  .auth-ex-dot{
    width:9px; height:9px; border-radius:50%;
    background:#5FA0AC; flex:none;
  }
  .auth-ex-label{
    font-family:var(--mono); font-size:11px;
    color:rgba(243,239,228,0.5); letter-spacing:0.5px; text-transform:uppercase;
  }
  .auth-ex-entry{
    font-family:var(--display); font-size:15.5px;
    color:rgba(243,239,228,0.82); line-height:1.55; margin-bottom:14px;
  }
  .auth-ex-div{
    border:none; border-top:1px solid rgba(255,255,255,0.10);
    margin:0 0 14px;
  }
  .auth-ex-rlabel{
    font-family:var(--mono); font-size:10px;
    text-transform:uppercase; letter-spacing:1px;
    color:rgba(243,239,228,0.35); margin-bottom:6px;
  }
  .auth-ex-rtext{
    font-family:var(--display); font-size:14.5px;
    color:rgba(243,239,228,0.65); line-height:1.6; font-style:italic;
  }
  .auth-chips{
    display:flex; flex-wrap:wrap; gap:8px; margin-bottom:32px;
  }
  .auth-chip{
    font-family:var(--mono); font-size:11px;
    border:1px solid rgba(255,255,255,0.18);
    border-radius:999px; padding:5px 14px;
    color:rgba(243,239,228,0.6);
  }
  .auth-flinks{
    display:flex; gap:18px; flex-wrap:wrap;
  }
  .auth-flinks a{
    font-family:var(--mono); font-size:11px;
    color:rgba(243,239,228,0.35); text-decoration:none;
  }
  .auth-flinks a:hover{color:rgba(243,239,228,0.6);}

  /* Right column on desktop */
  .auth-right{
    display:flex; flex-direction:column; justify-content:center;
    padding:40px 48px;
    border-left:1px solid rgba(255,255,255,0.08);
    min-height:100vh;
  }
  .auth-right .wrap{padding:0; max-width:none;}
  #auth-gate .wrap{padding:0; max-width:none; margin:0;}
  /* hide the mobile brand header inside auth-right on desktop */
  .auth-right .brand{display:none;}
  #auth-gate input:not([type=checkbox]){margin:10px 0;}

  /* Desktop sidebar */
  #desktop-sidebar{
    display:none; /* shown via body.app-visible below */
    position:fixed; top:0; left:0; bottom:0; width:220px; z-index:200;
    background:#181C2B;
    border-right:1px solid rgba(255,255,255,0.06);
    flex-direction:column;
    padding:28px 0 24px;
  }
  body.app-visible #desktop-sidebar{display:flex;}

  /* Push footer to viewport bottom when content is short */
  body.app-visible{display:flex; flex-direction:column; min-height:100vh;}

  /* Push app content right of sidebar */
  body.app-visible #app{
    padding-left:220px;
    padding-bottom:40px;
    flex:1;
  }
  /* Hide bottom nav on desktop */
  body.app-visible .bottom-nav{display:none !important;}
  /* Adjust Huey float for desktop (no bottom nav) */
  body.app-visible .huey-float{bottom:24px; right:40px;}

  /* App wrap max-width on desktop — wide enough to use the space */
  body.app-visible .wrap{max-width:900px; padding-left:40px; padding-right:40px;}

  /* Sidebar brand */
  .dsb-brand{padding:0 24px 28px; border-bottom:1px solid rgba(255,255,255,0.06);}
  .dsb-logo{
    font-family:var(--display); font-size:20px; font-weight:400;
    color:#F3EFE4; letter-spacing:0.3px; margin-bottom:3px;
  }
  .dsb-tagline{font-family:var(--mono); font-size:10px; color:rgba(243,239,228,0.35); letter-spacing:0.3px;}

  /* Sidebar nav items */
  .dsb-nav{display:flex; flex-direction:column; gap:2px; padding:16px 12px; flex:1;}
  .dsb-item{
    display:flex; align-items:center; gap:12px;
    padding:10px 12px; border-radius:8px; border:none;
    background:transparent; color:rgba(243,239,228,0.45);
    font-family:var(--body); font-size:14px; cursor:pointer;
    transition:background .15s, color .15s;
    text-align:left; width:100%;
    -webkit-tap-highlight-color:transparent;
  }
  .dsb-item:hover{background:rgba(255,255,255,0.06); color:rgba(243,239,228,0.75);}
  .dsb-item.active{background:rgba(255,255,255,0.09); color:#F3EFE4;}
  .dsb-item svg{
    width:18px; height:18px; stroke:currentColor; fill:none;
    stroke-width:1.6; flex:none;
  }

  /* Sidebar write button */
  .dsb-write-btn{
    margin-top:auto;
    display:flex; align-items:center; gap:10px;
    padding:11px 14px; border-radius:10px; border:none;
    background:var(--paper); color:var(--ink);
    font-family:var(--body); font-size:14px; font-weight:600;
    cursor:pointer; width:100%; margin-top:16px;
    box-shadow:0 4px 14px -4px rgba(0,0,0,0.35);
    -webkit-tap-highlight-color:transparent;
  }
  .dsb-write-btn:hover{opacity:0.92;}
  .dsb-plus{font-size:20px; font-weight:300; line-height:1; flex:none;}

  /* Footer on desktop: shift past fixed sidebar, align columns with main content */
  body.app-visible .site-footer{padding-left:220px; padding-bottom:0;}
  body.app-visible .site-footer .footer-cols{max-width:900px; margin:0 auto; padding:20px 40px 8px;}

  /* You tab action rows: stack like mobile so all buttons are the same size */
  body.app-visible .you-action-row{flex-direction:column; align-items:flex-start; gap:10px;}
  body.app-visible .you-action-btn{align-self:stretch;}
}