@charset "UTF-8";
:root{--ink:#1e201b;--muted:#73756a;--paper:#f8f5e9;--card:#fffdf5;--yellow:#f6dc59;--pink:#ecc2d6;--green:#b8c58b;--blue:#c0cfe9;--line:#dfdfd2;--radius:24px;--shadow:0 8px 22px #29281312;--font:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",Arial,sans-serif}
*{box-sizing:border-box}html{background:#e7e7dc;scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:var(--font);font-style:normal;font-size:14px;-webkit-font-smoothing:antialiased;overscroll-behavior-y:none}button,input,textarea,select{font:inherit;color:inherit}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{border:0;cursor:pointer;background:none;padding:0}a{color:inherit}button:disabled{opacity:.42;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #526843;outline-offset:3px}img{display:block;max-width:100%}em,i{font-style:normal}h1,h2,h3,p{margin:0}h1,h2,h3{letter-spacing:-.04em}button svg{pointer-events:none}svg.icon{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}button .icon{vertical-align:middle}button .icon+span{margin-left:6px}.app-shell{position:relative;max-width:440px;min-height:100dvh;margin:0 auto;background:var(--paper);overflow:clip}main{min-height:100dvh;padding-bottom:122px}.no-nav main{padding-bottom:32px}.boot{height:100dvh;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:14px}.boot-mark{font-size:68px;color:#5e703d}.boot strong{font-size:36px;letter-spacing:-2px}.boot p{color:var(--muted)}.brand{display:flex;align-items:center;gap:6px;font-size:27px;font-weight:750;letter-spacing:-1.7px}.brand .brand-mark{font-size:36px;line-height:1;font-weight:400}.app-header{display:flex;align-items:center;justify-content:space-between;padding:20px 23px 16px;padding-top:max(20px,env(safe-area-inset-top))}.header-actions{display:flex;align-items:center;gap:8px}.icon-btn{width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:#ffffff78;flex-shrink:0}.icon-btn.outlined{border:1px solid var(--line);background:transparent}.icon-btn.dark{background:var(--ink);color:var(--paper)}.avatar{width:40px;height:40px;background:var(--green);border:2px solid var(--ink);font-family:var(--font);font-style:normal;font-weight:700;font-size:21px;border-radius:50%}.page-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 22px;padding-top:max(17px,env(safe-area-inset-top));min-height:78px}.page-header h1{font-size:16px;font-weight:600;letter-spacing:0;flex:1;text-align:center}.page-header>.spacer{width:42px;flex-shrink:0}.hero{background:var(--yellow);padding-bottom:25px;border-radius:0 0 32px 32px;position:relative;isolation:isolate;overflow:hidden}.hero-copy{padding:11px 23px 0;position:relative;z-index:1}.eyebrow{font-size:9px;letter-spacing:1.8px;font-weight:650;text-transform:uppercase;display:block;margin-bottom:13px}.hero h1{font-size:38px;line-height:1.24;font-weight:650;letter-spacing:-1.7px;max-width:255px}.hero h1 em{font-family:var(--font);font-weight:400}.hero .intro{font-size:12px;margin-top:12px;letter-spacing:.4px}.hero-footer{display:flex;align-items:center;justify-content:space-between;padding:0 23px;margin-top:24px}.mini-count{display:flex;gap:6px;align-items:center;font-size:11px}.dot{width:5px;height:5px;background:currentColor;display:inline-block;border-radius:50%;margin:0 2px}.text-pill{display:inline-flex;align-items:center;gap:6px;border:1px solid #33352b59;border-radius:30px;padding:8px 12px;font-size:11px}.text-pill svg.icon{width:13px;height:13px}.hero-art{position:absolute;right:24px;top:103px;width:110px;height:140px;z-index:0}.polaroid{position:absolute;background:var(--card);padding:6px 6px 19px;border-radius:3px;width:103px;height:125px;transform:rotate(11deg);box-shadow:2px 5px 10px #52450922;right:-4px;top:8px}.polaroid img{width:100%;height:100%;object-fit:cover}.polaroid small{position:absolute;bottom:4px;left:12px;font-family:var(--font);font-size:9px;letter-spacing:1px}.art-back{position:absolute;width:93px;height:123px;background:var(--blue);transform:rotate(-13deg);top:3px;left:0;border-radius:5px}.flower{width:62px;height:62px;display:flex;align-items:center;justify-content:center;background:var(--pink);clip-path:polygon(50% 0,61% 10%,76% 7%,81% 22%,95% 26%,92% 41%,100% 53%,89% 64%,89% 79%,73% 82%,65% 95%,50% 90%,35% 98%,26% 84%,11% 80%,12% 64%,0 53%,10% 40%,5% 25%,21% 20%,25% 6%,41% 9%)}.hero-art>.flower{position:absolute;left:-20px;bottom:-2px;transform:rotate(-16deg);font-size:27px}.section{padding:24px 22px 0}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:16px}.section-heading h2{font-size:20px;letter-spacing:-.5px}.section-heading h2 small{font-size:11px;letter-spacing:0;color:var(--muted);font-weight:400;margin-left:8px}.section-link{font-size:11px;display:flex;align-items:center;gap:4px;min-height:32px}.section-link svg.icon{width:14px;height:14px}.daily-note{background:var(--green);border-radius:23px;padding:18px 18px;display:flex;align-items:center;gap:14px;text-align:left;width:100%;position:relative;overflow:hidden}.daily-note .flower{background:#f8f5e980;width:47px;height:47px;flex-shrink:0;font-size:23px}.daily-note strong{font-size:15px;font-weight:600;display:block;margin-bottom:5px}.daily-note p{font-size:11px;line-height:1.5;color:#404a31}.daily-note>.icon{margin-left:auto;width:17px}.chips{display:flex;gap:7px;align-items:center;overflow-x:auto;scrollbar-width:none;padding:2px 0 9px;white-space:nowrap}.chips::-webkit-scrollbar{display:none}.chip{display:inline-flex;align-items:center;justify-content:center;gap:5px;border:1px solid var(--line);border-radius:25px;padding:9px 14px;background:transparent;font-size:12px;min-height:37px;white-space:nowrap;flex-shrink:0}.chip.active{background:var(--ink);border-color:var(--ink);color:var(--paper)}.chip .icon{width:14px;height:14px}.filter-tabs{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;gap:9px}.filter-tabs .chips{padding-bottom:0;flex:1}.filter-button{height:36px;width:36px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:50%;flex-shrink:0}.filter-button.active{background:var(--yellow)}.masonry{display:grid;grid-template-columns:1fr 1fr;gap:15px;align-items:start}.masonry-column{display:flex;flex-direction:column;gap:18px;min-width:0}.inspiration-card{min-width:0;position:relative;text-align:left}.card-image{width:100%;display:block;position:relative;border-radius:18px;overflow:hidden;background:#e6e2d4;text-align:left}.card-image img{width:100%;object-fit:cover;aspect-ratio:var(--ratio,0.82);transition:transform .3s ease}.card-image:active img{transform:scale(1.025)}.card-image .image-label{position:absolute;left:8px;top:8px;border-radius:12px;background:#fffc;backdrop-filter:blur(10px);padding:5px 7px;font-size:9px;display:flex;align-items:center;gap:3px}.image-label .icon{width:10px;height:10px}.like-btn{position:absolute;right:8px;top:8px;width:30px;height:30px;background:#fffc;backdrop-filter:blur(8px);border-radius:50%;display:flex;align-items:center;justify-content:center;z-index:2}.like-btn .icon{width:15px;height:15px}.like-btn.is-liked{background:var(--pink)}.like-btn.is-liked .icon{fill:var(--ink)}.card-meta{padding:9px 1px 0}.card-meta h3{font-size:12px;line-height:1.5;letter-spacing:0;font-weight:550;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card-meta p{font-size:10px;margin-top:3px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.palette-mini{display:flex;gap:3px;margin-top:8px}.palette-mini span{height:7px;flex:1;max-width:25px;border-radius:5px}.library-end{padding:26px 0 5px;text-align:center;font-family:var(--font);font-style:normal;font-size:14px;color:#979a8a}.library-end span{font-size:25px;display:block;margin-bottom:5px}

/* Approved navigation treatment B: a 56px floating action and a 36px-radius
   transparent notch give an 8px gap without painting over the page content.
   Its 8px shoulders join the navigation edge and circular notch tangentially. */
.bottom-nav {
  position: fixed;
  z-index: 30;
  bottom: max(19px, env(safe-area-inset-bottom));
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 36px);
  max-width: 404px;
  height: 66px;
  padding: 0 11px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 63px minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  background: transparent;
  overflow: visible;
  filter: drop-shadow(0 8px 12px #16171324);
  pointer-events: none;
}
.bottom-nav::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--nav-surface, #1e201b);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22357%22%20height%3D%2266%22%20viewBox%3D%220%200%20357%2066%22%20preserveAspectRatio%3D%22none%22%3E%3Cpath%20fill%3D%22white%22%20d%3D%22M33%200%20H134.545478%20A8%208%200%200%201%20142.537209%208.363636%20A36%2036%200%201%200%20214.462791%208.363636%20A8%208%200%200%201%20222.454522%200%20H324%20A33%2033%200%200%201%20357%2033%20A33%2033%200%200%201%20324%2066%20H33%20A33%2033%200%200%201%200%2033%20A33%2033%200%200%201%2033%200%20Z%22%2F%3E%3C%2Fsvg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22357%22%20height%3D%2266%22%20viewBox%3D%220%200%20357%2066%22%20preserveAspectRatio%3D%22none%22%3E%3Cpath%20fill%3D%22white%22%20d%3D%22M33%200%20H134.545478%20A8%208%200%200%201%20142.537209%208.363636%20A36%2036%200%201%200%20214.462791%208.363636%20A8%208%200%200%201%20222.454522%200%20H324%20A33%2033%200%200%201%20357%2033%20A33%2033%200%200%201%20324%2066%20H33%20A33%2033%200%200%201%200%2033%20A33%2033%200%200%201%2033%200%20Z%22%2F%3E%3C%2Fsvg%3E");
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  pointer-events: none;
}
.bottom-nav[hidden] { display: none; }
.nav-item {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: 100%;
  max-width: 60px;
  justify-self: center;
  min-width: 0;
  min-height: 48px;
  color: #aeb0a4;
  font-size: 9px;
  line-height: 1.2;
  pointer-events: auto;
}
.nav-item[data-action="projects"] { grid-column: 4; }
.nav-item[data-action="profile"] { grid-column: 5; }
.nav-item .icon { width: 21px; height: 21px; }
.nav-item.active { color: var(--yellow); }
.nav-add {
  position: absolute;
  top: -18px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  margin: 0;
  border: 0;
  border-radius: 50%;
  background: var(--nav-surface, #1e201b);
  color: #f8f5e9;
  pointer-events: auto;
}
.nav-add .icon { width: 26px; height: 26px; stroke-width: 1.5; }

.page-banner{padding:10px 23px 27px;border-radius:0 0 30px 30px}.page-banner h1{font-size:36px;font-weight:650;line-height:1.2;letter-spacing:-1.6px}.page-banner p{font-size:12px;line-height:1.6;margin-top:13px}.color-yellow{background:var(--yellow)}.color-pink{background:var(--pink)}.color-green{background:var(--green)}.color-blue{background:var(--blue)}.search-field{background:var(--card);border-radius:18px;display:flex;align-items:center;gap:10px;padding:0 15px;margin-top:22px;border:1px solid transparent;height:53px}.search-field:focus-within{border-color:var(--ink)}.search-field input{background:none;border:0;outline:0;min-width:0;flex:1;height:100%;font-size:13px}.search-field button{min-width:30px;min-height:38px}.search-field input::placeholder{color:#97968b}.search-field .icon{width:20px}.search-caption{display:flex;justify-content:space-between;margin-top:9px;font-size:10px;color:#5f5b3f}.search-suggestions{display:flex;gap:9px;flex-wrap:wrap;margin-top:13px}.suggestion{padding:12px 16px;border-radius:14px;font-size:12px;border:1px solid var(--line);background:var(--card)}.suggestion:nth-child(3n+1){background:#e9ecdb}.suggestion:nth-child(3n+2){background:#f4e2e9}.suggestion:nth-child(3n){background:#e2e8f1}.empty-state{text-align:center;padding:46px 18px}.empty-state .empty-art{width:105px;height:105px;border-radius:35px;background:var(--blue);margin:0 auto 24px;display:flex;align-items:center;justify-content:center;transform:rotate(-8deg)}.empty-art .icon{width:42px;height:42px;stroke-width:1.3;transform:rotate(8deg)}.empty-state h2{font-size:20px;margin-bottom:10px}.empty-state p{color:var(--muted);font-size:12px;line-height:1.8;max-width:270px;margin:auto}.empty-state .btn{margin:21px auto 0;max-width:240px}.btn{display:flex;align-items:center;justify-content:center;gap:8px;border-radius:30px;min-height:50px;padding:14px 20px;width:100%;font-size:13px;font-weight:550;background:var(--ink);color:var(--paper);border:1px solid var(--ink)}.btn.secondary{background:transparent;color:var(--ink);border-color:var(--line)}.btn.light{background:var(--card);border-color:var(--card);color:var(--ink)}.btn.small{min-height:40px;font-size:12px;padding:10px 16px;width:auto}.btn .icon{width:18px;height:18px}.button-row{display:flex;gap:10px}.button-row>.btn{flex:1}.muted{color:var(--muted)}.tiny{font-size:10px;line-height:1.7}.hint{font-size:11px;color:var(--muted);line-height:1.7}.stack{display:flex;flex-direction:column;gap:14px}.content-pad{padding:0 22px}.content-pad>h2{font-size:26px;margin:12px 0}.project-card{width:100%;padding:20px;border-radius:25px;text-align:left;overflow:hidden;position:relative;display:block;min-height:226px}.project-card .eyebrow{margin-bottom:8px;font-size:8px}.project-card h2{font-size:25px;font-weight:600;line-height:1.3;max-width:245px}.project-card .project-sub{font-size:11px;margin-top:6px;opacity:.72}.project-card .project-images{display:flex;gap:8px;margin-top:20px;padding:3px 0 0;height:90px;align-items:flex-start}.project-images img{width:72px;height:83px;object-fit:cover;border:4px solid var(--card);border-radius:3px;box-shadow:0 2px 4px #0001;transform:rotate(-7deg)}.project-images img:nth-child(2){transform:rotate(5deg);margin-top:-2px}.project-images img:nth-child(3){transform:rotate(-3deg)}.project-card .round-arrow{position:absolute;bottom:22px;right:20px;background:var(--ink);color:var(--paper);width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center}.new-project-card{border:1px dashed #9b9f8d;border-radius:22px;display:flex;gap:11px;align-items:center;justify-content:center;padding:22px;min-height:86px;width:100%;font-size:13px}.project-title-block{padding:10px 23px 27px;position:relative}.project-title-block .eyebrow{margin-bottom:12px}.project-title-block h1{font-size:32px;line-height:1.2;max-width:300px}.project-title-block p{font-size:12px;line-height:1.7;margin-top:13px;max-width:300px}.project-title-block .button-row{margin-top:23px}.project-title-block .btn{font-size:11px;min-height:41px;padding:10px}.project-reference{padding:12px;background:var(--card);border:1px solid #e4e4d7;border-radius:20px;display:flex;gap:13px}.project-reference>button:first-child{width:91px;flex-shrink:0}.project-reference img{width:91px;height:113px;object-fit:cover;border-radius:12px}.project-reference-body{min-width:0;flex:1}.project-reference-body h3{font-size:13px;line-height:1.6;letter-spacing:0}.project-reference-body p{font-size:11px;line-height:1.6;color:var(--muted);margin-top:5px}.reference-actions{display:flex;justify-content:space-between;margin-top:7px;gap:4px}.reference-actions button{font-size:10px;min-height:30px;display:inline-flex;gap:3px;align-items:center}.reference-actions .icon{width:15px;height:15px}.detail-image{position:relative;margin:0 16px;border-radius:24px;overflow:hidden;background:#e8e5d8}.detail-image>img{width:100%;max-height:470px;min-height:230px;object-fit:cover}.detail-image .like-btn{top:14px;right:14px;width:40px;height:40px}.detail-image .like-btn .icon{width:19px;height:19px}.detail-image-label{position:absolute;bottom:14px;left:14px;background:#fffd;backdrop-filter:blur(10px);border-radius:20px;padding:7px 11px;font-size:10px;display:flex;align-items:center;gap:4px}.detail-image-label .icon{width:12px;height:12px}.detail-title{padding:22px 23px 0}.detail-title .eyebrow{color:var(--muted);font-size:8px;margin-bottom:9px}.detail-title h1{font-size:27px;line-height:1.3}.tag-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}.tag{font-size:10px;border-radius:6px;padding:6px 9px;background:#e9ebdf;color:#5c654b}.note-block{margin-top:20px;border-radius:19px;background:#eeeee1;padding:16px}.note-block .note-label{display:flex;justify-content:space-between;font-size:11px;align-items:center;margin-bottom:10px}.note-label strong{display:flex;align-items:center;gap:6px;font-weight:600}.note-label .icon{width:15px;height:15px}.note-label button{font-size:10px;text-decoration:underline;text-underline-offset:3px;min-height:24px}.note-block p{font-size:13px;line-height:1.8}.ai-card{background:var(--pink);border-radius:22px;padding:19px;margin-top:18px}.ai-header{display:flex;justify-content:space-between;gap:8px;align-items:center}.ai-header h2{font-size:16px;display:flex;align-items:center;gap:7px}.ai-header h2>.icon{width:18px}.badge{font-size:9px;border:1px solid #36322933;padding:4px 7px;border-radius:12px;white-space:nowrap}.ai-card>p{font-size:12px;line-height:1.85;margin-top:12px}.ai-card .button-row{margin-top:15px}.ai-card .btn{min-height:38px;font-size:11px;padding:9px 12px}.ai-card .hint{margin-top:10px;font-size:10px;color:#73626a}.ai-card .tag-row{margin-top:11px}.ai-card .tag{background:#fffa;color:var(--ink)}.color-palette{display:flex;border-radius:15px;overflow:hidden;height:73px;margin-top:13px}.color-swatch{flex:1;position:relative;border:0;min-width:0}.color-swatch span{font-size:8px;position:absolute;bottom:8px;left:50%;transform:translateX(-50%);background:#ffffffe0;padding:3px 4px;border-radius:4px;color:#222}.detail-section{margin-top:22px}.detail-section h2{font-size:15px;letter-spacing:0}.detail-section .section-heading{margin-bottom:0}.detail-section .hint{margin-top:9px}.source-row{display:flex;gap:10px;padding:13px 0;align-items:flex-start;border-bottom:1px solid var(--line)}.source-row .icon{width:18px;margin-top:2px}.source-row div{flex:1;min-width:0}.source-row strong{font-size:12px;font-weight:500}.source-row p,.source-row a{font-size:10px;line-height:1.6;color:var(--muted);word-break:break-all;margin-top:4px;display:block}.sticky-actions{position:sticky;bottom:0;margin:26px -22px -32px;padding:15px 22px max(19px,env(safe-area-inset-bottom));background:linear-gradient(#f8f5e9ee,var(--paper) 35%);z-index:10}.sticky-actions .btn{min-height:50px}.form-field{margin-top:22px}.form-field label,.field-label{font-size:12px;font-weight:600;display:block;margin-bottom:10px;letter-spacing:.2px}.form-field input,.form-field textarea,.form-field select,.text-input{border:1px solid var(--line);background:var(--card);border-radius:15px;padding:14px;width:100%;font-size:13px;line-height:1.6;outline:none}.form-field input:focus,.form-field textarea:focus,.text-input:focus{border-color:#778452}.form-field textarea{resize:vertical;min-height:99px}.form-field .hint{margin-top:8px}.capture-intro{padding:2px 23px 0}.capture-intro .eyebrow{font-size:9px;margin-bottom:12px}.capture-intro h1{font-size:35px;line-height:1.25}.capture-intro p{margin-top:11px;font-size:12px;color:var(--muted);line-height:1.7}.capture-zone{margin:25px 22px 0;min-height:300px;border:1px dashed #9d9f89;border-radius:28px;position:relative;overflow:hidden;background:#eeeedf;display:flex;flex-direction:column;align-items:center;justify-content:center}.capture-zone .capture-art{display:flex;align-items:center;justify-content:center;margin-bottom:27px;position:relative;width:140px;height:90px}.capture-art .art-sheet{position:absolute;width:81px;height:97px;display:flex;align-items:center;justify-content:center;border:5px solid var(--card);background:var(--pink);transform:rotate(-12deg);left:14px;top:0}.capture-art .art-sheet:nth-child(2){background:var(--blue);transform:rotate(13deg);left:56px;top:1px}.capture-art .icon{width:31px;height:31px;stroke-width:1.2}.capture-zone>strong{font-size:15px;margin-top:10px}.capture-zone>p{font-size:10px;margin-top:8px;color:var(--muted)}.capture-zone.has-image{border:0;min-height:0;background:#ddd}.capture-zone>img{width:100%;max-height:380px;object-fit:contain}.capture-zone .replace-image{position:absolute;bottom:14px;right:14px;background:#fffe;border-radius:22px;padding:9px 13px;font-size:11px;box-shadow:var(--shadow)}.capture-buttons{padding:20px 22px;display:flex;flex-direction:column;gap:10px}.capture-buttons>.hint{text-align:center;font-size:10px}.step-indicator{display:flex;align-items:center;gap:7px;font-size:10px;margin-bottom:17px;color:var(--muted)}.step-indicator>i{width:5px;height:5px;border-radius:50%;background:var(--ink)}.focus-preview{position:relative;margin-top:20px;border-radius:23px;overflow:hidden;touch-action:none;aspect-ratio:1.35;background:#e6e2d4}.focus-preview img{width:100%;height:100%;object-fit:contain}.focus-rectangle{position:absolute;border:2px solid var(--yellow);background:#f6dc5911;box-shadow:0 0 0 300px #1e201b44;pointer-events:none}.focus-rectangle:after{content:'关注区域';position:absolute;left:-2px;top:-25px;background:var(--yellow);color:var(--ink);padding:5px 8px;font-size:9px;border-radius:7px 7px 0 0;white-space:nowrap}.focus-instruction{display:flex;align-items:center;justify-content:space-between;margin-top:9px;font-size:10px;color:var(--muted)}.focus-options{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:11px}.focus-option{border:1px solid var(--line);border-radius:14px;padding:13px 9px;display:flex;align-items:center;gap:8px;font-size:11px;background:var(--card);text-align:left;min-height:46px}.focus-option .icon{width:18px;height:18px}.focus-option.active{border-color:var(--ink);background:var(--yellow)}.saved-indicator{font-size:11px;display:flex;align-items:center;gap:6px;color:#4c6441;background:#e9eddd;border-radius:13px;padding:10px 13px;margin:0 22px 18px}.saved-indicator .icon{width:15px;height:15px}.profile-top{padding:5px 23px 28px;border-radius:0 0 30px 30px;background:var(--pink)}.profile-identity{display:flex;align-items:center;gap:13px;margin:10px 0 20px}.profile-avatar{height:68px;width:68px;border-radius:50%;background:var(--paper);display:flex;align-items:center;justify-content:center;font-family:var(--font);font-style:normal;font-size:35px;border:1.5px solid var(--ink)}.profile-identity h1{font-size:25px}.profile-identity p{font-size:11px;line-height:1.6;margin-top:6px}.stats-row{display:flex;justify-content:space-between;padding:15px 0 0;border-top:1px solid #221e2020}.stats-row>button{flex:1;text-align:center;min-height:42px}.stats-row strong{font-size:25px;font-weight:500;display:block;font-family:var(--font)}.stats-row span{font-size:10px;display:block;margin-top:5px}.settings-group{border:1px solid var(--line);border-radius:20px;overflow:hidden;margin-top:13px;background:#fffdf560}.settings-row{display:flex;gap:12px;padding:16px 15px;align-items:center;width:100%;text-align:left;border-bottom:1px solid var(--line);min-height:63px}.settings-row:last-child{border-bottom:0}.settings-row>.icon{width:19px}.settings-row .row-copy{flex:1}.settings-row strong{font-size:12px;font-weight:500;display:block}.settings-row p{font-size:10px;line-height:1.65;color:var(--muted);margin-top:4px}.settings-row>svg:last-child{width:15px}.toggle{width:39px;height:24px;background:#cecebf;border-radius:20px;position:relative;flex-shrink:0}.toggle:after{content:'';position:absolute;left:3px;top:3px;width:18px;height:18px;background:var(--card);border-radius:50%;transition:transform .2s}.toggle.on{background:var(--ink)}.toggle.on:after{transform:translateX(15px);background:var(--yellow)}.about-footer{text-align:center;margin-top:29px;padding-bottom:5px}.about-footer strong{font-size:25px;letter-spacing:-1.4px}.about-footer p{font-size:9px;letter-spacing:1px;color:var(--muted);margin-top:7px}.modal-overlay{position:fixed;inset:0;background:#191e194f;z-index:80;display:flex;align-items:flex-end;justify-content:center;backdrop-filter:blur(4px);animation:fade-in .17s ease}.sheet{width:100%;max-width:440px;max-height:90dvh;overflow:auto;background:var(--paper);border-radius:29px 29px 0 0;padding:11px 23px max(25px,env(safe-area-inset-bottom));animation:slide-up .22s ease;overscroll-behavior:contain}.sheet-grabber{width:34px;height:4px;background:#c7c9bc;border-radius:5px;margin:0 auto 19px}.sheet-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}.sheet-heading h2{font-size:23px;font-weight:600}.sheet-heading .icon-btn{width:34px;height:34px;border:1px solid var(--line)}.sheet>.hint{margin-bottom:20px}.sheet .form-field{margin-top:17px}.sheet .btn{margin-top:18px}.sheet .button-row .btn{margin-top:18px}.sheet .button-row{gap:9px}.sheet .menu-action{display:flex;align-items:center;gap:11px;width:100%;padding:17px 1px;border-bottom:1px solid var(--line);font-size:13px;text-align:left}.menu-action>.icon{width:19px}.menu-action.danger{color:#a64941}.project-choice{display:flex;gap:11px;align-items:center;width:100%;border:1px solid var(--line);padding:12px;border-radius:16px;margin-top:10px;text-align:left}.project-choice>span:first-child{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center}.project-choice>div{flex:1;min-width:0}.project-choice strong{display:block;font-size:12px;font-weight:500}.project-choice small{font-size:10px;color:var(--muted);margin-top:4px;display:block}.project-choice.selected{border-color:var(--ink);background:#eeeedf}.circle-check{width:21px;height:21px;border:1px solid #aaa;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}.selected .circle-check{background:var(--ink);color:var(--paper);border-color:var(--ink)}.circle-check>.icon{width:13px;height:13px}.color-picker{display:flex;gap:12px;margin-top:11px}.color-choice{width:36px;height:36px;border-radius:50%;border:3px solid transparent;box-shadow:0 0 0 1px #3331}.color-choice.selected{border-color:var(--paper);box-shadow:0 0 0 2px var(--ink)}.picker-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:17px;max-height:43dvh;overflow:auto;padding:3px}.picker-card{border:2px solid transparent;border-radius:12px;position:relative;overflow:hidden;text-align:left}.picker-card img{width:100%;aspect-ratio:.8;object-fit:cover}.picker-card.selected{border-color:var(--ink)}.picker-card .circle-check{position:absolute;right:5px;top:5px;background:#fffe;width:22px;height:22px}.picker-card.selected .circle-check{background:var(--ink)}.picker-card p{font-size:9px;padding:6px 3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.export-preview{background:var(--card);border:1px solid var(--line);padding:17px;margin:20px 0 16px;border-radius:3px;box-shadow:var(--shadow)}.export-preview .eyebrow{font-size:6px;letter-spacing:1.5px}.export-preview h3{font-size:23px;margin-bottom:8px}.export-preview>p{font-size:9px;line-height:1.7;color:var(--muted)}.export-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:15px}.export-grid img{width:100%;height:94px;object-fit:cover;border-radius:3px}.export-grid p{font-size:8px;margin-top:5px}.export-brand{font-size:9px;margin-top:19px;padding-top:10px;border-top:1px solid var(--line);display:flex;justify-content:space-between}.toast{position:fixed;bottom:110px;left:50%;transform:translateX(-50%) translateY(10px);max-width:370px;width:max-content;max-width:min(370px,calc(100% - 48px));z-index:120;padding:12px 18px;background:#22271ef2;backdrop-filter:blur(8px);color:var(--paper);border-radius:15px;font-size:12px;line-height:1.6;pointer-events:none;opacity:0;transition:all .18s;box-shadow:0 3px 15px #0002;text-align:center}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}.busy-spinner{display:inline-block;width:15px;height:15px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .8s linear infinite}.onboarding{background:var(--paper);min-height:100dvh;padding:30px 23px;display:flex;flex-direction:column}.onboarding h1{font-size:47px;line-height:1.09;font-weight:650;margin-top:32px;letter-spacing:-2px}.onboarding h1 em{font-family:var(--font);font-weight:400}.welcome-shapes{height:285px;position:relative;margin-top:20px}.welcome-shapes .welcome-yellow{position:absolute;width:200px;height:195px;background:var(--yellow);right:-13px;top:4px;transform:rotate(-12deg);border-radius:4px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:20px}.welcome-yellow span{font-family:var(--font);font-style:normal;font-size:14px;display:block;margin-top:6px}.welcome-shapes .welcome-blue{position:absolute;bottom:0;left:-38px;width:196px;height:196px;border-radius:50%;background:var(--blue);display:flex;align-items:center;justify-content:center;transform:rotate(20deg);font-size:22px}.welcome-shapes .flower{position:absolute;left:8px;top:5px;width:99px;height:99px;transform:rotate(-16deg);font-size:16px}.welcome-shapes .welcome-label{position:absolute;right:13px;bottom:12px;font-size:12px;line-height:1.6}.onboarding .btn{margin-top:auto}.onboarding .hint{text-align:center;margin-top:14px}.modal-info{padding:18px 0 5px;font-size:12px;line-height:1.9}.modal-info p{margin-bottom:13px}.modal-info strong{font-size:13px}.modal-info ul{padding-left:19px;margin:10px 0}.area-buttons{display:flex;gap:7px}.area-buttons button{font-size:10px;min-height:32px}.result-context{font-size:10px;color:var(--muted);padding:0 0 13px;line-height:1.6}.processing{display:flex;align-items:center;gap:10px;margin:20px 0;font-size:12px}.danger-text{color:#a64941}.sheet-sticky{position:sticky;bottom:-26px;background:var(--paper);padding-bottom:5px}.project-mini-pill{margin:7px 6px 0 0;display:inline-flex;align-items:center;gap:5px;font-size:11px;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:var(--card)}.project-mini-pill .icon{width:14px;height:14px}.result-reason{color:#4f6440;font-size:9px;line-height:1.4;margin-top:5px}.edit-color-dot{width:9px;height:9px;border-radius:50%;background:var(--yellow)}[hidden]{display:none!important}@keyframes slide-up{from{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes fade-in{from{opacity:0}to{opacity:1}}@keyframes spin{to{transform:rotate(360deg)}}@media(min-width:600px){body{padding:24px 0}.app-shell{min-height:calc(100dvh - 48px);border-radius:35px;box-shadow:0 15px 80px #292b2120;outline:1px solid #00000008}.bottom-nav{bottom:30px}.sheet{border-radius:28px;margin-bottom:24px;max-height:calc(100dvh - 48px)}.hero{border-radius:35px 35px 32px 32px}.modal-overlay{align-items:flex-end}.page-header{padding-top:19px}main{min-height:calc(100dvh - 48px)}}@media(max-width:370px){.hero h1{font-size:33px;max-width:215px}.hero-art{right:18px;width:85px;top:111px;transform:scale(.85);transform-origin:top right}.hero-copy{padding-left:20px}.hero .intro{font-size:11px}.section{padding-left:18px;padding-right:18px}.masonry{gap:11px}.page-banner h1{font-size:32px}.hero-footer{padding:0 20px}.mini-count{font-size:10px}.chip{padding:8px 11px;font-size:11px}.nav-item{font-size:8px}.bottom-nav{width:calc(100% - 28px)}.onboarding h1{font-size:41px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* Touch targets remain comfortable without changing the compact visual rhythm. */
.suggestion>.icon{width:12px;height:12px;margin-left:5px;vertical-align:middle}.card-image .image-label{max-width:calc(100% - 50px)}.detail-title .sticky-actions{margin-left:-23px;margin-right:-23px}.no-nav main{padding-bottom:95px}.onboarding{margin-bottom:-95px}.project-reference-body .eyebrow{line-height:1.5}.sheet .hint{line-height:1.8}.card-image{min-height:100px}

/* User-supplied Visense identity. Original PNG is preserved. */
.brand-logo { display: block; width: 40px; height: 40px; object-fit: contain; flex-shrink: 0; }
.brand { gap: 5px; }
.footer-brand { justify-content: center; }
.boot-logo { display: block; width: 88px; height: 88px; object-fit: contain; }
.about-logo { display: block; width: 72px; height: 72px; margin-bottom: 15px; object-fit: contain; }
.export-logo-lockup { display: inline-flex; align-items: center; gap: 4px; }
.export-logo-lockup img { width: 20px; height: 20px; object-fit: contain; }

/* Vertical navigation labels must not inherit horizontal button icon spacing. */
.nav-item > .icon { display: block; }
.nav-item > .icon + span { margin-left: 0; text-align: center; }

/* Shared content sizing, matched to the Figma prototype's longer labels. */
.project-title-block h1, .project-title-block > p,
.project-reference-body h3, .project-reference-body > p,
.detail-title h1, .note-block > p, .ai-card > p,
.project-choice strong, .project-mini-pill, .modal-info,
.export-preview h3, .export-preview > p, .export-grid p {
  overflow-wrap: anywhere;
}
.project-reference > button, .project-choice > span:first-child { flex-shrink: 0; }
.section-heading > h2, .sheet-heading > h2 { min-width: 0; }
.section-heading small { display: inline-block; white-space: nowrap; letter-spacing: 0; }
.sheet-heading > .icon-btn, .btn > .icon { flex-shrink: 0; }
.btn > span { min-width: 0; overflow-wrap: anywhere; }
.tag { max-width: 100%; overflow-wrap: anywhere; }
.export-grid > div { min-width: 0; }
.export-grid p { font-size: 10px; line-height: 1.5; min-height: 30px; }
.export-brand { gap: 12px; align-items: center; }
.export-brand > span { flex-shrink: 0; white-space: nowrap; }
.project-example { margin: 0 0 4px; }
.sample-observation { margin-top: 10px; }
