/* Phase 4: connected documents, rich media and update UX. Light/dark semantic tokens. */
:root{--v4-forest:#536D56;--v4-forest-text:#2D5B42;--v4-sage:#A7B89F;--v4-surface:#FAF9F6;--v4-ink:#1F1F1E;--v4-border:#E7E2DA}
.theme-dark{--v4-forest:#8DA992;--v4-forest-text:#A7C2A9;--v4-surface:#1A1D1C;--v4-ink:#EDEDE8;--v4-border:#343A35}
.utono-share-tabs{background:var(--v4-border)!important;border:1px solid var(--v4-border);gap:5px!important;padding:5px!important}
.utono-share-tabs button{color:var(--v4-ink)!important;opacity:.76;font-weight:650!important;letter-spacing:.01em;min-height:43px!important;transition:background .16s,color .16s,box-shadow .16s,opacity .16s}
.utono-share-tabs button:hover{opacity:1;background:color-mix(in srgb,var(--v4-surface) 65%,transparent)!important}
.utono-share-tabs button.selected{opacity:1!important;background:var(--v4-forest)!important;color:#fff!important;box-shadow:0 2px 8px #0002!important;font-weight:750!important}
.theme-dark .utono-share-tabs button.selected{background:#7A8F7E!important;color:#0F1110!important}
.utono-share-tabs button:focus-visible{outline:2px solid var(--v4-forest);outline-offset:2px}
/* Connected notes: real navigation actions with stable UUIDs. */
.utono-linked-note{border:1px solid var(--v4-border);border-radius:14px;max-width:100%;margin:14px 0;position:relative;background:var(--v4-surface)}
.utono-note-link-card{display:flex;align-items:center;gap:13px;text-align:left;width:100%;background:transparent!important;color:var(--v4-ink);border:0!important;padding:21px 43px 17px 18px;cursor:pointer;min-height:81px}
.utono-note-link-card>svg:first-child{color:var(--v4-forest);background:color-mix(in srgb,var(--v4-sage) 18%,transparent);padding:9px;width:38px;height:38px;border-radius:11px;flex-shrink:0}
.utono-note-link-card>span{flex:1;min-width:0;display:grid;gap:4px}.utono-note-link-card strong{font-size:14px;line-height:1.3;overflow-wrap:anywhere}.utono-note-link-card small{color:var(--utono-muted,#73766F);font-size:12px;overflow-wrap:anywhere}
.utono-note-link-card>svg:last-child{color:var(--v4-forest)}.utono-note-link-card:hover{background:color-mix(in srgb,var(--v4-sage) 9%,transparent)!important}
.utono-broken-link{border-style:dashed}.utono-broken-link .utono-note-link-card{opacity:.6}
.utono-link-target{border-radius:8px;background:color-mix(in srgb,var(--v4-sage) 30%,transparent);transition:background 1.5s}
.utono-backlinks{display:grid;gap:7px;margin:16px 0}.utono-backlinks strong{font-size:12px}.utono-backlinks button{display:flex;gap:8px;align-items:center;padding:9px 10px;border:1px solid var(--v4-border);background:transparent;border-radius:9px;font-size:12px;text-align:left;color:var(--v4-ink);cursor:pointer}.utono-backlinks small{font-size:11px;opacity:.7}
/* Audio: native accessible playback, restrained utono styling. */
.utono-audio-player{display:flex;gap:12px;align-items:center;padding:12px;border-radius:15px;background:linear-gradient(110deg,color-mix(in srgb,var(--v4-sage) 17%,var(--v4-surface)),var(--v4-surface));width:100%;min-width:0}
.utono-audio-ornament{width:42px;height:42px;flex-shrink:0;border-radius:50%;display:grid;place-items:center;background:var(--v4-forest);color:#fff}
.theme-dark .utono-audio-ornament{color:#0F1110}
.utono-audio-player audio{display:block;flex:1;min-width:0;max-width:100%;height:44px;accent-color:var(--v4-forest)}
.doc-embed-card .media-card:has(.utono-audio-player) .media-display{min-height:0;background:transparent!important}
/* Thumbnail-first video, instant video editing and original-link access. */
.utono-video-card{max-width:790px;border:1px solid var(--v4-border);background:var(--v4-surface);border-radius:18px;overflow:hidden;position:relative;padding:9px!important}
.utono-video-stage{position:relative;aspect-ratio:16/9;background:linear-gradient(125deg,#1F2824,#405749);border-radius:12px;overflow:hidden}
.utono-video-stage iframe{border:0;display:block;width:100%;height:100%}
.utono-video-play{position:relative;width:100%;height:100%;border:0;background:transparent;cursor:pointer;display:grid;place-items:center;padding:0;min-height:150px}
.utono-video-play img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.utono-video-play-icon{position:relative;z-index:1;width:66px;height:48px;display:grid;place-items:center;border-radius:15px;background:#1C251FDD;color:#fff;font-size:24px;box-shadow:0 3px 22px #0005;transition:transform .15s}
.utono-video-play:hover .utono-video-play-icon{transform:scale(1.08);background:#536D56}
.utono-video-details{display:flex;gap:6px 15px;align-items:center;justify-content:space-between;padding:12px 8px 4px;flex-wrap:wrap}
.utono-video-details strong{font-size:13px;color:var(--v4-ink)}
.utono-video-details a{font-size:12px!important;color:var(--v4-forest-text)!important;overflow-wrap:anywhere}
.utono-note-link-card:focus-visible,.utono-video-play:focus-visible{outline:3px solid var(--v4-forest);outline-offset:2px}
/* Installed-app update availability; never reload users while typing without consent. */
#utono-update-notice{position:fixed;right:20px;bottom:23px;z-index:4000;display:flex;gap:12px;align-items:center;flex-wrap:wrap;max-width:min(94vw,480px);padding:15px 17px;border-radius:16px;box-shadow:0 14px 40px #0003;background:var(--v4-surface);color:var(--v4-ink);border:1px solid var(--v4-border);font-size:13px}
#utono-update-notice[hidden]{display:none!important}
#utono-update-notice button{border:1px solid var(--v4-border);background:transparent;border-radius:9px;padding:9px 12px;color:inherit;cursor:pointer}
#utono-update-notice #utono-update-now{background:var(--v4-forest);color:#fff;border-color:transparent;font-weight:700}
@media(max-width:720px){.utono-video-play-icon{width:55px;height:42px}.utono-video-details{flex-direction:column;align-items:flex-start}.utono-linked-note .utono-note-link-card{padding:17px 40px 17px 12px}.utono-audio-player{padding:8px;gap:8px}.utono-audio-ornament{width:34px;height:34px}.utono-audio-player audio{height:40px}#utono-update-notice{bottom:max(85px,env(safe-area-inset-bottom) + 78px);left:12px;right:12px;max-width:none}}
/* Keep the sticky Share/Assistant controls uncovered while Document tools is open. */
@media(min-width:900px){.utono-content-frame.utono-has-note .utono-editor-inspector.inspector-open{top:157px;bottom:16px;max-height:calc(100dvh - 173px)}}
