:root{
  --bg:#f3f4ef;
  --surface:#fffef9;
  --ink:#15231d;
  --muted:#68726d;
  --green:#183f32;
  --green-2:#2e6b55;
  --lime:#d9ee91;
  --line:#dfe4de;
  --danger:#a43c38;
  --shadow:0 18px 60px rgba(20,44,34,.12);
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--ink)}
body{overflow:hidden}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
.app-shell{height:100dvh;display:grid;grid-template-rows:auto 1fr auto;max-width:1200px;margin:0 auto;background:var(--bg);position:relative}
.topbar{padding:calc(16px + env(safe-area-inset-top)) 18px 12px;display:flex;justify-content:space-between;align-items:center;background:linear-gradient(180deg,#f7f8f4 80%,rgba(247,248,244,0));z-index:5}
h1,h2,h3,p{margin:0}
h1{font-size:28px;letter-spacing:-.04em}.eyebrow{font-size:10px;letter-spacing:.16em;font-weight:800;color:var(--green-2);margin-bottom:4px}.icon-btn{width:42px;height:42px;border:1px solid var(--line);border-radius:50%;background:rgba(255,255,255,.8);font-size:24px;display:grid;place-items:center;color:var(--ink)}
main{min-height:0;position:relative}.screen{position:absolute;inset:0;display:none;overflow:auto;padding:0 14px 92px}.screen.active{display:block}.screen[data-screen="map"]{overflow:hidden;padding-bottom:82px}
.card{background:rgba(255,255,255,.9);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.9);box-shadow:0 8px 28px rgba(17,50,37,.07);border-radius:18px}
.map-toolbar{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;margin:0 0 10px;position:relative;z-index:2}.map-toolbar strong{display:block}.map-toolbar span{display:block;color:var(--muted);font-size:12px;margin-top:2px}.pill{border:1px solid var(--line);background:#fff;border-radius:999px;padding:8px 11px;font-size:12px;color:var(--green);font-weight:700}
.map-stage{height:calc(100% - 74px);position:relative;border-radius:22px;overflow:hidden;background:#e9ebe4;box-shadow:inset 0 0 0 1px #d8ddd6}.map-viewport{width:100%;height:100%;overflow:auto;touch-action:pan-x pan-y pinch-zoom;-webkit-overflow-scrolling:touch}.map-content{position:relative;width:max(100%,1100px);line-height:0;transform-origin:top left}.map-content img{display:block;width:100%;height:auto;user-select:none}.marker-layer{position:absolute;inset:0;pointer-events:none}.marker{position:absolute;transform:translate(-50%,-100%);pointer-events:auto;border:0;background:transparent;padding:0}.marker-pin{width:36px;height:36px;border-radius:50% 50% 50% 8px;transform:rotate(-45deg);background:var(--green);border:3px solid #fff;box-shadow:0 5px 14px rgba(15,46,35,.28);display:grid;place-items:center}.marker-pin::after{content:"";width:10px;height:10px;border-radius:50%;background:var(--lime)}.marker-label{display:block;transform:translateY(7px);background:rgba(255,255,255,.96);border:1px solid var(--line);box-shadow:0 4px 12px rgba(0,0,0,.08);border-radius:999px;padding:6px 9px;white-space:nowrap;font-size:11px;font-weight:800;color:var(--ink);line-height:1}.position-hint{position:absolute;left:50%;bottom:16px;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;border-radius:999px;padding:11px 14px;font-size:12px;font-weight:700;opacity:0;pointer-events:none;transition:.2s;box-shadow:var(--shadow);white-space:nowrap;max-width:90%;overflow:hidden;text-overflow:ellipsis}.position-hint.show{opacity:1;transform:translateX(-50%) translateY(0)}
.fab{position:absolute;right:26px;bottom:102px;width:62px;height:62px;border-radius:50%;border:0;background:var(--green);color:#fff;font-size:38px;line-height:1;box-shadow:0 16px 32px rgba(24,63,50,.28);z-index:4}.bottom-nav{height:calc(68px + env(safe-area-inset-bottom));padding:7px 20px calc(7px + env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(3,1fr);gap:6px;border-top:1px solid var(--line);background:rgba(253,253,250,.94);backdrop-filter:blur(16px);z-index:10}.nav-item{border:0;background:transparent;border-radius:14px;color:#78817d;font-size:11px;font-weight:700;display:flex;flex-direction:column;gap:2px;align-items:center;justify-content:center}.nav-item.active{background:#e7eee9;color:var(--green)}.nav-icon{font-size:21px;line-height:1}
.section-head{display:flex;justify-content:space-between;align-items:center;margin:8px 2px 18px}.section-head h2{font-size:27px;letter-spacing:-.04em}.round-add{width:46px;height:46px;border-radius:50%;border:0;background:var(--green);color:#fff;font-size:28px}.notice{display:flex;gap:10px;padding:14px;border-radius:16px;border:1px solid var(--line);background:#fff;margin-bottom:16px}.notice-icon{width:28px;height:28px;border-radius:50%;background:#e2f0cf;display:grid;place-items:center;color:var(--green);font-weight:900;flex:0 0 auto}.notice span{color:var(--muted);font-size:12px}.stack{display:grid;gap:10px}.empty-state{padding:28px 20px;text-align:center;background:#fff;border:1px dashed #cbd2cc;border-radius:18px;color:var(--muted)}.empty-state strong{display:block;color:var(--ink);font-size:17px;margin-bottom:6px}.plant-list{display:grid;gap:10px}.plant-row{display:grid;grid-template-columns:58px 1fr auto;gap:12px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:16px;padding:10px;text-align:left}.plant-thumb{width:58px;height:58px;border-radius:13px;object-fit:cover;background:#e4e9e4}.plant-thumb.placeholder{display:grid;place-items:center;font-size:26px;color:var(--green)}.plant-row small{display:block;color:var(--muted);margin-top:3px}.status-dot{width:9px;height:9px;border-radius:50%;background:#d6a437;margin-right:2px}.status-dot.ok{background:#3b825f}.row-status{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--muted)}
.sheet-backdrop{position:fixed;inset:0;background:rgba(13,29,23,.36);backdrop-filter:blur(2px);z-index:40;opacity:0;pointer-events:none;transition:.2s}.sheet-backdrop.show{opacity:1;pointer-events:auto}.sheet{position:fixed;left:50%;bottom:0;transform:translate(-50%,105%);width:min(720px,100%);max-height:92dvh;overflow:auto;background:var(--surface);border-radius:26px 26px 0 0;padding:8px 18px calc(22px + env(safe-area-inset-bottom));box-shadow:0 -24px 70px rgba(12,34,24,.25);z-index:50;transition:transform .28s cubic-bezier(.2,.8,.2,1)}.sheet.open{transform:translate(-50%,0)}.sheet-handle{width:44px;height:5px;border-radius:99px;background:#d2d7d2;margin:4px auto 16px}.sheet-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:16px}.sheet h2{font-size:25px;letter-spacing:-.035em}.add-methods{display:grid;gap:10px}.method-card{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;text-align:left;border:1px solid var(--line);background:#fff;border-radius:16px;padding:14px}.method-icon{width:44px;height:44px;border-radius:13px;background:#e8f0e9;display:grid;place-items:center;color:var(--green);font-size:20px}.method-card strong{display:block}.method-card small{display:block;color:var(--muted);margin-top:3px}.chev{font-size:28px;color:#9da5a0}.hidden{display:none!important}form{display:grid;gap:13px}.field{display:grid;gap:6px}.field>span{font-size:12px;font-weight:800;color:#4c5a53}.field b{color:var(--danger)}input,textarea,select{width:100%;border:1px solid #d9ded9;background:#fff;border-radius:12px;padding:12px 13px;outline:none;color:var(--ink)}input:focus,textarea:focus,select:focus{border-color:#6b987f;box-shadow:0 0 0 3px rgba(66,119,91,.11)}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.photo-picker{display:grid;grid-template-columns:80px 1fr;gap:12px;align-items:center;background:#f4f6f2;padding:10px;border-radius:16px}.photo-picker img{width:80px;height:80px;border-radius:12px;object-fit:cover}.source-policy{background:#eef4e9;border:1px solid #d6e3cf;border-radius:14px;padding:12px}.source-policy strong{font-size:13px}.source-policy p{font-size:12px;line-height:1.45;color:#536159;margin-top:4px}.primary-btn,.secondary-btn,.danger-btn{border:0;border-radius:14px;padding:13px 15px;font-weight:800;text-align:center}.primary-btn{background:var(--green);color:#fff}.secondary-btn{background:#e8eee9;color:var(--green)}.danger-btn{background:#f5e7e5;color:var(--danger)}
.detail-hero{position:relative;display:flex;gap:13px;align-items:center;padding:2px 0 14px;border-bottom:1px solid var(--line)}.detail-photo-wrap{width:72px;height:72px;border-radius:18px;overflow:hidden;background:#e7ece7;flex:0 0 auto}.detail-photo-wrap img{width:100%;height:100%;object-fit:cover}.detail-title h2{font-size:24px}.detail-title p{font-style:italic;color:var(--muted);font-size:12px;margin-top:3px}.detail-close{position:absolute;right:0;top:0}.status-chip{display:inline-block;border-radius:999px;background:#f4ecd7;color:#84651f;padding:4px 7px;font-size:10px;font-weight:800;margin-bottom:5px}.status-chip.ok{background:#e1f0e6;color:#316348}.detail-body{padding-top:16px}.detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.detail-meta-card{background:#f5f6f2;border-radius:13px;padding:11px}.detail-meta-card small{display:block;color:var(--muted);margin-bottom:4px}.detail-section{padding:18px 0;border-bottom:1px solid var(--line)}.detail-section h3{font-size:16px;margin-bottom:10px}.care-lock{padding:14px;border-radius:14px;background:#f5f1e8;color:#645d4c;font-size:13px;line-height:1.45}.care-card{padding:14px;border:1px solid var(--line);border-radius:14px;background:#fff;margin-bottom:9px}.care-card h4{margin:0 0 5px}.care-card p{font-size:13px;line-height:1.45;color:#4f5d56}.source-link{display:inline-flex;margin-top:9px;font-size:12px;font-weight:800;color:var(--green)}.muted{color:var(--muted);line-height:1.5}.detail-actions{padding-top:18px}.settings-stack{display:grid;gap:10px}.settings-card{border:1px solid var(--line);background:#fff;border-radius:14px;padding:13px}.settings-card p{color:var(--muted);font-size:12px;line-height:1.5;margin-top:5px}.file-label{display:block;cursor:pointer}.toast{position:fixed;left:50%;bottom:92px;transform:translate(-50%,20px);background:#13291f;color:#fff;padding:10px 14px;border-radius:999px;font-size:12px;font-weight:700;z-index:80;opacity:0;pointer-events:none;transition:.2s;box-shadow:var(--shadow)}.toast.show{opacity:1;transform:translate(-50%,0)}
@media (min-width:760px){body{padding:18px}.app-shell{height:calc(100dvh - 36px);border:1px solid #dde2dd;border-radius:28px;overflow:hidden;box-shadow:0 30px 100px rgba(19,50,38,.12)}.bottom-nav{max-width:480px;width:100%;margin:0 auto;border:1px solid var(--line);border-bottom:0;border-radius:22px 22px 0 0}.fab{right:40px}.map-content{width:max(100%,1250px)} }
@media (max-width:520px){.field-row{grid-template-columns:1fr}.map-content{width:1050px}.position-hint{white-space:normal;text-align:center}.topbar{padding-left:16px;padding-right:16px}}
/* V2 – mobile-first interactive garden map */
.map-toolbar{margin-bottom:8px;padding:9px 12px}.map-actions{display:flex;align-items:center}.zoom-controls{display:flex;gap:5px;background:#eef2ed;border-radius:13px;padding:3px}.zoom-btn{width:35px;height:35px;border:0;background:#fff;border-radius:10px;color:var(--green);font-size:20px;font-weight:800;box-shadow:0 1px 4px rgba(20,50,35,.08)}
.map-stage{height:calc(100% - 61px);border-radius:24px;background:linear-gradient(145deg,#dbe7d8,#eef3ea);box-shadow:inset 0 0 0 1px #d1ddd0,0 8px 26px rgba(31,65,45,.08)}
.map-viewport{overflow:hidden;touch-action:none;position:relative;cursor:grab}.map-viewport.dragging{cursor:grabbing}.map-content{position:absolute;width:1000px;height:650px;transform-origin:0 0;will-change:transform}.map-content img{width:1000px;height:650px;pointer-events:none}.marker-layer{width:100%;height:100%}
.marker{transform:translate(-50%,-50%);width:38px;height:38px;border-radius:50%;background:#fff;border:2px solid rgba(255,255,255,.95);box-shadow:0 5px 15px rgba(27,63,39,.25);display:grid;place-items:center;color:#28523a}.marker::before{content:"";width:25px;height:25px;background:currentColor;mask:var(--icon) center/contain no-repeat;-webkit-mask:var(--icon) center/contain no-repeat}.marker-label,.marker-pin{display:none}.marker[data-category="tree"]{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2c-3 0-5 2.3-5 5 0 .5.1 1 .3 1.4A4.5 4.5 0 0 0 8.5 17H11v5h2v-5h2.5a4.5 4.5 0 0 0 1.2-8.6c.2-.4.3-.9.3-1.4 0-2.7-2-5-5-5Z'/%3E%3C/svg%3E")}.marker[data-category="shrub"]{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 17a4 4 0 0 1 2-7.5A5 5 0 0 1 15.5 8a4.5 4.5 0 1 1 2 9H13v5h-2v-5H4Z'/%3E%3C/svg%3E")}.marker[data-category="hedge"]{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 8h18v10H3zM5 4h3v5H5zm6 0h3v5h-3zm6 0h3v5h-3zM6 18h2v4H6zm10 0h2v4h-2z'/%3E%3C/svg%3E")}.marker[data-category="flower"]{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 9c-4-7-9-2-5 2-6 2-3 8 2 5 0 6 6 6 6 0 5 3 8-3 2-5 4-4-1-9-5-2Zm0 1.5A2.5 2.5 0 1 1 12 15a2.5 2.5 0 0 1 0-5Z'/%3E%3Cpath d='M11 16h2v7h-2z'/%3E%3C/svg%3E")}.marker[data-category="perennial"]{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11 22v-8C5 14 3 9 3 5c5 0 8 2 9 5 1-4 4-6 9-6 0 6-3 10-8 10v8h-2Z'/%3E%3C/svg%3E")}.marker[data-category="fruit"]{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13 6c1-3 4-4 7-3-1 3-4 5-7 4v1c5-2 9 1 8 6-1 6-5 9-9 6-4 3-8 0-9-6-1-5 3-8 8-6V6h2Z'/%3E%3C/svg%3E")}.marker[data-category="vegetable"]{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11 8c-2-4-5-5-8-4 1 4 4 6 8 6-5 1-7 4-6 8 4 0 7-2 7-6 1 4 4 6 8 5 0-4-2-7-7-7 4-1 6-3 6-7-4 0-7 1-8 5Zm0 4h2v10h-2Z'/%3E%3C/svg%3E")}.marker[data-category="herb"]{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 22h-2c0-5 1-8 3-11-4 2-7 1-9-2 4-3 8-2 10 1 0-5 2-8 6-9 2 5 0 9-5 11-2 3-3 6-3 10Z'/%3E%3C/svg%3E")}.marker[data-category="container"]{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 9h10l-1 12H8L7 9Zm4-1C7 6 7 2 7 2c4 0 6 2 5 5 1-4 4-5 7-5 0 4-3 7-7 6h-1Z'/%3E%3C/svg%3E")}.marker[data-category="other"]{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm-1 5h2v6h-2V7Zm0 8h2v2h-2v-2Z'/%3E%3C/svg%3E")}
@media(max-width:520px){.topbar{padding-top:calc(10px + env(safe-area-inset-top));padding-bottom:8px}.topbar h1{font-size:24px}.topbar .eyebrow{display:none}.screen[data-screen="map"]{padding-left:8px;padding-right:8px}.fab{right:20px;bottom:94px}.map-toolbar span{font-size:11px}}