/* Public garden. Paper stays in the DOM; plants are rendered in WebGL. */
.brand-mark.graduate-logo,.public-mode .brand-mark.graduate-logo { display:block; flex:0 0 auto; width:52px; height:46px; padding:0; border:1px solid #9aafb458; border-radius:12px; overflow:hidden; background:#e2ecdf; box-shadow:0 2px 5px #29455414; }
.graduate-logo img { display:block; width:100%; height:100%; object-fit:cover; }
.guestbook-mode .main-content { padding:0; max-width:none; }
.guestbook-garden { background:radial-gradient(ellipse at 90% 68%,#f8e3d84d,transparent 40%),linear-gradient(180deg,#edf4f7 0,#eaf0f5 340px,#e0e2ed 580px,#cbc7de 850px,#9eaaa6 100%); overflow:hidden; color:#303b48; }
.garden-heading { max-width:1360px; margin:auto; padding:30px 64px 18px; display:flex; justify-content:space-between; align-items:center; gap:30px; }
.garden-kicker { display:flex; align-items:center; gap:14px; font-size:0.625rem; letter-spacing:.13em; color:#506d74; }
.garden-kicker i { width:22px; height:1px; background:#8aa3a6; }
.garden-heading h1 { margin:16px 0 12px; font:500 clamp(1.875rem,3vw,2.6875rem)/1.35 'Noto Serif SC','Songti SC','SimSun',serif; letter-spacing:.06em; }
.garden-heading p { font-size:0.8125rem; line-height:1.95; color:#59737b; margin:0; }
.garden-invitation { display:flex; flex-direction:column; align-items:center; gap:14px; padding-top:20px; }
.garden-invitation>span { color:#627b80; font-size:0.6875rem; }
.garden-write { background:#2e5045; border:1px solid #2e5045; border-radius:40px; padding:15px 28px; color:#fff; display:inline-flex; flex:0 0 auto; width:max-content; min-width:158px; white-space:nowrap; word-break:keep-all; gap:18px; align-items:center; justify-content:center; font-size:0.875rem; box-shadow:0 8px 22px #254a421a; transition:transform .2s,background .2s; }
.garden-write:hover { background:#203e34; transform:translateY(-2px); }
.garden-write svg { width:17px; height:17px; flex:0 0 17px; }
.garden-toolbar { margin:0 auto; max-width:1232px; padding:20px 0 16px; display:flex; justify-content:space-between; border-bottom:1px solid #a4b9b943; font-size:0.6875rem; color:#627b80; scroll-margin-top:90px; }
.garden-years { display:flex; gap:8px; max-width:1232px; margin:0 auto; padding:8px 0 0; overflow-x:auto; }
.garden-year { flex-shrink:0; border:1px solid #b8c8cb; background:transparent; color:#526a71; border-radius:24px; font-size:0.75rem; padding:11px 18px; min-height:44px; }
.garden-year[aria-pressed=true] { background:#566078; border-color:#566078; color:white; }
.garden-year:hover { border-color:#72778e; }
.garden-bed { position:relative; height:740px; max-width:1440px; margin:0 auto; perspective:1800px; background:radial-gradient(ellipse at 86% 64%,#fff0d947,transparent 45%); }
.garden-bed::before { content:''; position:absolute; inset:auto 0 0; height:70px; background:linear-gradient(transparent,#9eaaa677); pointer-events:none; z-index:1; }
.garden-bed::after { content:''; pointer-events:none; position:absolute; inset:auto 12% 16px; height:35px; border-radius:50%; background:#27493324; filter:blur(20px); }
.garden-canvas { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.garden-notes { position:absolute; inset:0; transform-style:preserve-3d; z-index:2; }
.garden-note-anchor { position:absolute; top:calc(82px + var(--row) * 320px); left:calc(23% + var(--column) * 27%); width:250px; margin-left:-125px; transform-style:preserve-3d; transform:translate3d(var(--garden-x,0px),var(--garden-y,0px),8px) rotateY(var(--garden-ry,0deg)); transition:transform .35s ease-out; }
.garden-note-anchor::before { content:''; position:absolute; top:-38px; left:50%; width:1px; height:55px; background:#8b846a; transform:rotate(-6deg); z-index:2; }
.garden-note { width:100%; min-height:204px; display:flex; flex-direction:column; position:relative; text-align:left; padding:25px 22px 16px; border:1px solid #fffaf1; border-radius:2px 3px 12px 2px; color:#24272b; background:linear-gradient(125deg,#fffefa 58%,#f5eff5 92%,#e6dce7); box-shadow:1px 2px 0 #d0c3d2,3px 8px 14px #46374f26,8px 17px 30px #4d375519; transform:rotate(var(--tilt)); transform-origin:50% 0; animation:garden-paper-sway 10s ease-in-out infinite alternate; cursor:pointer; }
.garden-note::before { content:''; position:absolute; top:9px; left:calc(50% - 3px); height:6px; width:6px; border-radius:50%; background:#737c66; box-shadow:inset 1px 2px 2px #1f321b; }
.garden-note:hover,.garden-note:focus-visible { animation-play-state:paused; outline:2px solid #718c6a; outline-offset:6px; }
.note-eyebrow { display:flex; justify-content:space-between; width:100%; gap:8px; color:#515e4d; font-size:0.75rem; line-height:1.5; padding:6px 0 18px; }
.note-message { display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; overflow-wrap:anywhere; white-space:pre-wrap; font:500 1.1875rem/1.7 'Noto Serif SC','Songti SC','SimSun',serif; margin:0 0 22px; min-height:48px; }
.note-signature { margin-top:auto; display:flex; flex-wrap:wrap; align-items:center; gap:6px 12px; width:100%; font-size:0.8125rem; color:#34383a; overflow-wrap:anywhere; }
.note-signature strong { font-weight:500; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.note-signature time { color:#626775; font-size:0.75rem; }
.note-bottom { display:flex; flex-wrap:wrap; gap:8px; justify-content:space-between; width:100%; margin-top:13px; padding-top:11px; border-top:1px solid #e6e4e9; color:#555969; font-size:0.75rem; }
.garden-footer { max-width:1232px; padding:25px 0 35px; margin:auto; display:flex; gap:15px; align-items:center; justify-content:space-between; border-top:1px solid #a4b9b943; font-size:0.8125rem; color:#354c4e; }
.garden-footer nav { display:flex; align-items:center; gap:12px; }
.garden-status { position:relative; z-index:2; margin:auto; padding:100px 24px 0; text-align:center; }
.garden-status h2 { font:500 1.5rem/1.5 'SimSun',serif; }
.garden-status p { color:#5b7175; font-size:0.8125rem; }
.garden-status .secondary-button { margin:20px auto; }
.garden-error { text-align:center; }
.garden-letter { padding:12px 2px; color:#252b26; }
.letter-meta { display:flex; gap:12px; align-items:center; flex-wrap:wrap; }
.letter-meta strong { overflow-wrap:anywhere; }
.letter-meta span { font-size:0.75rem; color:#647466; }
.garden-letter p { white-space:pre-wrap; overflow-wrap:anywhere; font:1.125rem/1.95 'Noto Serif SC','Songti SC','SimSun',serif; margin:25px 0; }
.garden-letter blockquote { margin:0 0 22px; border-left:3px solid #73916a; background:#f0f5ee; padding:18px; }
.garden-letter blockquote p { margin:8px 0 0; font-size:1rem; }
.garden-fallback { position:absolute; inset:0; background:url('lavender-fallback.svg') center bottom / 100% auto no-repeat; opacity:.75; }
.garden-bed.has-webgl .garden-fallback { display:none; }
@keyframes garden-paper-sway { from { transform:rotate(var(--tilt)); } to { transform:rotate(calc(var(--tilt) + .5deg)); } }
@media(min-width:761px) {
  .garden-bed[data-count="1"] .garden-note-anchor { left:50%; }
  .garden-bed[data-count="2"] .garden-note-anchor { left:calc(33% + var(--column) * 34%); }
  .garden-bed[data-count="4"] .garden-note-anchor:nth-child(4) { left:50%; }
  .garden-bed[data-count="5"] .garden-note-anchor:nth-child(n+4) { left:calc(33% + var(--column) * 34%); }
}
.letter-actions { display:flex; flex-wrap:wrap; gap:14px; align-items:center; }
.reply-original { margin:0; padding:14px 18px; background:#f2eff5; border-left:3px solid #92869f; max-height:180px; overflow:auto; }
.reply-original p { white-space:pre-wrap; overflow-wrap:anywhere; margin:8px 0 0; line-height:1.7; }
@media(min-width:761px) and (max-width:1050px) { .garden-note-anchor { width:220px; margin-left:-110px; left:calc(19% + var(--column) * 31%); } .garden-note { padding:25px 18px 16px; } }
@media(max-width:1300px) { .garden-toolbar,.garden-footer,.garden-years { margin-left:5%; margin-right:5%; } }
@media(max-width:760px) {
  .public-mode .topbar { height:auto; min-height:80px; padding:12px 20px; flex-wrap:wrap; gap:8px; }
  .public-mode .public-nav { width:100%; margin:0; gap:0; justify-content:space-between; }
  .public-mode .brand-mark.graduate-logo,.brand-mark.graduate-logo { width:43px; height:38px; border-radius:9px; }
  .guestbook-mode .public-nav a:first-child { display:block; }
  .guestbook-mode .public-nav a { font-size:0.75rem; }
  .guestbook-mode .mentor-entry { font-size:0.75rem; padding:8px 12px; gap:7px; }
  .garden-heading { padding:22px 24px 14px; display:block; }
  .garden-heading h1 { font-size:1.8125rem; margin:10px 0 8px; }
  .garden-kicker { font-size:0.5625rem; gap:9px; }
  .garden-invitation { align-items:flex-start; padding-top:14px; }
  .garden-invitation>span { display:none; }
  .garden-write { padding:12px 22px; }
  .garden-toolbar { margin:0 24px; padding:12px 0; font-size:0.6875rem; gap:12px; align-items:center; }
  .garden-bed { height:calc(var(--note-count,1) * 330px + 130px); }
  .garden-note-anchor { top:calc(var(--slot) * 330px + 72px); left:50%; width:240px; margin-left:-120px; }
  .garden-note { min-height:210px; padding:21px 20px 14px; }
  .note-message { -webkit-line-clamp:3; font-size:1.125rem; margin-bottom:16px; }
  .note-eyebrow { padding-bottom:12px; }
  .garden-years { padding-top:4px; }
  .garden-year { padding:9px 15px; }
  .garden-empty { height:520px; }
  .garden-footer { margin:0 24px; align-items:flex-start; flex-direction:column; }
  .garden-footer nav { width:100%; justify-content:space-between; }
}
@media(prefers-reduced-motion:reduce) { .garden-note { animation:none; } .garden-note-anchor,.garden-write { transition:none; } }

/* Management stays outside the floral composition. */
.garden-management { display:flex; gap:16px; align-items:center; flex-wrap:wrap; justify-content:flex-end; }
.garden-management .text-button { min-height:36px; display:inline-flex; align-items:center; gap:5px; font-size:0.75rem; }
.garden-management svg { width:15px; height:15px; }
.letter-actions .text-button { min-height:44px; display:inline-flex; align-items:center; gap:6px; }
.danger-text { color:#a34252; }
.guestbook-manager { display:flex; flex-wrap:wrap; gap:14px; align-items:center; padding:8px 0 18px; }
.guestbook-manager p { flex-basis:100%; line-height:1.8; }
.guestbook-trash { max-height:65vh; overflow-y:auto; padding:2px 8px 12px 2px; }
.trash-note { padding:18px 0; border-bottom:1px solid #dfd9e4; }
.trash-note>div { display:flex; justify-content:space-between; gap:12px; }
.trash-note p { white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.8; margin:12px 0; }
.trash-note strong { overflow-wrap:anywhere; }
.trash-note span,.trash-note small { color:#6a6376; font-size:0.75rem; }
.trash-note .secondary-button { margin:12px 0 0; }
.trash-empty { padding:35px 0; text-align:center; color:#6a6376; }
.garden-note-anchor::after { content:''; position:absolute; top:6px; left:calc(50% - 4px); width:8px; height:12px; border-radius:2px; background:linear-gradient(90deg,#937b60,#cfbfa3 50%,#a68b6b); box-shadow:1px 2px 2px #4b395b30; pointer-events:none; z-index:3; }
.garden-note:focus-visible,.text-button:focus-visible,.garden-year:focus-visible { outline:2px solid #715196; outline-offset:4px; }
@media(max-width:760px) { .garden-management { gap:4px 12px; } .garden-management .text-button { font-size:0.6875rem; } .letter-actions { gap:8px 14px; } }
