
:root{
 --sky:#eaf8f5; --sea:#59bfb8; --sea-deep:#237c78; --sun:#f6b55f; --coral:#ef8c72;
 --leaf:#77aa72; --sand:#fff8ea; --paper:#fffdf8; --ink:#173b39; --muted:#6d7c78;
 --line:#e4dfd1; --white:#fff; --danger:#9a3f35; --ok:#2d6d51;
 --radius:22px; --shadow:0 16px 45px rgba(47,126,119,.12);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;background:var(--sand)}
body{margin:0;min-width:280px;min-height:100dvh;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;background:
radial-gradient(circle at 8% 4%,rgba(246,181,95,.20),transparent 26%),
radial-gradient(circle at 90% 18%,rgba(89,191,184,.17),transparent 30%),
linear-gradient(180deg,#fffdf7 0,#f6fbf9 52%,#fff8ea 100%);
color:var(--ink)}
html[dir="rtl"] body{font-family:Tahoma,Arial,sans-serif}
a{color:inherit;text-decoration:none}.shell{width:min(1180px,calc(100% - 28px));margin:auto}
.topbar{position:sticky;top:0;z-index:20;background:rgba(255,253,248,.92);border-bottom:1px solid rgba(35,124,120,.10);backdrop-filter:blur(15px)}
.topbar .inner{min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:max(8px,env(safe-area-inset-top)) 0 8px}
.brand{display:flex;align-items:center;gap:10px;font-weight:900;letter-spacing:.06em;color:var(--sea-deep)}.brand img{width:42px;height:42px}
.nav{display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.nav a,.nav button{font:inherit;border:0;background:transparent;color:var(--ink);padding:9px 10px;border-radius:11px;cursor:pointer}
.nav a:hover,.nav button:hover{background:rgba(89,191,184,.10)}.langs{display:flex;flex-wrap:wrap;gap:4px}.langs a{font-size:11px;padding:7px 8px;background:rgba(89,191,184,.08)}.langs a.active{background:rgba(246,181,95,.24);color:#875b19}
main{padding:24px 0 72px}
.hero{background:linear-gradient(135deg,rgba(255,250,240,.96),rgba(232,248,245,.95));border:1px solid #dfeee9;border-radius:32px;padding:clamp(24px,5vw,54px);box-shadow:var(--shadow);position:relative;overflow:hidden}
.hero:before{content:"";position:absolute;width:260px;height:260px;border-radius:50%;right:-70px;top:-95px;background:rgba(246,181,95,.17)}
.hero:after{content:"";position:absolute;width:210px;height:115px;border-radius:60% 40% 40% 60%;left:-55px;bottom:-60px;background:rgba(89,191,184,.13);transform:rotate(-8deg)}
.hero h1{position:relative;z-index:1;font-size:clamp(36px,7vw,72px);line-height:1;margin:0 0 14px;letter-spacing:-.04em;color:var(--ink)}
.hero p{position:relative;z-index:1;font-size:clamp(16px,2vw,20px);line-height:1.6;max-width:780px;color:#57716d}
.voice-stage{display:grid;place-items:center;margin:24px 0 8px;position:relative;z-index:2}
.mic{width:clamp(130px,28vw,190px);height:clamp(130px,28vw,190px);border-radius:50%;border:0;background:linear-gradient(145deg,var(--coral),var(--sun));color:#fff;box-shadow:0 20px 44px rgba(239,140,114,.28),inset 0 2px 0 rgba(255,255,255,.45);font-size:48px;cursor:pointer;display:grid;place-items:center;transition:.18s transform ease}
.mic:hover{transform:translateY(-2px) scale(1.01)}.mic.listening{animation:pulse 1.2s infinite}
@keyframes pulse{0%,100%{box-shadow:0 20px 44px rgba(239,140,114,.28),0 0 0 0 rgba(239,140,114,.22)}50%{box-shadow:0 20px 44px rgba(239,140,114,.28),0 0 0 20px rgba(239,140,114,0)}}
.voice-label{font-weight:850;margin-top:14px}.voice-result{margin-top:10px;max-width:700px;width:100%;text-align:center;color:var(--muted)}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px;margin-top:18px}.card{grid-column:span 4;background:rgba(255,253,248,.95);border:1px solid var(--line);border-radius:var(--radius);padding:20px;box-shadow:0 6px 24px rgba(31,90,84,.05)}
.card.wide{grid-column:span 8}.card.full{grid-column:1/-1}.card h2,.card h3{margin-top:0}
.pill{display:inline-block;padding:6px 10px;border-radius:999px;background:#e8f5f2;color:var(--sea-deep);font-size:12px;font-weight:850}
label{display:block;font-size:12px;font-weight:850;margin:13px 0 6px}input,textarea,select,button{font:inherit}
input,textarea,select{width:100%;min-height:46px;border:1px solid var(--line);border-radius:13px;padding:11px 12px;background:#fff;color:var(--ink);outline:none}
input:focus,textarea:focus,select:focus{border-color:var(--sea);box-shadow:0 0 0 4px rgba(89,191,184,.13)}
textarea{min-height:100px;resize:vertical}
button.primary,.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:13px;min-height:46px;padding:11px 15px;background:linear-gradient(145deg,var(--sea-deep),var(--sea));color:#fff;font-weight:850;cursor:pointer}
.btn.secondary{background:#eef8f6;color:var(--sea-deep)}.btn.sun{background:linear-gradient(145deg,var(--coral),var(--sun))}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}.notice{padding:11px 13px;border-radius:12px;margin:12px 0;background:#eaf6ef;color:var(--ok)}.notice.err{background:#f8e9e8;color:var(--danger)}
.muted{color:var(--muted)}.ui-id{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;color:#a06c30;font-weight:800}
table{width:100%;border-collapse:collapse}th,td{text-align:start;padding:10px;border-bottom:1px solid var(--line);font-size:14px;vertical-align:top}
th{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.capture-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;flex-wrap:wrap}
.status{font-size:12px;font-weight:900;padding:7px 10px;border-radius:999px;background:#eef8f6;color:var(--sea-deep)}
.menu-set{border:1px solid #e7e0d2;border-radius:16px;padding:14px;margin-top:12px;background:#fff}
.upload-note{font-size:12px;color:var(--muted)}
footer{color:var(--muted);font-size:12px;padding:24px 0 0}
@media(max-width:900px){.card,.card.wide{grid-column:span 6}.hero{border-radius:24px}}
@media(max-width:620px){
 .shell{width:calc(100% - 20px)}.topbar .inner{align-items:flex-start;flex-direction:column}.nav{width:100%;justify-content:flex-start}.card,.card.wide{grid-column:1/-1}
 main{padding-top:16px}.hero{padding:24px 18px}.hero h1{font-size:38px}.mic{width:150px;height:150px;font-size:42px}
}

.place-suggestions{margin-top:12px;border:1px solid #dfe9e5;border-radius:16px;background:#fff;overflow:hidden}
.suggest-head{padding:10px 12px;background:#f0faf7;color:var(--sea-deep);font-size:12px;font-weight:850}
.suggest-loading,.suggest-empty{padding:14px;color:var(--muted);font-size:13px}
.place-option{width:100%;border:0;border-top:1px solid #edf0eb;background:#fff;text-align:start;padding:12px 13px;cursor:pointer;color:var(--ink)}
.place-option strong{display:block;font-size:15px}.place-option span{display:block;margin-top:3px;font-size:12px;color:var(--muted)}
.place-option:hover,.place-option.selected{background:#fff5df}.place-option.selected{box-shadow:inset 4px 0 0 var(--sun)}
html[dir="rtl"] .place-option{text-align:end}
