@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Playfair+Display:wght@600;700&display=swap');

:root{
  --bg:#f3f0e9!important;--bg2:#ebe5da!important;--panel:#fffdf8!important;--panel2:#f8f4ec!important;
  --card:#fffdf8!important;--line:rgba(41,48,45,.13)!important;--text:#1d2421!important;--muted:#716e66!important;
  --teal:#244d43!important;--teal2:#173a32!important;--gold:#a8864c!important;--danger:#a33a32!important;
  --shadow:0 20px 60px rgba(34,38,35,.10)!important;
}
html{scroll-behavior:smooth}
body{background:linear-gradient(180deg,#eeeadf 0,#f7f4ed 34%,#f3f0e9 100%)!important;color:var(--text)!important;font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif!important}
body:before{content:'';position:fixed;inset:0;pointer-events:none;opacity:.35;background-image:radial-gradient(rgba(25,48,42,.08) .6px,transparent .6px);background-size:18px 18px;z-index:-1}
h1,.brand-title,.modal-title,.watch-title{font-family:'Playfair Display',Georgia,serif!important}
button{border-radius:999px!important;background:var(--teal)!important;color:#fff!important;box-shadow:none!important;letter-spacing:.01em;transition:.2s ease!important}
button:hover{transform:translateY(-1px);filter:none!important;background:var(--teal2)!important}
button.secondary,button.ghost{background:transparent!important;color:var(--text)!important;border:1px solid var(--line)!important}
button.secondary:hover,button.ghost:hover{background:#eee9df!important}
button.danger{background:#fff4f2!important;color:var(--danger)!important;border:1px solid rgba(163,58,50,.2)!important}
input,select,textarea{background:#fffdf9!important;color:var(--text)!important;border:1px solid var(--line)!important;border-radius:12px!important}
input:focus,select:focus,textarea:focus{border-color:var(--teal)!important;box-shadow:0 0 0 3px rgba(36,77,67,.10)!important}
label{color:var(--muted)!important}
.app{grid-template-columns:278px 1fr!important}
aside{background:rgba(255,253,248,.92)!important;border-right:1px solid var(--line)!important;backdrop-filter:blur(18px)!important;padding:24px 20px!important}
.logo-mark{background:var(--teal)!important;color:#fff!important;box-shadow:none!important;border:2px solid var(--teal)!important;overflow:hidden}
.logo-mark.gondolo-logo{background:#fff!important;color:transparent!important;padding:2px!important}
.logo-mark.gondolo-logo img{width:100%!important;height:100%!important;object-fit:contain!important;display:block!important;border-radius:50%!important}
.brand-title{font-size:20px!important;color:var(--text)!important}
.brand-sub{color:var(--muted)!important}
main{padding:28px clamp(18px,3vw,48px)!important;max-width:1720px;width:100%;margin:auto}
.hero{background:linear-gradient(125deg,#173b32,#2e5b50 62%,#9a7c48)!important;border:0!important;border-radius:32px!important;padding:clamp(28px,5vw,64px)!important;box-shadow:0 26px 70px rgba(24,48,42,.20)!important;color:#fff!important;min-height:280px;display:flex;flex-direction:column;justify-content:center}
.hero:after{width:360px!important;height:360px!important;border:1px solid rgba(255,255,255,.18)!important;right:-70px!important;top:-100px!important;box-shadow:0 0 0 40px rgba(255,255,255,.03),0 0 0 80px rgba(255,255,255,.025)}
.hero h1{font-size:clamp(28px,3.6vw,54px)!important;max-width:none;line-height:1.05;letter-spacing:0!important;white-space:nowrap}
.hero .subtitle{display:none!important}
.top-actions{position:relative;z-index:2}.hero .top-actions button{background:#fff!important;color:#173b32!important}.hero .top-actions button.secondary{background:rgba(255,255,255,.09)!important;color:#fff!important;border-color:rgba(255,255,255,.25)!important}
#syncStatus{color:rgba(255,255,255,.75)!important}
.metrics{gap:16px!important;margin:24px 0!important}
.metric{background:rgba(255,253,248,.94)!important;border:1px solid var(--line)!important;border-radius:20px!important;padding:20px!important;box-shadow:0 10px 35px rgba(34,38,35,.06)!important}
.metric .label,.metric .sub{color:var(--muted)!important}.metric .value{color:var(--text)!important;font-family:'Playfair Display',Georgia,serif;font-weight:700!important}
.tabs{background:#e9e4da!important;border:0!important;border-radius:999px!important;padding:5px!important;margin:10px 0 24px!important}
.tab{color:#5d615c!important}.tab.active{background:#fffdf8!important;color:var(--teal)!important;box-shadow:0 3px 12px rgba(34,38,35,.08)!important}
.chip{border:1px solid rgba(36,77,67,.18)!important;background:rgba(36,77,67,.06)!important;color:var(--teal)!important}
#cards{grid-template-columns:repeat(auto-fill,minmax(290px,1fr))!important;gap:24px!important}
.watch-card{background:var(--card)!important;border:1px solid var(--line)!important;border-radius:26px!important;box-shadow:0 12px 42px rgba(38,42,39,.07)!important;transition:.25s ease!important}
.watch-card:hover{transform:translateY(-7px)!important;border-color:rgba(36,77,67,.30)!important;box-shadow:0 24px 65px rgba(38,42,39,.13)!important}
.watch-img{height:340px!important;background:linear-gradient(145deg,#f0ece4,#fffdf9)!important;position:relative}
.watch-img:after{content:'View timepiece';position:absolute;left:50%;bottom:18px;transform:translate(-50%,8px);opacity:0;background:rgba(23,59,50,.92);color:#fff;padding:9px 15px;border-radius:999px;font-size:12px;transition:.2s ease;pointer-events:none}
.watch-card:hover .watch-img:after{opacity:1;transform:translate(-50%,0)}
.watch-img img{padding:14px;transition:transform .35s ease}.watch-card:hover .watch-img img{transform:scale(1.035)}
.watch-body{padding:20px!important}.watch-kicker{color:var(--teal)!important}.owner-name{color:var(--muted)!important}.watch-title{font-size:22px!important;color:var(--text)!important;margin-top:9px!important}
.watch-ref{color:var(--muted)!important}.spec{color:#5f625d!important;background:#f5f1e9!important;border-color:transparent!important}
.qs{background:#f8f4ec!important;border-color:transparent!important}.qs span{color:var(--muted)!important}.qs b{color:var(--text)!important}
.card-actions{border-top:1px solid var(--line);padding-top:14px}.card-actions button{font-size:12px!important}
.table-wrap{background:#fffdf8!important;border-color:var(--line)!important;box-shadow:0 12px 42px rgba(38,42,39,.06)}th{background:#244d43!important;color:#fff!important}tr:hover td{background:#f7f3eb!important}
.modal-backdrop{background:rgba(20,27,24,.72)!important;backdrop-filter:blur(8px)}.modal{background:#fffdf8!important;border:0!important}.modal-head{background:#244d43!important;color:#fff!important}.modal-tabs{background:#f3efe7!important}.modal-tab{color:var(--text)!important}.modal-tab.active{background:var(--teal)!important;color:#fff!important}
#lock{background:radial-gradient(circle at 70% 20%,rgba(168,134,76,.20),transparent 28%),linear-gradient(135deg,#173b32,#0e2620)!important}.lock-card{background:rgba(255,253,248,.96)!important;color:var(--text)!important;border:1px solid rgba(255,255,255,.3)!important}.lock-card .brand-sub{color:var(--muted)!important}

.detail-img{background:#fff!important;display:flex!important;align-items:center!important;justify-content:center!important;min-height:520px!important}
.detail-img img{width:100%!important;height:100%!important;max-height:70vh!important;object-fit:contain!important;display:block!important;padding:18px!important}

/* Added professional navigation */
.gw-pro-nav{display:none!important;position:sticky;top:0;z-index:12;margin:-28px clamp(-48px,-3vw,-18px) 24px;padding:14px clamp(18px,3vw,48px);align-items:center;gap:18px;background:rgba(247,244,237,.88);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.gw-pro-title{font-family:'Playfair Display',Georgia,serif;font-weight:700;font-size:20px;color:var(--text);margin-right:auto}.gw-pro-nav a{color:var(--muted);text-decoration:none;font-size:13px;font-weight:700}.gw-pro-nav a:hover{color:var(--teal)}
.gw-mode-pill{display:inline-flex;align-items:center;gap:7px;padding:8px 12px;border-radius:999px;background:#e8e3d9;color:var(--teal);font-size:12px;font-weight:700}.gw-mode-pill:before{content:'';width:7px;height:7px;border-radius:50%;background:#5f8b77}
.gw-favourite{position:absolute;top:14px;right:14px;z-index:2;width:38px;height:38px;padding:0!important;background:rgba(255,255,255,.88)!important;color:#8b877f!important;border:1px solid rgba(30,40,36,.10)!important}.gw-favourite.active{color:#a8864c!important;background:#fffaf0!important}
.gw-empty{grid-column:1/-1;text-align:center;padding:70px 24px;background:#fffdf8;border:1px dashed rgba(36,77,67,.25);border-radius:24px;color:var(--muted)}

@media(max-width:950px){.app{grid-template-columns:1fr!important}.gw-pro-nav{margin:-18px -18px 18px}.gw-pro-nav a{display:none}.watch-img{height:300px!important}}
@media(max-width:700px){.hero h1{font-size:clamp(22px,7vw,32px)!important;white-space:normal}}
@media(max-width:560px){main{padding:18px!important}.hero{border-radius:24px!important;min-height:250px}.metrics{grid-template-columns:1fr 1fr!important}.metric{padding:15px!important}.metric .value{font-size:20px!important}#cards{grid-template-columns:1fr!important}.gw-pro-title{font-size:17px}.gw-mode-pill{display:none}}

/* Premium dark editorial polish */
:root{--bg:#0D1117!important;--bg2:#101722!important;--panel:#111923!important;--panel2:#151F2B!important;--card:#121A24!important;--line:rgba(201,168,76,.20)!important;--text:#F7F2E8!important;--muted:#A7A18F!important;--teal:#1E4B43!important;--teal2:#163832!important;--gold:#C9A84C!important;--danger:#D0645B!important;--shadow:0 24px 70px rgba(0,0,0,.34)!important}
body{background:radial-gradient(circle at 18% 0,rgba(201,168,76,.13),transparent 28%),linear-gradient(180deg,#0D1117 0,#111923 45%,#0B0F15 100%)!important;color:var(--text)!important;font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif!important}
body:before{opacity:.18;background-image:linear-gradient(30deg,rgba(201,168,76,.16) 12%,transparent 12.5%,transparent 87%,rgba(201,168,76,.16) 87.5%,rgba(201,168,76,.16)),linear-gradient(150deg,rgba(201,168,76,.16) 12%,transparent 12.5%,transparent 87%,rgba(201,168,76,.16) 87.5%,rgba(201,168,76,.16));background-size:24px 42px}
button{background:var(--gold)!important;color:#111923!important;min-height:42px}
button:hover{background:#D7B95C!important}
button.secondary,button.ghost{background:rgba(255,255,255,.03)!important;color:var(--text)!important;border:1px solid var(--line)!important}
button.secondary:hover,button.ghost:hover{background:rgba(201,168,76,.10)!important}
input,select,textarea{background:#0D1117!important;color:var(--text)!important;border-color:var(--line)!important}
aside{background:rgba(13,17,23,.94)!important;border-right:1px solid var(--line)!important}
.logo-mark,.logo-mark.gw-monogram{background:linear-gradient(135deg,#17202B,#0D1117)!important;color:var(--gold)!important;border:1px solid rgba(201,168,76,.62)!important;font-family:'Playfair Display',Georgia,serif!important;font-size:16px!important;font-weight:700!important;letter-spacing:.02em}
.logo-mark img{display:none!important}
.hero{background:linear-gradient(125deg,#101722,#17202B 58%,#332B18)!important;border:1px solid rgba(201,168,76,.24)!important;box-shadow:0 26px 70px rgba(0,0,0,.34)!important}
.hero h1{font-size:clamp(28px,3.4vw,52px)!important;letter-spacing:0!important}
.hero .top-actions button{background:var(--gold)!important;color:#111923!important}
.hero .top-actions button.secondary{background:rgba(255,255,255,.06)!important;color:#fff!important;border-color:rgba(201,168,76,.32)!important}
.metric{background:linear-gradient(180deg,rgba(21,31,43,.96),rgba(13,17,23,.96))!important;border-color:var(--line)!important;box-shadow:0 16px 45px rgba(0,0,0,.24)!important}
.metric .label:before{content:'';display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--gold);margin-right:7px;vertical-align:1px}
.tabs{display:none!important}
.watch-card{background:var(--card)!important;border-color:var(--line)!important;border-radius:18px!important;box-shadow:0 18px 50px rgba(0,0,0,.24)!important}
.watch-kicker{color:var(--gold)!important}
.qs{background:rgba(255,255,255,.04)!important;border:1px solid rgba(201,168,76,.12)!important}
.table-wrap{background:#101722!important;border-color:var(--line)!important;box-shadow:0 12px 42px rgba(0,0,0,.22)!important}
th{background:#151F2B!important;color:#fff!important}
tr:hover td{background:rgba(201,168,76,.06)!important}
.modal{background:#111923!important;border:1px solid var(--line)!important}
.modal-head{background:#0D1117!important}
.modal-tabs{background:#151F2B!important}
.modal-tab.active{background:var(--gold)!important;color:#111923!important}
#lock{background:radial-gradient(circle at 70% 20%,rgba(201,168,76,.22),transparent 28%),linear-gradient(135deg,#0D1117,#111923)!important}
.lock-card{background:rgba(17,25,35,.94)!important;color:var(--text)!important;border:1px solid rgba(201,168,76,.24)!important}
.view-only-badge{border-color:rgba(201,168,76,.40)!important;color:var(--gold)!important;background:rgba(201,168,76,.08)!important}
